Haufe Akademie GmbH & Co. KG (Weiterbildung & Training)
Ausgangslage
Haufe Akademie gehört zu den größten Anbietern für berufliche Weiterbildung im deutschsprachigen Raum, ein Geschäft, in dem die Veranstaltung selbst nur die Hälfte des Kundenerlebnisses ausmacht: Teilnehmende erwarten zunehmend, dass sie auch vor, während und nach einem Training digital begleitet werden. Materialien, Agenda, Räume, Speaker, Live-Updates.
Die bestehende Web-Plattform leistete den Großteil davon. Was fehlte: eine mobile Erfahrung, die Teilnehmende während laufender Veranstaltungen unterstützt, ohne dass sie auf ihrem Laptop nachschlagen müssen.
Auftrag
Zwei verbundene Aufträge: die Web-Plattform funktional erweitern und parallel eine native Mobile App (iOS) bauen, die Teilnehmenden Live-Informationen während Events liefert. Dabei in einer einheitlichen Produkt- und Design-Sprache: Mobile und Web sollen sich anfühlen wie ein Produkt, nicht zwei getrennte Welten.
Lösung
- Mobile App auf React + Expo, ausgeliefert für iOS: Teilnehmende erhalten Live-Informationen zu laufenden Veranstaltungen, Agenda, Räumen, Speakern.
- Erweiterung der bestehenden Web-Plattform in Next.js / TypeScript / Styled-Components, mit Anschluss an die Inhalte, die auch die App speist.
- Design Lead für die Mobile-Komponenten und das Cross-Plattform-Design: dieselbe Bildsprache auf Web und App.
- Spätere Integration: die in der App entwickelten React-Komponenten flossen zurück in die Web-Plattform, um Doppelpflege zu reduzieren.
Ergebnis
Eine zusammenhängende Web- und Mobile-Erfahrung für Haufe-Akademie-Teilnehmende, mit konsistenter Markenführung über die Plattformen hinweg und einer technischen Basis, in der einmal entwickelte Komponenten an mehreren Stellen wiederverwendet werden.
Stack
React · Expo · Next.js · TypeScript · Styled-Components · Figma · iOS · GitLab
Team & Rolle
Michael Zoidl als Design Lead und UI/UX-Entwickler über die gesamte Laufzeit, Niels Madan verantwortlich für die Mobile-App-Entwicklung. Eine schlanke Aufstellung, in der Design und Engineering eng verzahnt waren, wesentlich für die durchgängige Bildsprache zwischen Web und App.
