DOs und DON'Ts in der Konzeption

  • View
    1.266

  • Download
    0

  • Category

    Design

Preview:

DESCRIPTION

Bei der Analyse und Konzeption von Websites, Intranets und Applikationen tauchen immer wieder identische Frage- und Problemstellungen auf. Gerade die initialen Phasen eines Projekts sind entscheidend für den weiteren - erfolgreichen - Projektverlauf.

Citation preview

DOs & DON'Ts in �der Konzeption Björn Amherd Namics Conference 2012

@amherd

2

1 Vor der Analyse 2 Analysephase�3 Konzeptionsphase

DON'T: Die Offerte anderen überlassen.

Deine Erfahrung kann falsche Schätzungen für Aufwände oder Arbeitspakete einschränken.

3

DO: Plattformen und Endgeräte bestimmen

Mobile First sells – aber es gibt auch noch Desktops mit unterschiedlichen Browsern und Auflösungen. Was braucht der Kunde tatsächlich?

4

Zeitbedarf für Usability-tests unterschätzen

Für den Test und die Nachbesprechung/Protokollierung dieselbe Zeit (z.B. je 45 Min = 90 Min insgesamt) einrechnen. Pro Tag sind so "nur" 6 – 8 Tests möglich.

5

DON'T:

DO: Koordination von Interviews delegieren

Die Suche von Interviewpartnern und die Terminkoordination sind zeitaufwändig. Wenn wir dem Kunden unsere reservierten Timeslots bekanntgeben, kann er sich auf die Suche machen.

6

7

1 Vor der Analyse 2 Analysephase�3 Konzeptionsphase

DO: Surfen während der Arbeitszeit

In der Analysephase lohnt sich nicht nur der Blick zu den Konkurrenten des Kunden, sondern auch zu allgemeinen User Experience und Design Trends.

8

Inspiration für sich behalten

Bei der Vorbereitung der Konzeption sammelt man eine Unzahl an Beispielen, Lösungen und möglichen Ansätzen. Diese bitte "für später" (u.a. Designer) ablegen.

9

DON'T:

Pinterest.com nicht nur für angehende Bräute und Foodies

10

DON'T: Online-Umfragen ohne Funktionstest starten

Links zu einer elektronischen Umfrage vorher testen – auch auf die Funktionstüchtigkeit innerhalb des Netzwerks des Kunden.

11

DO: Kunden nach aktuellen Analyticszahlen fragen

Die Analyse einer aktuellen Sitemap ergibt wichtige Hinweise auf das Mengengerüst (Migration!). Wenn immer möglich, aktuelle Sitemaps mit Nutzerzahlen ergänzen.

12

13

Top 1 - 10

Top 11 - 20

Top 21 - 30

Sitemap Kennzeichnen der TopNN besuchten Seiten

DO: Zeit sparen bei der qual. Auswertung

Qualitative Antworten auf Umfragen sollten auch qualitativ ausgewertet werden. Für einen schnellen Überblick bei wenigen Befragten gibts aber hilfreiche Tools.

14

wordle.net Antworten kopieren, einfügen und Wortwolken generieren

15

16

1 Vor der Analyse 2 Analysephase�3 Konzeptionsphase

Ohne Ideation drauflos konzepten

Eine interdisziplinäre Ideationphase schafft nochmals den nötigen Abstand und bringt eine Vielzahl von möglichen Lösungen zum Vorschein.

17

DON'T:

DO: Skizzieren mit Stift �und Papier

Das Skizzieren eines möglichen Lösungsansatzes für eine Benutzeroberfläche geht schnell und zeigt schon nach wenigen Minuten, ob man sich in die richtige Richtung bewegt.

18

19

Vorlagen Gibts auch von Namics, z.B. Für Mobile Apps

https://know.namics.com/display/concept/Handgefertigte+Skizzen+VOR+dem+Tool-Einsatz

DO: Diskutieren und Challengen

Erste Entwürfe (digital oder analog) möglichst früh von anderen Konzeptern challengen/hinterfragen lassen. Projektunabhängige kommen meist mit den richtigen Fragen.

20

Wireframes in Farbe... ... und bunt!

Der Einsatz von Farben, Kundenlogo, Schriften oder Bildern lenkt von der Kernaufgabe des Wireframes ab. Vielmehr sollen IA und Bedienkonzept erlebt werden können.

21

DON'T:

Wireframes früh mit Interaktion anreichern

Entscheidungen über Varianten einer Benutzeroberfläche �kann man auch statisch in "Momentaufnahmen" treffen. �Erst beim Konsens mit dem Kunden wird das Ganze interaktiv.

22

DON'T:

DO: Wireframes/Protoypen mit einem Intro

Publizierte Wireframes und Prototypen machen sich beim Kunden manchmal selbständig. Für unvorbereitete Benutzer sollte deshalb unbedingt eine Introseite vorgeschaltet werden.

23

Interaction Design und visual Design trennen

Es klingt nach zwei Aufgaben und zwei Leuten. Im Idealfall sitzen diese nebeneinander und entwicklen zusammen die Lösung. Ihre Entscheidungen beeinflussen sich gegenseitig.

24

DON'T:

Präsentation auf �dem Beamer

Die Präsentation von Wireframes, Prototypen und Designs sollte wenn immer möglich auf dem echten Endgerät (iPad, Laptop, iPhone) geschehen. Niemand surft aufm Beamer.

25

DON'T:

Experiementierfreudige Navigationen

Form follows function. Es gibt bewährte und etablierte Standards, wo gewisse Interaktionsmöglichkeiten zu platzieren sind. Ausnahme: neue, zukunftsweisende Trends.

26

DON'T:

A A A Hilfslinks

Diese 3 Buchstaben bedeuten nicht, dass eine Seite barrierearm ist. Ausserdem reichen 3 Zoom-Stufen niemals aus. Sehbehinderte User wissen, wie sie zoomen müssen.

27

DON'T:

Magische Listen

Listen für "meistkommentiert", "meistgelesen" oder auch "verwandte Artikel" müssen irgendwie vom System generiert und automatisch updated werden. Aber wie?

28

DON'T:

"Hier steht der Text"

Echte Texte, bspw. für Interaktionselemente führen dazu, dass deren Aufgaben resp. Usability in der späteren Lösung früh challenged wird.

29

DON'T:

DO: Ein Klick aufs Logo führt zur Homepage

Diese Mindestanforderung sollten wir den Benutzern bieten. Zusätzlich unterstützt mit einem Home-Link ("oben links") .

30

DO: Neue Tools ausprobieren

Wenn sich die Gelegenheit ergibt, unbedingt neue Tools �(z.B. für Usertests, Befragungen, Feedbacks) in den Konzeptionsprozess einbeziehen… und weiterempfehlen!

31

32

Inspirationsquellen und Anregungen

know.namics > 2 Strategy & Concept > Dos & Donts für konzeptionell tätige Consultants

33 http://nam.to/dd

UX Bücher E-Books gibts z.B. auch bei Namics

34 http://nam.to/uxbooks

Merci! Follow me: @amherd @uxsux Mail me: bjoern.amherd@namics.com

Die know.namics-Seite zum Thema http://nam.to/dd Know.namics Bereich der UX Practice https://know.namics.com/display/ue/User+Experience+Home Set mit User Experience Blogs für Feedreader http://www.google.com/reader/bundle/user%2F01587456979107547545%2Fbundle%2FUX Hintergrundbilder dieser Präsentation von http://www.psdgraphics.com

36