Incom ist die Kommunikations-Plattform der Fachhochschule Potsdam

In seiner Funktionalität auf die Lehre in gestalterischen Studiengängen zugeschnitten... Schnittstelle für die moderne Lehre

Incom ist die Kommunikations-Plattform der Fachhochschule Potsdam mehr erfahren

Ebay Kleinanzeigen. Fein anzeigen.

Im Kurs „Apps & Details“ von Frank Rausch war es Aufgabe eine App unserer Wahl nach den aktuellen iOS-Guidelines neu zu gestalten.

1. Mein Plan für das Redesign.

Beim Redesign der Ebay Kleinanzeigen-App lag mein Fokus auf zwei Punkten.

1. Punkt. Konzeptionelle Optimierung des User-Flows: Das Suchen & Finden eines Schnäppchens

2. Punkt. Visuelle Optimierung des GUIs nach iOS-Guidelines.

Ich entschied mich, den zusätzlichen Schritt der konzeptionellen Ausarbeitung zu gehen, weil ich ihn als festen Bestandteils eines Redesigns sehe.

2.1 Der Flohmarkt. Eine Verhandlungsbasis, die Alles vereint.

Endlich trifft man sich in der Mitte. Der Flohmarkt ist neuer Dreh- und Angelpunkt jeglichen Handelns. 

Ich wollte weitere Verwirrung für die User*innen vermeiden und entschied mich die Facetten des Handels (Suchen, Kaufen, Inserieren) auf einem Ort, auf einem Tab zu bündeln: auf dem Flohmarkt.

Slide 16_9 - 6.jpgSlide 16_9 - 6.jpg

Slide 16_9 - 20.pngSlide 16_9 - 20.png

Slide 16_9 - 19.pngSlide 16_9 - 19.png

Gerade Schnäppchenjäger*innen, die sich ziellos und ohne gewissen Plan in den Tiefen des Flohmarkts fallen lassen wollen, brauchen ein Umfeld, dass nicht nur angenehm von der Hand geht, sondern auch wegweisend ist. 

Daher entschied ich mich, die „Schnäppchen“ nur noch „häppchenweise“ in der Vertikalen durchstöbern zu lassen.

2.2 Hierarchie statt Anarchie.

Um das Stöbern zu erleichtern brauchte es dringend eine Überarbeitung der visuellen Hierarchien. 

Ich versuchte das anarchische Informationschaos mit einem neuen kleinen Design-System (Reduzierte Typo-Auswahl und neue CI Farbpalette) zu beruhigen und angenehmer für das shoppende Auge zu gestalten.

Slide 16_9 - 17.pngSlide 16_9 - 17.png

Slide 16_9 - 9.pngSlide 16_9 - 9.png

2.3 Ein neuer Filter, der das Original alt aussehen lässt

Gerade weil mein Fokus auf dem User-Flow vom Suchen und Finden lag, war es mir wichtig, die Filter-Funktion besonders angenehm zu gestalten.

Auch wenn die ursprüngliche Version sehr iOS-konform war, wirkte sie auf mich sehr inspirationslos. Daher entschied ich, mich an Komponenten zu wagen, die etwas verspielter, aber mir trotzdem nutzer*innenfreundlicher erschienen.

Ebenso entschied ich, die verschiedenen Parameter nicht hinter Drill-Downs zu verstecken, sondern alle gemeinsam auf einem Modal zu präsentieren - mit dem Hintergedanken eine höhere Accessibility und Spaß am Suchen zu erreichen.

Slide 16_9 - 8.pngSlide 16_9 - 8.png

Slide 16_9 - 21.pngSlide 16_9 - 21.png

2.4 Die Produktseite: Reduziert und hervorgehoben.

Steht man kurz davor ein erstes Angebot abzugeben, kommt es darauf an, das Wesentliche genau überblicken zu können. Daher musste auch hier wieder an der visuellen Hierarchie gedreht werden.

Irrelevante Informationen wurden verlagert, oder ganz aussortiert, relevante Informationen wurden hingegen visuell gebündelt und markanter dargestellt.

So, das wir alles Wichtige angenehm auf einem Blick haben - denn wir wissen: das Auge shoppt mit.

Slide 16_9 - 10.pngSlide 16_9 - 10.png

Slide 16_9 - 11.pngSlide 16_9 - 11.png

3. Ein Wort zum Wort.

Wie eventuell einige aufmerksame Augen festgestellt haben, habe ich mich entschieden die Tonalität der Marke der „typischen“ Ebay Kleinanzeigen-Experience anzupassen.

Für mich verkörpert EK einen seriösen, aber humanen Raum. Hier werden Geschäfte gemacht - aber eben auf sehr menschlicher Ebene. Das macht die meiste Zeit viel Spaß, kann aber auch in dem einen oder anderen Fettnäpfchen enden. 

Das müssen wir nicht verstecken – sondern sollten dazu stehen. Das macht die Marken-Erfahrung authentisch und etwas leichtfüßiger.

4. Und so sieht's aus.

alles.pngalles.png

Ein Projekt von

Fachgruppe

Interfacedesign

Art des Projekts

Studienarbeit im zweiten Studienabschnitt

Betreuung

foto: Frank Rausch

Zugehöriger Workspace

Apps & Details · WiSe 2022/23

Entstehungszeitraum

Wintersemester 2022 / 2023