Der Verbraucherzentrale Bundesverband e. V. (vzbv) vertritt die Interessen der Verbraucher gegenüber Politik, Wirtschaft und Verwaltung und klagt Verbraucherrechte vor Gericht ein.
Im Zuge des Projekts „Klarheit und Wahrheit“ des Bundesministeriums für Ernährung und Landwirtschaft wurde 2011 das Onlineportal Lebensmittelklarheit.de als interaktive Anlaufstelle für Verbraucher installiert. Das Portal wird mit Steuergeldern finanziert und von der Verbraucherzentrale betrieben. Seit Start des Portals wurden so Beschwerden über mehr als 10.000 Produkte gesammelt.
Entwicklung von Struktur- und Designvorschlägen für den responsiven Relaunch des Verbraucherportals „Lebensmittelklarheit“ unter Berücksichtigung der Barrierefreiheit. Klare Ausrichtung auf die Kommunikationsbedürfnisse von Verbrauchern und die intuitive Lenkung zu den gewünschten Inhalten. Integration neuer Funktionen und Erhöhung der Verweildauer auf der Seite.
Die Webseite Lebensmittelklarheit.de informiert verbrauchernah über die rechtlichen Grundlagen der Informationen auf Lebensmittelverpackungen, in Lebensmittel-Onlineshops und in Verkaufsflyern. Außerdem können sich Verbraucher über konkrete Produkte beschweren, deren Kennzeichnung und Aufmachung sie als missverständlich, unzureichend oder täuschend ansehen. Sie können Fragen an das Forum stellen, die individuell und auf der Webseite beantwortet werden.
Neben der primären Zielgruppe der Verbraucher stehen dabei verschiedene Zielgruppen im Fokus:
Die attraktive und zeitgemäße Gestaltung ermöglicht eine intuitive Bedienung und rückt relevante Funktionen stärker in den Fokus der Nutzer:innen. Es wurden logische Räume für weitere Funktionen geschaffen, welche im Zuge des Redesigns mit integriert werden mussten. Dabei werden nicht einfach neue Funktionen angeboten, sondern diese auf intelligente Weise als dynamisch ausgespielte Blöcke in die Seiten kontextsensitiv integriert. So gelingt eine intuitive Lenkung zu den gewünschten Inhalten und die User:innen gelangen mit möglichst wenigen Klicks an alle Informationen. Die einzelnen Seiten verwenden somit zu dynamisch miteinander kombinierbaren Bausteinen, mit denen die Redaktion verschiedene Elemente wie Bilder, Videos, Zitate flexibel anordnen kann, um die einzelnen Artikel passend zu gestalten.
Für eine verbesserte User Experience wurde unter Beachtung der Usability eine neue Navigationsstruktur entwickelt. Hierbei wurde ein besonderes Augenmerk auf die optimale Userführung gelegt und gegenüber der zuvor angewandten Lösung stark optimiert. So werden die Wege zu den Artikeln möglichst effizient gehalten und es dem Nutzer so einfach wie möglich gemacht, das passende Produkt zu finden.
Das Design wird wesentlich moderner sowie attraktiver und spricht neue User:innen an – ohne „Stammkunden“ zu verlieren. Durch die neue Gestaltung integriert sich die Webseite ideal in den Markenauftritt der Verbraucherzentralen. Sämtliche Elemente wurden zudem responsiv vom Desktop über Tablet bis hin zu verschiedenen Smartphonetypen konzipiert.
Ein weiterer wichtiger Bereich bildet indessen der existierende Datenbestand, der auch in der neuen Version der Webseite beibehalten wird. Dabei ist es wichtig, dass das neue Design auch alte Inhalte attraktiv darstellt, die redaktionell noch nicht an die neuen Möglichkeiten angepasst wurden. Das Design ist infolgedessen so konzipiert, dass neue Elemente dynamisch ausgeblendet oder durch intelligente Zusatzinhalte ergänzt werden, wenn keine Inhalte verfügbar sind.
Um dieses umfangreiche und komplexe Angebot der Verbraucherzentrale möglichst barrierefrei bereitzustellen, galt es große Sorgfalt walten zu lassen.
Die Seite ist gemäß BITV 2.0. barrierefrei. Neben der klaren Gliederung und Kennzeichnung der Inhalte wurde besonders auf die Kombination und Kontraste bei den Farben geachtet. So können nicht nur die Schriften frei skaliert werden, sondern auch alternative Farbschemata für verschiedene Arten von Farbenblindheit ausgewählt werden. Ein eigens gestalteter Bereich für leichte Sprache wurde zudem von den individuell von uns gestalteten Piktogrammen zu allen wichtigen Bereichen und Themen unterstützt.
Von allen wichtigen Bereichen wurden zunächst Wireframes erstellt. Diese wurden in Abstimmung mit dem Kunden in einem von uns moderierten mehrstufigen Prozess weiter konkretisiert und verfeinert.
Nach einer ersten gestalterischen Grundgestaltung wurden von wichtigen Seiten im Anschluss interaktive Prototypen-Seiten erstellt, anhand derer die Funktionalität von allen beteiligten Parteien begutachtet werden konnten. Die optimierte Version dieser Prototypen-Seiten wurde anschließend für Usertests genutzt.
Die Ergebnisse aus den Umfragen flossen in die detaillierte Ausarbeitung aller relevanter Seiten, die dann als vermasste Vorlagen für alle Deviceklassen in einem Manual für die technische Umsetzung gesammelt wurden.
Neben einer technischen Umsetzung von SEO-Optionen wurden bereits bei der Struktur der Seite wichtige Ziele mit eingeplant. Die Verweildauer auf den Seiten sollte durch eine übersichtliche Bündelung aller wichtigen Inhalte zu jedem Thema erhöht werden.
Die Absprungrate wurde durch klare Inhalte und deren eindeutigere Benennung gesenkt. Verweisende Blöcke leiten zu thematisch passenden Seiten und Funktionen und erhöhen so die Gesamtverweildauer auf der Seite. Zahlreiche interaktive Elemente und dynamisch ausgespielte neue Inhalte motivieren zum erneuten Beschäftigen mit der Seite.
Das Logo wurde überarbeitet, um die USP des Portals noch präziser zu vermitteln. Dabei wurden nicht nur die Farben an das Webportal angepasst, sondern auch die Vorgaben für barrierefreie Kontraste umgesetzt. Auch die im CD-Manual verwendete Hausschrift der Verbraucherzentralen wurde integriert und das Logo – trotz zusätzlich gewünschtem Claim – noch etwas kompakter gehalten.
Nach der erfolgreichen Gestaltung des Webportals von Lebensmittelklarheit.de für die Verbraucherzentrale, erstellten wir nun das passende Erscheinungsbild für den dazugehörigen Podcast: vom Logo, dem Konzept für die Teaser bis hin zum kompletten Medienbereich im Portal.
Wer Lust hat, kann gerne auf der Webseite oder direkt bei Apple oder bei Spotify mal reinhören!
Das neue Design ermöglicht es, die existierenden Inhalte zu übernehmen und mit neuen Strukturen, Navigationselementen und Inhalten zu erweitern. So werden die sehr komplexen Inhalte leichter navigierbar und pflegbar. Durch die gute Planung und Strukturierung der einzelnen Arbeitsschritte konnten wir allen Beteiligten helfen, die komplexen Projekte reibungslos und termingerecht umzusetzen und dabei die verschiedensten Wünsche zu Technik, Gestaltung, Barrierefreiheit und inhaltlicher Ausrichtung zu integrieren.
