Design für Nicht-Designern @ UX-Day Mannheim

2,586 views

Published on

Published in: Technology
1 Comment
6 Likes
Statistics
Notes
No Downloads
Views
Total views
2,586
On SlideShare
0
From Embeds
0
Number of Embeds
85
Actions
Shares
0
Downloads
22
Comments
1
Likes
6
Embeds 0
No embeds

No notes for slide

Design für Nicht-Designern @ UX-Day Mannheim

  1. 1. Design für Nicht-Designer. Lennart  Hennigs   UX  Day  Mannheim,  24.10.2013  
  2. 2. Vicco  von  Bülow,  1978.   Sie  sind  wohl  Designer,  was?  
  3. 3. Niemand versteht uns...
  4. 4. Sidney  Harris  –  From  “What's  so  Funny  about  Science”,  1977.  
  5. 5. “Wir vertreten die Interessen der Nutzer.“
  6. 6. hEp://www.flickr.com/photos/faasdant/3510772523/ Braun SK 6! Der Scheewittchensarg!
  7. 7. Zehn Thesen für gutes Design. 
 Dieter Rams. 1.  Gutes Design ist innovativ. ! 2.  Gutes Design macht ein Produkt brauchbar.! 3.  Gutes Design ist ästhetisch.! 4.  Gutes Design macht ein Produkt verständlich.! 5.  Gutes Design ist unaufdringlich.! 6.  Gutes Design ist ehrlich. ! !! 7.  Gutes Design ist langlebig.! 8.  Gutes Design ist konsequent bis ins letzte Detail.! 9.  Gutes Design ist umweltfreundlich.! 10.  Gutes Design ist so wenig Design wie möglich.! hEps://www.vitsoe.com/de/ueber-­‐vitsoe/gutes-­‐design  
  8. 8. …weil wir’s falsch machen!
  9. 9. http://www.flickr.com/photos/photography-andreas/ Wir müssen über den „Tellerrand” schauen.
  10. 10. usable ≠ erfolgreich
  11. 11. User Experience Technology Business Aspekte erfolgreicher Produkte. IDEO  –  Human  Centered  Design  Toolkit.  
  12. 12. http://www.flickr.com/photos/hoyvinmayvin/ Interdisziplinäre Zusammenarbeit.
  13. 13. Gutes Design braucht Kooperation.
  14. 14. Bill  Buxton  –  Sketching  User  Experiences.  
  15. 15. Deborah  Mayhew  –  The  Usability  Engineering  Lifecycle.  
  16. 16. hEp://www.flickr.com/photos/legofenris/5297917346/   ...auf einmal waren wir mitten drin.
  17. 17. hEp://www.flickr.com/photos/hoyvinmayvin/   Ein typisches Projekt?
  18. 18. Ein typisches Projekt? §  Viele Stakeholder. §  ...mit unterschiedlichen Vorstellungen und Prioritäten. §  Anforderungen sind komplex und miteinander verwoben. §  Das Problem ändert sich. §  Es ist „einmalig“. §  Es gibt im Voraus keinen Hinweis, was eine optimale Lösung ist. ?
  19. 19. hEp://shaEered-­‐black-­‐rose.deviantart.com/art/Wicked-­‐wallpaper-­‐38452670   P ROBLEMS Horst  RiEel  and  Melvin  Webber,  1973.    
  20. 20. Und nun?
  21. 21. Bösartige Probleme sind „leicht” zu lösen...
  22. 22. Bei bösartigen Problemen... 1.  Definiere eine gemeinsame Vision. 2.  Dokumentiere Ideen und kommuniziere sie. 3.  Binde Stakeholder ein. 4.  Mache kleine Schritte, überprüfe dein Ergebnis und iteriere. John  C.  Camillus  –  Strategy  as  a  Wicked  Problem,  2008.  
  23. 23. Diese Schritte sollten unsere Best Practices sein.
  24. 24. Was fange ich damit an?
  25. 25. 1. Definiere eine gemeinsame Vision. hEp://www.flickr.com/photos/hoyvinmayvin/  
  26. 26. Dilbert’s  Mission  Statement  Generator   Aber bitte nicht so.
  27. 27. METRO IS OUR DESIGN ETRO LANGUAGE. WE CALL IT METRO BECAUSE IT’S MODERN AND CLEAN. IT’S FAST AND IN MOTION. IT’S ABOUT CONTENT AND TYPOGRAPHY. AND IT’S ENTIRELY AUTHENTIC.
  28. 28. Metro Chad  Roberts,  Michael  Smuga,  Albert  Shum  –  Windows  Phone  UI  and  Design  Language.  
  29. 29. hEp://www.flickr.com/photos/hoyvinmayvin/4833003019/   The Elevator Pitch.
  30. 30. hEp://www.flickr.com/photos/hoyvinmayvin/   “Design the Box“ Exercise.
  31. 31. Take-­aways. Eine gute Produkt Vision... §  …wird gemeinsam vor Projektstart erstellt. §  …baut Team-Wissen auf. §  …dokumentiert und kommuniziert ein gemeinsames Ziel. §  …bezieht Position.
  32. 32. 2. Leite Design Prinzipien ab. www.thebricktestament.com  
  33. 33. IBM Design Principles. 1.  Concepts from the product's subject domain should be central and apparent in the software design. 2.  Keep it simple. 3.  Optimize the design for the most frequent or important tasks. 4.  Make the interface accessible and visible to users. 5.  Use proper default values when supporting complex tasks. 6.  Keep your users informed and in control by providing informative and timely feedback tailored to the current situation. Make your application predictable by using industry standard user interface conventions wherever possible. 11.  Always keep your target users in mind as the product is designed. 12.  Avoid adding features just so they can be ticked off a list. 13.  Design your user interface so that it can be localized for other geographies without redesigning the interface. 14.  Consider persons with disabilities when designing your applications. 15.  Design the application so that contextual help is available to users when they need it. Be flexible. 7.  10.  8.  9.  Things that look the same should behave in the same way, and an action should always produce the same 16.  result. Provide the ability to undo and redo actions. 17.  Bring objects to life through good visual design. Create user interfaces that promote clarity and visual simplicity. hEp://bit.ly/prinicples  
  34. 34. METRO IS OUR DESIGN ETRO LANGUAGE. WE CALL IT METRO BECAUSE IT’S MODERN AND CLEAN. IT’S FAST AND IN MOTION. IT’S ABOUT CONTENT AND TYPOGRAPHY. AND IT’S ENTIRELY AUTHENTIC. Chad  Roberts,  Michael  Smuga,  Albert  Shum  –  Windows  Phone  UI  and  Design  Language.  
  35. 35. Principles Clean, Light, Open, Fast Celebrate Typography Alive in Motion Content, Not Chrome Authentically Digital Chad  Roberts,  Michael  Smuga,  Albert  Shum  –  Windows  Phone  UI  and  Design  Language.  
  36. 36. Principle: Clean, Light, Open, Fast Feels Fast and Responsive Focus on Primary Tasks Do a Lot with Very Little Fierce Reduction of Unnecessary Elements Delightful Use of Whitespace Full Bleed Canvas Chad  Roberts,  Michael  Smuga,  Albert  Shum  –  Windows  Phone  UI  and  Design  Language.  
  37. 37. generische   Projekt-­spezifische   Design Prinzipien ≠ Design Prinzipien
  38. 38. Zehn Thesen für gutes Design. 
 Dieter Rams. 1.  Gutes Design ist innovativ. ! 2.  Gutes Design macht ein Produkt brauchbar.! 3.  Gutes Design ist ästhetisch.! 4.  Gutes Design macht ein Produkt verständlich.! 5.  Gutes Design ist unaufdringlich.! 6.  Gutes Design ist ehrlich. ! !! 7.  Gutes Design ist langlebig.! 8.  Gutes Design ist konsequent bis ins letzte Detail.! 9.  Gutes Design ist umweltfreundlich.! 10.  Gutes Design ist so wenig Design wie möglich.! hEps://www.vitsoe.com/de/ueber-­‐vitsoe/gutes-­‐design  
  39. 39. Take-­aways. Gute Design Prinzipien… §  ...sind Projekt spezifisch. §  ...beschreiben die angestrebte User Experience. §  ...inspirieren. §  ...helfen bei Design-Entscheidungen.
  40. 40. 3. Dokumentiere Ideen und kommuniziere sie. hEp://www.flickr.com/photos/hoyvinmayvin//  
  41. 41. So sehen unsere Spezifikationen für „normale Menschen“ aus.
  42. 42. hEp://www.flickr.com/photos/cannedtuna/   Sie sind nicht wirklich „usable“.
  43. 43. Fangt nicht so an…
  44. 44. …sondern so.
  45. 45. Take-­aways.   Sketching. §  Skizzen helfen das Problem zu verstehen. §  ...während man an der Lösung arbeitet. §  Sie sind schnell anzufertigen und wegzuwerfen.
  46. 46. 4. Binde Stakeholder ein. hEp://www.flickr.com/photos/hoyvinmayvin//  
  47. 47. Macht eure Ergebnisse greifbar.
  48. 48. Zeigt das große Ganze.
  49. 49. Take-­aways.   Sketching - Part 2.   §  Skizzen helfen das Problem zu verstehen. §  ...während man an der Lösung arbeitet. §  Sie sind schnell anzufertigen und wegzuwerfen. §  Konzepte können früher gezeigt und diskutiert werden. §  Skizzen sehen unfertig aus. §  Auch Nicht-Designer können einen Stift halten.
  50. 50. Design Studio.
  51. 51. 5. hEp://www.flickr.com/photos/jeffgamble/   Mache kleine Schritte, überprüfe dein Ergebnis und iteriere.
  52. 52. hEp://www.flickr.com/photos/oEerman/5253602842/   Design findet nicht im luftleeren Raum statt.
  53. 53. Gutes Design braucht Kooperation.
  54. 54. …und nur fünf Schritte:
  55. 55. 1. Definiert eine gemeinsame Vision hEp://www.flickr.com/photos/hoyvinmayvin/  
  56. 56. 2. Leitet Design Prinzipien ab.
  57. 57. 3. Dokumentiert Ideen und kommuniziert sie. hEp://www.flickr.com/photos/hoyvinmayvin//  
  58. 58. 4. Bindet Stakeholder ein. hEp://www.flickr.com/photos/hoyvinmayvin//  
  59. 59. 5. hEp://www.flickr.com/photos/jeffgamble/   Macht kleine Schritte, überprüft euer Ergebnis und iterier.
  60. 60. Vorteile?
  61. 61. http://www.flickr.com/photos/psmania// Diese Schritte lassen sich einfach und schnell umsetzen.
  62. 62. Sie liefern greifbare Ergebnisse.
  63. 63. http://www.flickr.com/photos/jeremymates/ Und sie sind „Menschen freundlich“.
  64. 64. Design für Nicht-Designer.
  65. 65. Design mit Nicht-Designern.
  66. 66. Dankeschön.
  67. 67. lennart.hennigs@telekom.de! ! @LennartHennigs! .T… http://www.telekom.com/design!

×