Design for startups
0 likes266 views
The document discusses design principles for startups. It emphasizes that the goal of design should be to solve users' problems by making products fast, easy to use and convenient. Graphics and aesthetics are less important to users than the functionality and user experience. The document provides examples of good and bad design and advises focusing on the user experience above other considerations like showing off technology or artistic style. It defines design as delivering tools that are fast, easy to use and convenient for users.
Design for startups
- 2. INTRODUCE <? echo ‘Hello world!’ ?>
- 3. 2000 2002 2004 2007 2009 2012 Dizyatec Pyramid Sony Y&R Ringier Singapore Consulting Vietnam Vietnam Vietnam Product Manager Web Designer Web Manager Interactive Mgr. DMD Asisstant NGUYEN NGOC HIEU www.ngochieu.com
- 4. 2012 CEO & Product Director Skynet Vietnam Feature Projects NGUYEN NGOC HIEU www.ngochieu.com
- 5. WHY WE DESIGN? WE DO ALL THIS?
- 6. WHY? WHY? SOLVE MAKE them we their LOVE us WANT problem User (and stay with us) (they don’t care about you to Click or your technology to Subscribe or your company to Register or your partner, your wife, your dog… to Purchase THEY JUST DON’T CARE) …
- 7. FINDING GOOD PROBLEM - A problem not yet solve by anyway SOLVE their - Or solved, but not completely problem
- 8. HOW? - Finding a good problem (business model) { - Not yet solve - Solved, but not completely (as your) SOLVE their { problem - Tool to solve - fast, convenience (technology) (they don’t care how strong, how complicated…) - Deliver your tool (design) { - fast, convenience (they don’t care how beautiful you are)
- 9. PRODUCT TEAM = Finding a good problem (business model) { - Not yet solve - Solved, but not co DEV TEAM = Tool to solve (technology) {- fast, convenience (they don’t care how strong, ho DESIGN TEAM = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beauti
- 10. PRODUCT TEAM = Finding a good problem (business model) { - Not yet solve - Solved, but not co DEV TEAM = Tool to solve (technology) {- fast, convenience (they don’t care how strong, ho DESIGN TEAM = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beauti
- 11. EXAMPLES DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 12. AMAZING GRAPHIC / BAD UX DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 13. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 14. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 15. www.eyeball-design.com DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 16. “POOR” GRAPHIC / GOOD UX DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 17. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 18. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 19. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 20. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 21. GREAT GRAPHIC / GREAT UX DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 22. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 23. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 24. POOR GRAPHIC / POOR UX? DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 25. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 26. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 27. GOOD DESIGN = EASY TO USE + GOOD LOOKING UX Art DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 28. BAD NEWS Art is what you born with Which mean it is HARD to improve DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 29. GOOD NEWS UX which is key to lead you to what you want CAN BE LEARN DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 30. BREAK DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 31. Task: DESIGN A CAR DASHBOARD DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 32. TECH’ DESIGN DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 33. ARTISTS’ DESIGN DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 34. WE WILL DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 35. WHAT IS DESIGN? DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 36. DESIGN IS NOT DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 37. NOT: Painting, Drawing, Decorating DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 38. NOT: How amazing it looks DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 39. NOT: Showing off technology DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 40. DESIGN IS just like air DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 41. FOCUS ON THE USER DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 42. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 43. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 44. USER CENTERED = get closer & closer to what your user need DESIGN
- 45. lean design DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 46. UX DESIGN from Strategy to Prototype Prototype Strategy Structure & Flow Mockup Functional Functional Prioritize Spec List Wireframe Information Information Design Architecture Content Strategy
- 47. STRUCTURE USER PERSONAS SCENARIOS & CASES TASK FLOW DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 48. Homepage DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 49. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 50. SCENARIOS
- 51. a house wife come to our website site, browse and purchase an item
- 52. a house wife come to our website site, browse and purchase an item
- 53. USER PERSONAS DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 54. USER PERSONAS Minimum Optional 1. Photo 1. Education level 2. Name 2. Salary range 3. Age 3. Personal Quote 4. Location 4. Online activities 5. Occupation 5. Offiline activities 6. Biography 6. Technical level 7. Social level 8. Mobile level DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 55. a house wife come to our website site, browse and purchase an item
- 56. CASES a house wife come to our website site, browse and purchase an item Parent Category Main Category Add to Cart Purchase Payment Confirm Done Sub Category Search One click purchase Confirm Done
- 57. iA DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 58. iA iA transform tons of content to well organize, easy to find, easy to understand content DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 59. INTERACTION DESIGN DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 60. FUNCTIONAL LIST All the “weapons” a page have to carry DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 61. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 62. PRIORITIZE LIST what is most important, what is nice to have, what is in the middle DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 63. WIREFRAME, MOCKUP & PROTOTYPE DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 64. WIREFRAME DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 65. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 66. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 67. How detail is enough? DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 68. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 69. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 70. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 71. Tools? DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 72. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 73. Paper & Pencil? No problem! DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 74. MOCKUP DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 75. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 76. PROTOTYPE DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 77. EXERCISE • Choose a page from a project • Describe your goal(s) • Build a functional list • Prioritize list • Wireframe DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 78. BREAK DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 79. REVIEW EXERCISE DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 80. USER EXPERIENCE DESIGN VISUAL DESIGN THE INTERFACE IS THE PRODUCT
- 81. GREAT INTERFACES
- 83. WHY Clear call to action Clear message Straight to the point
- 85. WHY Elegant Fun Clear call to action
- 86. CALL TO ACTION
- 87. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 88. WHAT DO YOU WANT ME TO DO???
- 89. DON’T CONFUSE ME
- 90. ALWAYS ASK YOURSEFL IS THIS CLEAR?
- 106. GREAT = Clear call to action Clear user feedback INTERFACES Clear workflow
- 107. VISUAL DESIGN DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 108. GOOD DESIGN IS C.R.A.P. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 109. CONTRAST REPETITION ALIGNMENT PROXIMITY DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 110. CONTRAST If elements on your page are not the same, make them very different. Contrast attracts the attention of your viewers. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 111. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 112. REPEAT Repeat visual elements throughout each page and your entire site. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 113. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 114. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 115. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 116. ALIGNMENT Every element should have a visual connection with another on the page DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 117. DO DON’T DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 118. DO DON’T DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 119. DO DON’T DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 120. PROXIMITY Items related to each other should be grouped close together. DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 121. DO DON’T DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 123. CONTRAST REPETITION ALIGNMENT PROXIMITY DESIGN = Deliver your tool (design) { - fast, easy, convenience (they don’t care how beautiful you are)
- 124. EXERCISE • Review a website • Determine their goal(s) • List out: • Call to action • Message • C.R.A.P
- 125. UX DESIGN FOR STARTUP Prototype Strategy Structure & Flow Mockup Functional Functional Prioritize Spec List Wireframe Information Information Design Architecture Content Strategy
- 126. LET’S BUILD A PRODUCT TO HELP YOUR USER (NOT TO SCREW THEM)
- 127. AND THEY WILL YOU
- 128. THANK YOU, AND I YOU NGUYEN NGOC HIEU ngochieu.com