.webp)
Verbraucherportal für mobile Nutzung neu gestaltet
Hintergrund
Testberichte ist ein Verbraucherportal auf dem Menschen Produktentscheidungen treffen und die erste Adresse im Dschungel der Produktwahl.
Hier begegnen Verbraucher professionellen Bewertungen von Redakteuren sowie hilfreichen Kommentaren von anderen Nutzern, die bei der Entscheidungsfindung unterstützen.
Die Challenge
Das ursprüngliche Portal war in die Jahre gekommen und nicht mobilfreundlich – die Inhalte wurden auf Smartphones und Tablets nicht optimal dargestellt.
Meine Mission? Die Plattform für mobile Geräte fit machen und dabei ein frisches, neues Corporate Design schaffen, das auch neue Zielgruppen anspricht.
Meine Rolle
Meine Verantwortung war es die alte Plattform in ein neues Corporate Design und das alte Portal in ein Responsives Design umzusetzen. In meiner Rolle als UX/UI Designerin war ich vom Research bis zum Release in jeder Phase dabei.
Teamstruktur
Unser Produktentwicklung Team setzte sich aus mehreren UI/UX Designern, Researchern und Projektmanagern zusammen. Je nach Projektherausforderungen und Phase wurden Teams zusammen gestellt in denen ich tätig war.
Einblicke in den Design Prozess
- Wettbewerber Analyse
- SWOT Analyse
- Sinus-Milieus
- Personas
- Interviews
- Shadowing im Geschäft
- Landingpage
- SEA-Kampagne (echte Nutzung, keine Tester) über Google-Anzeigen
- Remote-Test Screensharing (Aufgaben gesteuert)
- Ideation Workshops zu bestimmen Produktgruppen (Zelte, Laufschuhe, und Tennisschläger)
- Paper Prototyping
- Prototypen
- UX/UI Design
- Icon Library für Produktgruppen
- Styleguide
- neues Corporate Design
- A/B-Testing, Datenauswertung
- Nutzertests
- Guerilla Befragung
Research & Analyse
Wettbewerbsanalyse, Sinus-Milieus & User Testing
Corporate Design
Die ursprüngliche Farbpalette wurde durch ein belebendes Petrol ersetzt und es erfolgte eine Anpassung der Schriftart, begleitet von der Einführung einer Bildmarke – ein verspielter Kringel, der symbolisch für Entscheidungen steht.
.webp)
Mockups & Wireframes
In unzähligen Iterationen haben wie die Produktkacheln neu gestaltet, getestet, gemessen und optimiert.
Responsives Design (Flexbox)
UX Design in Sketch
Kollaboration zwischen Design und Entwicklung in Zeplin.io
Herausforderung beim Konzept
Die Hauptchallenge bestand darin, zahlreiche Bannerplätze zu integrieren, da Testberichte einen bedeutenden Anteil der Einnahmen durch Bannerwerbung generierten. Anschließend lag der Fokus auf der Optimierung verschiedener Kategorien, einschließlich des Umzugs und der Pflege inaktiver Produkte. Die Bewertung im Kringel, die in bestimmten Größen schwer erkennbar war, wurde durch die Erstellung individueller Icons für jede Kategorie verbessert. Ein Designer widmete mehrere Wochen ausschließlich der Icon-Gestaltung. Die Anpassung des Produktvergleichs für mobile Geräte war besonders zeitintensiv während der Konzeptionsphase.
Die neue Plattform
Ideation Projekte
Nachdem die Plattform im Mai 2017 live ging, konzentrierten wir uns in der Produktentwicklung darauf, die Plattform zu optimieren und neue Ideen zu entwickeln. In Design-Sprints und Ideation-Formaten stellten wir verschiedene Projektteams zusammen und erarbeiteten Konzepte, um den Nutzern bei ihrem Kaufentscheidungsprozess zu helfen.
Guerilla-Research zum Thema Laufschuhe im Alexa in Berlin
Strategische Entscheidung
Die neue Plattform wurde im Mai 2017 live gestellt und war etwa 6 Monate live.
Der Sichtbarkeitsindex nahm bei Testberichte und seinen Wettbewerbern
(idealo.de und notebookcheck.com) deutlich ab. Grund dafür war das Google Panda-Update der den Suchalgorithmus von Google beeinflußt. Contentportale profitierten von den Google Updates, Website mit minderer Qualität oder wenig Inhalten wurden hingegen abgestraft. Der Traffic von Google brach so stark ein, dass eine wirtschaftliche Entscheidung getroffen werden musste und da das Geschäftsmodell von Testberichte auf der Integration von Bannern basierte und der Traffic die größte Einnahmequelle war wurde die alte orange Plattform wieder zurück gebaut.
Die alte und die neue Welt
Zurück zur alten Welt
Nachdem die alte Plattform zurück gebaut wurde wurden neue Konzepte per A/B-Tests optimiert.
.webp)
Design Sprint, Straßentest in Berlin
Beispiel A/B-Test: Produktliste
Für die Produktliste wurden zahlreiche Design Varianten erstellt und durch A/B-Tests überprüft, integriert und kontinuierlich optimiert.
Meine Learnings
Es geht um Content-Qualität!
- Textqualität muss stimmen (Formatierung, Rechtschreibung, Grammatik und Sprachniveau)
- Eigen produzierte Inhalte sind relevant, ABER guter Content allein reicht auch nicht aus!
- UX/UI ist entscheidend (das Verhältnis von Content zu Werbung muss stimmen)
- Nutzer-Signale wie die Return-to-SERP-Rate und die Time-On-Site spielen eine wichtige Rolle
Interne Herausforderungen
- Es fehlte ein einheitliches Verständnis eines MVP
- Grundlegende Funktionen waren zum Launch nicht implementiert (was zu negativem Feedback der Nutzer:innen führte)
- Kein einheitliches Verständnis von agilen Arbeitsweisen und Methoden
- Traffic-Einbruch und der Rückbau der alten Plattform
Danke!
An alle mit denen ich zusammen auf dem Phönix Projekt arbeiten durfte!
Produktentwicklung:
Barbara Link, Peter Berger, Michel Altenburg, Lisa Klattenhoff, Mariana Schmellenkamp, Andreas Naumann, Hanna Klug, Randall Bernhard, Kristin Knillmann, Matthias Stäheli, Ozan Türbedaroglu, Gadget Pfennig, Sabrina Wolter, Thomas Kathmann, Sebastian Christ, Martin Poschmann, Milan Krepel, Achim Baumbach, Romy Henning, Christian Rogge, Werner Schuwirth, Moritz Cramer, Florian Radke, Niels Genzmer, Nele Michaelis, Guido Jaeger, Katrin Werner, Fabian Gunkel, Tobias Weishaupt, Friederike Köstlin, Sophie Riemscheid, Caspar von Seckendorff, Holger Gröhn u.a.
"In nur 12 Monaten haben wir einen Relaunch mit neuem Design realisiert.
Eine aufregende Zeit mit unfassbar vielen Lernkurven. Vielen Dank an alle die Beteiligt waren.“
Franziska Gronwald, Mai 2018
Weitere Projekte
Lass uns ins Gespräch kommen ✌️
Du arbeitest an einem digitalen Vorhaben,
möchtest eine Herausforderung sortieren oder suchst eine erfahrene Perspektive von außen?
In einem unverbindlichen Kennenlerngespräch schauen wir gemeinsam auf deine Situation und klären,
wo ich sinnvoll unterstützen kann.
info@franzidesign.de
