E-Commerce-Website für technische Bildungsmedien
Projektüberblick
Projekttyp: E-Commerce-Website für technische Bildungsmedien
Rolle: UX & UI Design, Informationsarchitektur, Flow-Konzeption
Kunde: Ein führender Bildungsmedienverlag im technischen Bereich
Ziel: Modernisierung der bestehenden Website und Optimierung der User Flows für unterschiedliche Zielgruppen (Lehrkräfte, Institutionen, Schüler:innen). Neben einer zeitgemäßen, klar strukturierten Gestaltung lag der Fokus auf einer vereinfachten Suche nach Titeln und Reihen sowie einer verbesserten Nutzerführung im Warenkorbprozess.
Checkout User Flow (1/3) (*Anonymisiertes Kundenlogo)
Checkout User Flow (2/3) (*Anonymisiertes Kundenlogo)
Checkout User Flow (3/3) (*Anonymisiertes Kundenlogo)
Ausgangssituation & Zielsetzung
Für einen renommierten Verlag für technische Bildungsmedien gestaltete ich den gesamten Webauftritt inklusive Onlineshop neu. Ziel war es, die teilweise veraltete Informationsarchitektur und das unübersichtliche Design zu modernisieren, die Auffindbarkeit von Lehrwerken zu verbessern und den Warenkorbprozess für verschiedene Nutzergruppen klarer zu strukturieren.
Die neue Website sollte Lehrkräften, Institutionen und Schüler:innen gleichermaßen eine intuitive Orientierung bieten – von der Suche nach Lehrmaterialien über die Produktdetailansicht bis hin zum Checkout.
Produktdetailseite mit verschiedenen Lizenzoptionen (*Anonymisiertes Kundenlogo)
Herausfoderungen
Eine der größten Herausforderungen lag in der Vielzahl an Lehrwerken, Fachrichtungen und Unterkategorien, die logisch und verständlich gegliedert werden mussten.
Darüber hinaus galt es, drei verschiedene Login- und Kaufprozesse zu vereinen:
Lehrkräfte mit personalisierten Angeboten,
Institutionen mit spezifischen Nachweisanforderungen (z. B. Schulbescheinigung),
Schüler:innen mit direkter Kaufmöglichkeit.
Besonders komplex war der Warenkorbflow, der je nach Nutzerrolle unterschiedliche Eingabeschritte, Nachweise und Zahlungswege umfasst. Auch die Suche nach Titeln und Reihen musste so gestaltet werden, dass sie trotz der großen Datenmenge schnell, relevant und übersichtlich bleibt.
Landing Page mit Subnavigation (*Anonymisiertes Kundenlogo)
Vorgehen
Basierend auf einer Analyse der bestehenden Website wurden zunächst die User Journeys für die unterschiedlichen Zielgruppen definiert. Anschließend entwickelte ich den interaktiven Prototypen, der Such- und Warenkorbprozesse klar strukturierte und redundante Schritte reduzierte.
Das UI Design wurde modernisiert, um den technischen, aber gleichzeitig didaktischen Charakter des Verlags zu transportieren – mit einer klaren visuellen Hierarchie, großzügigen Weißräumen und einem modularen Designsystem, das die Vielzahl an Inhalten übersichtlich darstellt.
Ergebnisse & Optimierungsempfehlungen
Das neue Design führt Nutzer:innen mit klarer visueller Sprache und eindeutigem Feedback durch komplexe Prozesse.
Die Suche wurde so optimiert, dass zusammengehörende Titel und Reihen leichter gefunden werden, während der Warenkorbprozess durch angepasste Flow-Logiken pro Nutzergruppe deutlich verständlicher und effizienter ist.
Insgesamt entstand eine moderne E-Commerce-Webiste, die die Vielfalt des Verlagsangebots strukturiert präsentiert und die Nutzung sowohl für Lehrkräfte als auch Institutionen und Schüler:innen erheblich vereinfacht.
