Summary

Schnell mal ein paar Fotos bestellen

Fotobücher, Fotokalender, Fotogeschenke …. Das Schweizer Unternehmen ifolor hat ein riesiges Sortiment an Fotoprodukten. Und natürlich Software, teils komplexe Software die Nutzer beim Erstellen von Fotobüchern und vielen anderen Fotoprodukten nutzen. Über die Windows Software sollten nun das Bestellen von Fotoabzügen möglich werden. Klingt einfach. War es aber nicht. Also von vorne…

Meine Rolle: UX / UI Designer im Angestelltenverhältnis
Arbeitgeber: ifolor
Jahr: 2017

Produktgruppe Fotoabzüge
Produktgruppe Fotoabzüge

Empathise

Projektstart

Schon vor dem Projektstart konnten Fotoabzüge über die ifolor Webseite bestellt werden. Es gab also schon Erfahrungswerte die wir für die Windows Software nutzen konnten. Wir mussten zwei Nutzergruppen berücksichtigen. Die Erwartungshaltung der ersten Nutzergruppe war, möglichst schnell und einfach Fotos zu bestellen. Die zweite, wesentlich kleinere Nutzergruppe wollte natürlich auch Fotos bestellen :-). Jedoch nicht ohne die Fotos zuvor mithilfe der Software bearbeiten zu können.

Umsetzung

Klickstrecke

Die Klickstrecke war eine logische Abfolge - also keine große Herausforderung.

  1. Fotos hochladen und Format festlegen
  2. Format und Anzahl gewünschter Abzüge je Format ändern (optional)
  3. Einzelne Fotos zuschneiden, optimieren und beschriften (optional)
  4. In den Warenkorb legen und bestellen

Die Herausforderung lag im zweiten Schritt der Abfolge. Wie können Aktionen auf mehrere Fotos gleichzeitig angewandt werden. Das Aktionen an einem Foto (Single Select) können direkt an der (Foto) Kachel realisiert werden. Sollen die Aktionen auf mehreren Fotos angewandt werden müssen folgerichtig auch mehrere (Foto) Kacheln angewählt werden (Multi Select). Das führt dazu, dass die Aktionen ausgelagert werden müssen.

Single Select

Ein Nutzer kann von jeweils einem Foto mehrere Abzüge in unterschiedlichen Formaten bestellen.

Single select flow

Multi Select

Wenn ein Nutzer von mehreren Fotos die gleiche Anzahl an Abzügen im gleichen Format bestellen möchte, braucht es eine Multi Select Funktionalität. An den Kacheln auf der Bühne ließ sich die Funktionalität nicht abbilden. Die verbleibende Randspalte war somit gesetzt. Dort platzierte ich die gleichen Funktionselemente wie in einer einzelnen Kachel. Mit dem Unterschied, dass dich Änderungen bei der Anzahl und / oder dem Format auf alle zuvor selektierten Kacheln auswirkten. Ein intuitiver Multi Select war geboren und ist heute, 6 Jahre später noch erfolgreich im Einsatz.

Multi select flow