top of page

Zara Shopping-App

Zara-Header

Disclaimer: Ich stand bei diesem Projekt in keiner Weise mit Zara in Verbindung.

Bedarf

Die iOS-App von Zara machte beim ersten Öffnen einen übersichtlichen Eindruck auf mich.

Als ich allerdings anfing, gezielt nach Produkten zu suchen und die Benutzerfreundlichkeit der App bis zum Bestellvorgang zu testen, bemerkte ich schnell, dass die Usability an einigen Stellen besser und intuitiver sein könnte.

Usability Testing

Durch Usability Tests fand ich heraus, dass auch andere Nutzer diese Probleme haben und als störend empfinden.

Hierfür bat ich Rezipienten unterschiedlichen Alters, welche die Zara-App vorher noch nie genutzt hatten, verschiedene Aufgaben zu erfüllen.

Hierbei beobachtete ich ihre Vorgehensweise und machte mir Notizen.

Folgende Fragen/Aufgaben wurden gestellt:

  1.   Beim Öffnen: Auf welcher Seite befindest du dich gerade?

  2.   Füge ein rotes Halstuch deinen Favoriten hinzu.

  3.   Ändere die Größe eines sich im Warenkorb befindlichen Artikels.

  4.   Ändere die Anzahl eines sich im Warenkorb befindlichen Artikels.

  5.   Lösche einen Artikel aus dem Warenkorb.

Zitate, die während des Tests fielen:

 

„Wieso ist das denn so schwer? Ich shoppe doch die ganze Zeit online.“

„Sehr nervig.“

„Das ist ja grausam.“

„Ich glaube es liegt an mir, ich mache sowas ja nicht so oft.“

„Löschen müsste doch eigentlich durch langes Drücken gehen?“

Auswertung

0/6   Personen wussten auf Anhieb auf welcher Seite sie sich beim Öffnen der App befinden.

2/6   Personen haben „Favoriten“ als solches erkannt.

1/6   Personen konnte die Größe eines sich im Warenkorb befindlichen Artikels ändern.

3/6   Personen konnten einen Artikel aus dem Warenkorb löschen.

3/6   Personen konnten die Anzahl eines Artikels im Warenkorb verändern.

Ideenfindung und Papier Prototyping

Bevor ich mit dem High Fidelity Design begann, entwarf ich zunächst Papier-Prototypen.

Hierfür sah ich mir die Shopping-Apps einiger Wettbewerber an, um herauszufinden, welche Layouts am besten funktionieren.

Basierend auf diesen Beobachtungen erstellte ich einen Papier-Prototyp für das Redesign der Zara-App.

Zara-Papier-Prototyp-1
Zara-Papier-Prototyp-2
Zara-Papier-Prototyp-3
Zara-Papier-Prototyp-4
Zara-Papier-Prototyp-5

Redesign

Momentan wird beim ersten Öffnen der App ein Teaser zur neuen Zara-Kollektion angezeigt. Wenn man das Video anklickt wird man zur Kategorie "Damen" weitergeleitet. 

Dass man sich im Moment auf der Seite, welche einen zu den Damen-Produkten führt befindet, kann der Nutzer allerdings nirgends sehen. Er bekommt nur angezeigt, zu welchen Kategorien er kommt, wenn er nach links oder rechts wischt. 

Deshalb verschob das Video ein wenig nach unten, um darüber angeben zu können, auf welcher Seite der User sich gerade befindet.

Zara-Redesign-1

Über das "Bookmark"-Icon können NutzerInnen Artikel favorisieren, um sie zu einem späteren Zeitpunkt wiederfinden und nochmal abrufen zu können.

Dieses Icon wurde im Usability Test nicht von allen Testpersonen als solches verstanden und alle Testpersonen gaben an, dass sie für diese Funktion ein "Herz"-Icon erwarten würden.

Zara-Redesign-2

Artikel, die sich im Warenkorb befinden, lassen sich nur schwer bearbeiten. Eine Option, um die Anzahl eines Artikels zu verändern, klappt durch Klicken von "Bearbeiten" in der rechten oberen Ecke auf. Gelöscht werden können Artikel, indem nun der kleine Kreis links neben dem Produktfoto angeklickt wird und "Löschen" geklickt wird, oder indem in der Hauptansicht ein Artikel nach links gewischt wird.

Die "Wischfunktion" hat keine meiner Testpersonen gefunden und die Hälfte der TesterInnen hat den "Bearbeiten"-Button übersehen und konnte somit weder den Artikel löschen, noch die Anzahl ändern.

Die Größe eines Artikels kann gar nicht geändert werden. Hierzu müssen die KundInnen erneut den Artikel suchen, in der gewünschten Größe in den Warenkorb legen und anschließend den Artikel anderer Größe aus dem Warenkorb entfernen.

Um all diese Probleme zu lösen, platzierte ich, zusätzlich zum weiterhin existierenden "Bearbeiten"-Button, die fehlenden bzw. schwer auffindbaren Funktionen sichtbar neben dem Produkt.

Zara-Redesign-3

Resümee

Zunächst war ich unsicher, ob dieses Projekt vielleicht zu klein und unwichtig ist, um es tatsächlich anzugehen. Während meiner Arbeit fiel mir jedoch auf, welch großen Unterschied die Veränderungen machen. Auch wenn der Großteil meiner Anpassungen im Warenkorb stattgfand, machen meine Neuerungen das Einkaufserlebnis einfacher und intuitiver. Durch die kleinen Anpassungen, behalten NutzerInnen ihr Shopping-Erlebnis in positiver Erinnerung.

bottom of page