Designing For Utility

Is design art? Is art design? What makes “Interaction Design” different than just “Design”? One of the differences is what we call wire-framing. People do this in a myriad of different ways. Some sketch, some digitize it but no matter which way its done its a step the process that sets Interaction Design apart from Design or Art. The purpose of wire-framing is…come and find out. I’ll walk through what I’ve learned.

Transcript

1. #DesignForUtility
   @ B E N P E C K • @ F R O N T • @ P D A U TA H
   

   View Slide

2. S T U D E N T S F I G H T I N G F O R U X
   uxd.byu.edu • @byuuxd
   

   View Slide

3. S O F T WA R E T H AT M A K E S P E O P L E S M A RT E R
   www.instructure.com • @instructure
   

   View Slide

4. T H E C O N F E R E N C E F O R U X + P M
   www.frontutah.com • @frontutah
   

   View Slide

5. # D E S I G N F O R U T I L I T Y
   1. Art
   2. Design
   3. Interaction Design
   Investigate
   Involve
   Imagine
   Iterate
   Illustrate
   Interface
   Interact
   Implement
   8I
   

   View Slide

6. # D E S I G N F O R U T I L I T Y
   1. Art
   2. Design
   3. Interaction Design
   Imagine
   Iterate
   Illustrate
   3I
   

   View Slide

7. A RT
   ART: (noun) the expression or application of human
   creative skill and imagination, typically in a visual form
   such as painting or sculpture, producing works to be
   appreciated primarily for their beauty or emotional power.
   

   View Slide

8. View Slide

9. “Creativity is allowing yourself to make mistakes. Art is
   knowing which ones to keep.”
   - Paul Rand
   

   View Slide

10. D E S I G N
    DESIGN: (noun) a specification of an object, manifested by
    some agent, intended to accomplish goals, in a particular
    environment, using a set of primitive components, satisfying
    a set of requirements, subject to some constraints.
    

    View Slide

11. View Slide

12. “Design is the method of putting form and content together.
    Design, just as art, has multiple definitions; there is no single
    definition. Design can be art. Design can be aesthetics.
    Design is so simple, that's why it is so complicated.”
    - Paul Rand
    

    View Slide

13. I N T E R A C T I O N D E S I G N
    The practice of designing interactive digital products,
    environments, systems, and services with the main focus
    being on behavior.
    

    View Slide

14. U T I L I T Y
    The state of being useful, profitable, or beneficial. 

    To the user and creators.
    

    View Slide

15. Investigate
    Involve
    Imagine
    Iterate
    Illustrate
    Interface
    Interact
    Implement
    8I
    

    View Slide

16. Imagine
    Iterate
    Illustrate
    3I
    

    View Slide

17. I M A G I N E
    ( M A P )
    Imagine
    Iterate
    Illustrate
    3I
    

    View Slide

18. W H Y S I T E M A P ?
    

    View Slide

19. View Slide

20. View Slide

21. View Slide

22. I T E R AT E
    ( D R A W )
    h t t p : / / w w w. s m a s h i n g m a g a z i n e . c o m / 2 0 1 1 / 1 2 / t h e - m e s s y - a r t - o f - u x - s k e t c h i n g /
    Imagine
    Iterate
    Illustrate
    3I
    

    View Slide

23. W H Y ? S K E T C H
    

    View Slide

24. View Slide

25. View Slide

26. View Slide

27. View Slide

28. View Slide

29. View Slide

30. View Slide

31. View Slide

32. View Slide

33. I L L U S T R AT E
    ( W I R E )
    Imagine
    Iterate
    Illustrate
    3I
    

    View Slide

34. W H Y W I R E F R A M E ?
    

    View Slide

35. View Slide

36. View Slide

37. View Slide

38. View Slide

39. View Slide

40. View Slide

41. T O O L S
    +
    

    View Slide

42. “Design is not just what it looks like and feels like.
    Design is how it works.”
    - Steve Jobs
    

    View Slide

43. “[Interaction] Design is not just what it looks like and feels like.
    [Interaction] Design is how it works.”
    - Steve Jobs
    

    View Slide

44. T H A N K S
    @ B E N P E C K • @ F R O N T • @ P D A U TA H
    

    View Slide