Design für Nicht-Designer

Design für Nicht-Designer.

Lennart Hennigs. Usability Professionals 2012, Konstanz.

Jackson Pollock – One: Number 31, 1950

Sidney Harris – From What's so Funny about Science, 1977.

UNSER ARBEITSUMFELD

http://www.flickr.com/photos/senorwences/2366892425/

2001.

2001.

http://www.flickr.com/photos/legofenris/5297917346/

...und auf einmal waren wir mitten drin.

Dieses Arbeitsumfeld ist herausfordernd.

http://www.flickr.com/photos/hoyvinmayvin/5166095952/

Wir sind mit unserem Thema oft allein.

http://www.flickr.com/photos/dudeoflego/5105353202/

Ein typisches Projekt?

§  Viele Stakeholder.

§  ...mit unterschiedlichen Vorstellungen und Prioritäten.

§  Anforderungen sind komplex und miteinander verwoben.

§  Das Problem ist schwer einzukreisen und verändert sich.

§  Das Problem ist „einmalig“.

§  Es gibt im Voraus keinen Hinweis, was eine optimale Lösung ist.

PROBLEMS

http://shattered-black-rose.deviantart.com/art/Wicked-wallpaper-38452670

Horst Rittel and Melvin Webber, 1973.

Was hilft gegen bösartige Probleme?

1.  Definiere eine gemeinsame Vision.

2.  Dokumentiere Ideen und kommuniziere sie.

3.  Binde Stakeholder ein.

4.  Mache kleine Schritte vorwärts, überprüfe dein Ergebnis und iteriere.

John C. Camillus – Strategy as a wicked problem, 2008.

METHODEN UND TECHNIKEN

Eine gemeinsame Produkt-Vision erstellen.


Eine gute Produkt-Vision beantwortet drei Fragen.

1.  Was ist das Ziel des Projekts bzw. welches Problem soll das Produkt lösen?

2.  Was macht das Produkt (aus Kundensicht) nützlich?

3.  Und wie (und wann) messe ich den Erfolg des Projekts?

è  Sie schafft ein gemeinsames Verständnis.

James Shore – The Art of Agile Development, 2010.

Metro

Chad Roberts, Michael Smuga, Albert Shum – Windows Phone UI and Design Language.

ETRO METRO IS OUR DESIGN 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.

Eine Produkt-Vision erstellen. The Elevator Pitch.

h4p://www.flickr.com/photos/hoyvinmayvin/4833003019/

Moore‘s Elevator-Pitch.

Für (Zielgruppe),

die (Bedürfnis / Problem) haben,

ist (Produktname) ein (Produktkategorie),

mit (den wichtigsten Funktionen).

Im Gegensatz zu (Wettbewerbern) bietet es

(Unterscheidungsmerkmale).

James Shore – The Art of Agile Development, 2010.

Adeo Rissi‘s Lückentext.

Meine (Firma),

entwickelt (ein Angebot),

um (der Zielgruppe)

mit (Problem)

durch (“geheime Zutat“) zu helfen.

Adeo Rissi – MadLibs for Pitching, 2011.

Eine Produkt-Vision erstellen. Design the Box.

http://www.flickr.com/photos/hoyvinmayvin/4823244616

Inhalte einer guten Verpackung.

§  Produktname

§  Ein Slogan, der den Nutzen des Produkts zusammenfasst

§  Eine Abbildung

§  Drei bis vier Verkaufsargumente

§  Eine Beschreibung der Features auf der Rückseite

§  Die technischen Anforderungen des Produkts

Jim Highsmith – Agile Project Management, 2004.

Design-Prinzipien ableiten.

Eigenschaften guter Design-Prinzipien.

§  Beschreiben die angestrebte User Experience.

§  Sind Richtlinien für die Produktentwicklung.

§  Helfen bei Design-Entscheidungen.

§  Geben dem Team ein gemeinsames Verständnis.

§  Inspirieren.

Design-Prinzipien kommen in vielen Geschmacksrichtungen.

Accessibility, Advance Organizer, Aesthetic Usability Effect, Affordance, Alignment, Iteration, Law of Prägnanz, Layering, Legibility, Life Cycle, Mapping, Mental Model,Mimicry, Anthropomorphic Form, Archetypes, Area Alignment, Attractiveness Bias, BabyFace Bias, Biophilia Effect, Cathedral Effect, Chunking, Classical Conditioning, Closure, Cognitive Dissonance, Color, Common Fate, Comparison, Confirmation, Consistency, Constancy, Constraint, Contour Bias, Control, Convergence, Cost Benefit, Defensible Space, Depth of Processing, Design by Committee, Desire Line, Development Cycle, Entry Point, Errors, Expectation Effect, Exposure Effect, Faceism Ratio, Factor of Safety, Feedback Loop, Fibonacci Sequence, FigureGround Relationship, Fitts Law, Five Hat Racks, FlexibilityUsability Tradeoff, Forgiveness, Form Follows Function, Framing, FreezeFlightFightForfeit, Garbage InGarbage Out, Golden Ratio, Good Continuation, Gutenberg Diagram, Hicks Law, Hierarchy, Hierarchy of Needs, Highlighting, Horror Vacui, HunterNrturer Fixations, Iconic Representation, Immersion, Inattentional Blindness, Interference Effects, Inverted Pyramid, Mnemonic Device, Modularity, Most Advanced Yet Acceptable, Most Average Facial Appearance Effect, Normal Distribution, Not Invented Here, Nudge, Ockhams Razor, Operant Conditioning, Orientation Sensitivity, Versus Preference, Personas, Picture Superiority Effect, Priming, Progressive Disclosure, Propositional Density, ProspectRefuge, Prototyping, Proximity, Readability, Recognition Over Recall, Red Effect, Redundancy, Rosetta Stone, Rule of Thirds, Satisficing, Savanna Preference, Scaling Fallacy, Scarcity, SelfSimilarity, Serial Position Effects, Shaping, SignaltoNoise Ratio, Similarity, Stickiness, Storytelling, Structural Forms, Symmetry, Threat Detection, Three Dimensional Projection, TopDown Lighting Bias, Uncanny Valley, Uncertainty Principle, Uniform Connectedness, Veblen Effect, Visibility, Visuospacial Resonance, von Restorff Effect, WabiSabi, Waist to Hip Rat, Wayfinding, Weakest Link

Universal Priniciples of Design. 2nd Edition.

Dieter Rams – Zehn Regeln für gutes Design.

1.  Gutes Design ist innovaQv.

2.  Gutes Design macht ein Produkt brauchbar.

3.  Gutes Design ist ästheQsches Design.

4.  Gutes Design macht ein Produkt verständlich.

5.  Gutes Design ist ehrlich.

6.  Gutes Design ist unaufdringlich.

7.  Gutes Design ist langlebig.

8.  Gutes Design ist konsequent bis ins letzte Detail.

9.  Gutes Design ist umwel^reundlich.

10. Gutes Design ist so wenig Design wie möglich.

Braun SK 6"Der Schneewittchensarg"

http://www.flickr.com/photos/8944091@N08/1001381548/

http://www.cultofmac.com/

http://www.cultofmac.com/

Dieter Rams – Zehn Regeln für gutes Design.

1.  Gutes Design ist innovaQv.

2.  Gutes Design macht ein Produkt brauchbar.

3.  Gutes Design ist ästheQsches Design.

4.  Gutes Design macht ein Produkt verständlich.

5.  Gutes Design ist ehrlich.

6.  Gutes Design ist unaufdringlich.

7.  Gutes Design ist langlebig.

8.  Gutes Design ist konsequent bis ins letzte Detail.

9.  Gutes Design ist umwel^reundlich.

10. Gutes Design ist so wenig Design wie möglich.

Probleme mit generischen Design-Prinzipien.

§  Zu generisch. Was bedeuten sie für mein Produkt?

§  Zu abstrakt. Welche Flughöhe ist die richtige?

§  Zu unspezifisch. Einfach? User friendly? Herausragend? Schnell?

§  Zu gut gemeint. Wer kann sich 17 Regeln merken? Oder 125?

§  Zu viel gewollt. Regeln widersprechen sich.

§  Zu beliebig. Wo kommen sie her?

Projekt-relevante Design-Prinzipien sind...

§  Projektbezogen. Zugeschnitten auf das aktuelle Projekt.

§  Konkret. Beschreiben Alleinstellungsmerkmale.

§  Eindeutig. Knapp und frei von Widersprüchen.

§  Selektiv. 4 - 7 Prinzipien reichen.

§  Fundiert. Basieren auf Ergebnissen des User Research.

§  Prägnant. Eingängig und einfach zu merken.

Charmr.

1.  Wear it during sex.

2.  Make better use of data.

3.  Easy to learn and teach/No numbers.

4.  Less stuff.

5.  Keep diabetics in control.

6.  Keep diabetics motivated.

http://www.adaptivepath.com/ideas/charmr-creating-concepts


Ideen beschreiben und kommunizieren.

So sehen unsere Spezifikationen für Nicht-UX Professionals aus.

Unsere Dokumente sind nicht selbsterklärend.

http://www.flickr.com/photos/cannedtuna/4853380320/

Vorteile von Papier-Skizzen

§  Konzepte können früher gezeigt und diskutiert werden.

§  Man kann frühzeitig Feedback einholen.

§  Man macht es Projektpartnern einfach Feedback zu geben.

Man kann Stakeholder einbeziehen.


Design Studio.

!

§  Stammt aus dem Industriedesign & der Architektur.

§  Interdisziplinärer Workshop...

§  ...in dem Lösungsvorschläge für Teilprobleme im Team erarbeitet

werden.

Design Studio.

1.  Brainstorming

2.  Varianten skizzieren

3.  Ergebnis präsentieren

4.  Feedback einholen

5.  Beste Ideen zusammenführen

...unter Zeitdruck.

Design Studio Schritte.

NUTZEN

Diese Methoden sind schnell umzusetzen.

http://www.flickr.com/photos/psmania/7400709160/

http://www.flickr.com/photos/jeremymates/2976486131/

Diese Methoden sind „menschenfreundlich“.

Design-Prinzipien

Wenn die Ergebnisse „sticky“ sind... h4p://www.heathbrothers.com/resources/download/#made-‐to-‐sQck

...und greifbar.

http://www.flickr.com/photos/12247552@N08/4667157249/

h4p://www.flickr.com/photos/o4erman/4475203104/

Wie kann man unsere Ergebnisse weiter verwenden?

HTC Hero.

1.  Make it Mine: personalization needs to reach a level never before possible.

2.  Stay Close: staying in touch with the people in your life means managing a variety of communication channels and applications.

3.  Discover the Unexpected: many of the most memorable moments in your life are experienced, not explained.

http://www.youtube.com/watch?v=kshGq8COSiM

http://www.flickr.com/photos/cannedtuna/4852756417

Personas.

http://www.gigaset-elements.de/

http://www.doro.com/Global/Campaigns/Experience/Doro_B2B_32s_260x190_low.pdf

Fragen?

http://www.flickr.com/photos/gladius/3813345704/

Technology

Design für Nicht-Designer