Simplease-Logo

Im Simplease-Blog schreiben wir über Design, Web-Entwicklung und unser Leben als Selbstständige.

Checkliste für User Interface Designer

von Stefan Rössler am 31. August 2011

Für User Interface Designer stellen sich immer dieselben Fragen: Hab ich an alles gedacht? Hab ich für jede mögliche Interaktion, ein Interface gestaltet? Wie kann ich wissen, dass ich nichts vergessen habe?

Wir haben jetzt eine Checkliste entdeckt, die uns dabei hilft, diese Fragen zu beantworten. Die einzelnen Punkte stammen aus dem Sprachgebrauch von Programmierer und scheinen deshalb vielleicht abschreckend, sind aber in der Praxis einfach anzuwenden:

  • Index
  • Show
  • New
  • Edit
  • Delete

Am Anfang war das Model

Ryan Singer erklärt in diesem Video, dass am Beginn jedes Projekts ein Model steht. Das ist das englische Wort für Modellierung, und manchen vielleicht im Zusammenhang mit Datenbanken bekannt. Es geht dabei aber nicht um Datenbanken oder Code, sondern um ein grundsätzliches Verständnis der Aufgabe.

Die Aufgabe kann sein, einen Webshop zu gestalten, das Interface für ein iPhone-App zu designen, oder eine neue Buchhaltungs-Software zu entwickeln. Wir wollen z.B. gerade eine Web-Anwendung machen, mit der wir unsere beruflichen Fahrten erfassen können, um kein Fahrtenbuch mehr führen zu müssen.

Praxis-Beispiel: Fahrtenbuch

Bevor wir mit dem Design beginnen können, müssen wir uns erst überlegen, was genau wir eigentlich machen wollen. Was soll unser digitales Fahrtenbuch alles können? Wir sprechen dann solange darüber, bis wir unsere Anwendung in ein bis zwei Sätzen erklären können:

Fahrer sollen die beruflichen Fahrten mit ihrem Auto eintragen können.

Dieser eine Satz ist das Ergebnis unserer Modellierung. Damit wir die Checkliste verwenden können, untersuchen wir den Satz nach Hauptwörtern. Fahrer, Fahrten und Autos. Um diese drei Objekte dreht sich unsere Anwendung.

Checkliste im Einsatz

Fahrer Fahrten Autos
Index Index Index
Show Show Show
New New New
Edit Edit Edit
Delete Delete Delete

Wenn wir am Interface arbeiten, können wir diese Liste als Anhaltspunkt verwenden. Wir wissen z.B. dass wir einen Index für Fahrer, Fahrten und Autos brauchen. Das heißt wir brauchen irgendeine Möglichkeit, alle Fahrer mit ihren Fahrten und den Autos anzuzeigen (z.B. eine Liste).

Außerdem müssen wir die einzelnen Fahrer anzeigen, etwa in einer Detailansicht (Show). Natürlich müssen wir neue Fahrten eintragen (New), den Namen eines Fahrers ändern (Edit), oder ein Auto löschen können (Delete). Genau diese 5 Aktionen sollen mit jedem Objekt möglich sein.

Was wir gelernt haben

Das Design eines User Interfaces beruht in erster Linie auf einem Modell. Dieses Modell zeigt alle Objekte, und wie diese miteinander verbunden sind. Wie dieses Modell aussieht, erfahren wir nur, wenn wir mit den Leuten sprechen, die unsere Lösung später auch verwenden werden. Oder wenn wir diese Leute selbst sind, wie im Beispiel vom Fahrtenbuch.

Wenn wir am Beginn eines Projekts ein gutes Modell entwickeln, können wir die Checkliste verwenden, um einen Überblick darüber zu haben, was wir schon gemacht haben, und was noch zu tun ist. Die Liste ist ein Template, das uns dabei hilft, kreativ zu werden, und eine gute Software zu entwickeln:

Creativity starts with templates. Chip und Dan Heath, Made to Stick: Why Some Ideas Survive and Others Die
Remote Usability Tests - einfach gemacht.
Vorheriger Artikel: Software, die gut in der Hand liegt
Nächster Artikel: 3 Dinge, die Interface-Designer von Filmemachern lernen können

Bisher 7 Kommentare

  1. Pingback Carrot on a stick: Usability Review von experteer.at | Simplease Blog10. Oktober 2011

    […] Checkliste für User-Interface Designer […]

  2. Pingback Checkliste für User Interface Designer | Simplease Blog | UXWeb.info18. März 2012

    […] Fragen: Hab ich an alles gedacht? Hab ich für jede mögliche Interaktion, ein Interface gestaltet? Link – Trackbacks Posted in User experience (UX) | Permalink. ← RT @cafedejoe […]

  3. Pingback Checkliste für User Interface Designer | Simplease Blog | UXWeb.info18. März 2012

    […] Fragen: Hab ich an alles gedacht? Hab ich für jede mögliche Interaktion, ein Interface gestaltet? Link – Trackbacks Posted in User experience (UX) | Permalink. ← Visual Guide to UX […]

  4. Pingback Checkliste für User Interface Designer | Simplease Blog | UXWeb.info18. März 2012

    […] Fragen: Hab ich an alles gedacht? Hab ich für jede mögliche Interaktion, ein Interface gestaltet? Link – Trackbacks Posted in User experience (UX) | Permalink. ← Gerry McGovern asks: […]

  5. Pingback Checkliste für User Interface Designer | Simplease Blog | UXWeb.info19. März 2012

    […] Fragen: Hab ich an alles gedacht? Hab ich für jede mögliche Interaktion, ein Interface gestaltet? Link – Trackbacks Posted in User experience (UX) | Permalink. ← […]

  6. Pingback Checkliste für User Interface Designer | Simplease Blog | UXWeb.info19. März 2012

    […] Fragen: Hab ich an alles gedacht? Hab ich für jede mögliche Interaktion, ein Interface gestaltet? Link – Trackbacks Posted in User experience (UX) | Permalink. ← RT @webaxe: Slides from […]

  7. Pingback Checkliste für User Interface Designer | Simplease Blog | UXWeb.info19. März 2012

    […] Fragen: Hab ich an alles gedacht? Hab ich für jede mögliche Interaktion, ein Interface gestaltet? Link – Trackbacks Posted in User experience (UX) | Permalink. ← OMG I Found an […]

Du hast eine Meinung dazu? Wir freuen uns :)

Nach Kategorie filtern

Produkte von Simplease

Userbrain - Usability Testing

User-Tests einfach und am laufenden Band.
Mehr erfahren

Neue Artikel per E-Mail

Facebook Link Twitter Link