Stiftung ear

Benutzerfreundlichkeit statt Bürokratie

[In · tro]

Die Stiftung ear ist die offizielle Registrierungs- und Kontrollinstanz nach dem ElektroG und überwacht die Einhaltung der gesetzlichen Pflichten von Elektro- und Elektronikgeräteherstellern in Deutschland. Sie stellt sicher, dass Altgeräte rechtskonform entsorgt und wiederverwertet werden.

[Fak · ten]

Kunde

Stiftung elektro-altgeräte register

Branche

Stiftung

Leistungen

Website-Relaunch (TYPO3)

Weniger ist mehr: Struktur anstelle von Überforderung

[Ziel · setz · ung]

(01) Umfang reduzieren
Die alte Website der Stiftung ear war mit über 350 relevanten Unterseiten super umfangreich und unübersichtlich. Wichtige Inhalte waren nicht gebündelt auffindbar und zudem in verschiedensten Medienformaten aufbereitet: Von PDFs, reinen Textansammlungen, Grafiken, Bildern über Videos bis hin zu externen Links oder eingebetteten iFrames. Dies erschwerte es den Nutzern, sich schnell auf der Seite orientieren und vor allem, die für sie relevanten Informationen finden zu können.

Unser Ziel: Inhalte besser clustern und für die User zugänglich machen!
(02) Komplexität minimieren
Als zentrale Plattform für Informationen rund um die Umsetzung des Elektro- und Elektronikgerätegesetz (ElektroG) sowie des Batteriegesetzes (BattG) musste die Website eine Vielzahl gesetzlicher Vorgaben abbilden. Die Inhalte waren oft von fachlicher, bürokratischer Sprache geprägt, die es insbesondere kleinen Unternehmen oder neuen Marktteilnehmern erschwerte, ihre spezifischen Pflichten und Aufgaben zu verstehen.

Unser Ziel: Themen & Inhalte strukturieren und logisch zusammenfassen
(03) Fokus auf Nutzerzentrierung
Die alte Website war primär aus der internen Perspektive der Organisation aufgebaut und weniger an den tatsächlichen Bedürfnisse der Nutzer ausgerichtet. So wussten Besucher oft nicht, wo Sie relevante Informationen finden bzw. Ihre Anliegen bearbeiten können. Das führte zu einer enorm hohen Anzahl an First-Level-Support Anfragen. Die Servicekommunikation war so schwierig und die Belastung für das Service-Team sehr hoch. Und klar: Es herrschte Unzufriedenheit bei den Antragsstellern und Websitebesuchern.
(04) Unser Ziel: Die Website aus Nutzersicht denken
Auf einen Blick – unsere Ausgangssituation:
Riesiger Umfang der Website: über 350 (relevante) Unterseiten zur Informationsbeschaffung
Viele Medienformate: Text, Videos, Bilder, Grafiken, PDFs, Newsletter, Statistiken, externe Links etc. erschweren die Übersichtlichkeit der Informationen
Komplexität des Themas: Umsetzung von europäischen Gesetzen
Komplizierte Sprache & Fokus auf Inhalte und nicht auf Anwendungsfälle und Zielgruppen
Intensive Service- und Supportkommunikation durch viele offene Fragen

Use Cases als Basis für eine nutzerorientierte Website

[Vor · geh · en]

(01) Konzeption & Workshops – Definition der Use Cases & Zielgruppen
Wir starteten mit einer detaillierten Analyse. Wir wollten die Dinge identifizieren, die bereits gut funktionieren und die Dinge, die wir verbessern müssen. Das funktioniert am besten mit User-Testings: „Die effektivste Methode, um herauszufinden, wie man Produkte verbessern kann, ist Menschen dabei zu beobachten, wie sie diese Produkte verwenden“.
‍
Getreu diesem Motto haben wir User-Tests auf der alten Website durchgeführt. Dabei wurden typische Nutzungsszenarien simuliert, um zu analysieren, an welchen Stellen Website-Besucher scheitern und welche Hürden sie daran hinderten, ihre Anliegen zu erledigen oder sich Informationen zu beschaffen. Ergänzend haben wir in Workshop-Formaten mit dem ear-Team ein tieferes Verständnis für die verschiedenen Zielgruppen und ihre spezifischen Bedürfnisse gewonnen. Auf dieser Grundlage konnten wir die neue Informationsarchitektur der ear-Website denken.
Von einer komplexen Infoplattform zur „Befähigungs-Website“
Das war quasi unser Leitmotiv und mit folgenden Ansätzen ging es in die Konzeption:
- Die Startseite als zentralen Einstiegspunkt nutzen:
  Wir starten direkt mit der Frage „Was möchten Sie erledigen?“ und führen durch die statistisch häufigsten und wichtigsten Aufgaben, die man als User erfüllen muss
- Themenwelten als inhaltliche Zweitstruktur:
  Wer sein Anliegen nicht kennt, kann sich mithilfe der Themenwelten orientieren und in seine jeweilige „Besucher-Rolle“ eintauchen
- Anleitungen als Kern der Website:
  Statt unstrukturierter Informationen werden konkrete Schritt-für-Schritt-Anleitungen bereitgestellt, die Nutzer durch ihre Prozesse führen
(02) Wireframes & Seiten-Architektur – Definition der Use Cases & Zielgruppen
Nachdem die grundlegende Struktur definiert war, entstanden erste Wireframes, um die Hierarchie und Nutzerführung zu optimieren. Die Menüstruktur wurde reduziert, sodass Besucher ohne Umwege zu den wichtigsten Inhalten gelangen. Gleichzeitig wurden die Seiten logisch miteinander verknüpft, um eine intuitive Navigation zu ermöglichen.

Außerdem haben wir unnötige Navigationsebenen eliminiert und eine gezielte visuelle Führung entwickelt, die sich konsequent an den Bedürfnissen der Besucher orientiert.
(03) Webdesign
Auf Basis der Wireframes und der Inhalte wurde das Screendesign entwickelt, das die Nutzerfreundlichkeit weiter stärkt: Die Gestaltung ist klar, reduziert und lenkt den Fokus gezielt auf die wichtigsten Inhaltselemente. Helle Flächen, gut lesbare Typografie und gezielte Akzentfarben unterstützen die Navigation. Das Ergebnis ist ein modernes, seriöses und leicht verständliches Webdesign.
Das Design basiert auf der bestehenden Corporate Identity der ear-Stiftung, wurde jedoch für eine moderne Webdarstellung optimiert. Die Schriftarten Myriad Pro (Überschriften) und Open Sans (Fließtext) gewährleisten eine hohe Lesbarkeit. Das Farbsystem wurde erweitert, um eine klarere Nutzerführung entlang der Zielgruppen zu ermöglichen, wobei der markante Blauton der ear-Stiftung als Basis erhalten blieb.
(04) Programmierung
Die Website wurde mit TYPO3 entwickelt, um die komplexen Anforderungen der ear-Stiftung an Sicherheit, Skalierbarkeit und langfristiger Stabilität zu erfüllen. Trotz der strengen IT-Richtlinien und Sicherheitsmechanismen konnte eine moderne, funktionale Website umgesetzt werden.
Zu den technischen Highlights gehören:
- Die Datenbanksuche zur Gerätezuordnung
- Der Garantierechner
- Und auf mobilen Geräten funktioniert die Seite natürlich auch einwandfrei.
Auf den Punkt – die wichtigsten Leitprinzipien der neuen Website:
- Befähigungsplattform statt reine Informationsseite
- Klare Führung der Nutzer durch Use Cases
- Entlastung der Service-Kommunikation durch klare digitale Anleitungen

Eine Website, die statt Fragen Antworten liefert

[Fa· zit]

Von Anfang an strategisch gedacht, aufwendig durch Use-Cases analysiert und über Wochen in gemeinsamer Arbeit mit Verantwortlichen auf Kundenseite konzipiert, konnten wir die Strukturen, Prozesse und die Kommunikationsstrategie der Stiftung ear sehr gut verstehen und auf das Leitmotiv - Von der komplexen Infoplattform zur „Befähigungs-Website“ – hinarbeiten.

Die enge Zusammenarbeit, gerade mit den Entscheidern und das Commitment des Managements für die neue Website waren goldwert und sorgte auch in kritischen Projektphasen für schnelle Entscheidungen.

Die letzte Herausforderung war schließlich der Go-Live Prozess selbst. Insgesamt fünf verschiedene Player waren bei serverseitigem Setup, Implementierung von Datenbanken und technischen Features mit im Boot. Doch auch hier wurde das Tempo hochgehalten und durch konsequentes „Mehr-Augen-Prinzip“ die Qualität sichergestellt. Am Ende stand dann nach knapp 14 Monaten Projektphase das gewünschte und erarbeitete Ergebnis: eine moderne, nutzerfreundliche Website, die Informationen strukturiert bereitstellt und Nutzer gezielt durch ihre Prozesse führt.

Das Ergebnis nach dem Go-live kann sich auf jeden Fall sehen lassen:

Neben positivem Feedback von Nutzern sowie dem Auftraggeber lässt sich vor allem festhalten: Die Support-Anfragen reduzieren sich und der First-Level-Support spürte bereits in den ersten Wochen nach Go-Live eine deutliche Verbesserung!

Liebe Stiftung ear, vielen Dank für euer Vertrauen in unsere Arbeit!