ONLINEPRINTERS
UX-Optimierung und Frontend-Entwicklung
Wie entwickelt man in enger Abstimmung mit dem Kunden und seinem Entwicklungsteam eine begeisternde, nutzerzentrierte User Experience und ein modernes Frontend?
Agile zur optimierten User Experience
ONLINEPRINTERS wollte seinen Nutzern eine bessere User Experience im Auswahl- und Bestellprozess bieten und gleichzeitig den Anforderungen von Google in puncto Mobile-Index gerecht werden. In enger, agiler Zusammenarbeit entwickelte kernpunkt ein neues UX-Konzept und die passende Frontend-Technologie, die iterativ durch das Backend-Team von ONLINEPRINTERS implementiert wurde.
Ausgangslage
Uneinheitliche User Experience und schlechte Performance beim Google Page Speed
Zielsetzung
Entwicklung einer einheitlichen UX über den gesamten Shop und eines modernen Frontends
Die Herausforderung:
Neue User Experience, optimiert für den Google Mobile Index
Gemeinsam mit dem Entwicklungsteam von ONLINEPRINTERS stand kernpunkt vor der Herausforderung in kurzer Zeit und in enger Abstimmung ein neues UX- und Frontendkonzept für die internationalen Online-Plattformen von Onlineprinters zu entwickeln. Zielsetzung für das Redesign der E-Commerce-Plattform war es, sowohl mobilen Anwendern als auch Desktop-Usern eine optimale User Experience zu bieten. Gleichzeitig sollten – mit Blick auf das bevorstehende Update des Google Rankings – die Voraussetzung für eine optimale Indizierung der mobilen Webseiten geschaffen werden.
Im Fokus stand daher die Entwicklung eines Atomic Design Baukastens, der eine konsistente User Experience auf den verschiedenen Endgeräten sicherstellt und gleichzeitig eine wiederverwendbare Basis für zukünftige Anpassungen und Erweiterungen der mehrsprachigen Benutzeroberfläche bietet. Durch eine enge Zusammenarbeit mit dem Backend-Team seitens ONLINEPRINTERS sollten zudem Ergebnisse des Design-Prozesses und der Frontend-Entwicklung zeitnah übergeben und direkt implementiert werden können. So sollte eine kurze Laufzeit des Projektes, das parallele Arbeiten der Teams auf beiden Seiten und eine schnelle Time-to-Market sichergestellt werden.
Unsere Lösung:
Agil, Hand in Hand und iterativ ans Ziel
Für das Vorhaben wurde ein übergreifendes Team seitens ONLINEPRINTERS und kernpunkt zusammengestellt: kernpunkt verantwortete hierbei die Bereich UX-Design und Frontend-Entwicklung, seitens ONLINEPRINTERS erfolgt die Implementierung in die bestehende E-Commerce-Technologie im Backend. Beide Partner übernahmen gemeinsam die Product Ownership und setzen auf ein agiles Projektvorgehen im Sprint-Modus. Hierbei wurden pro 2-Wochen-Sprint Ergebnisse produziert, die dann parallel durch das Backend-Team von ONLINEPRINTERS implementiert werden konnten.
Als Grundlage für die Umsetzung kam ein moderner Frontend-Stack zum Einsatz: Die Layouts wurden hierzu zunächst mit Adobe XD entwickeltet, mit dem Kunden abgestimmt und nach Freigabe als HTML aufbereitet. Die Abstimmung und Dokumentation erfolgte über die Lösung Storybook, die eine Gliederung der Atomic Design Elemente erlaubt und diese im Rahmen der Qualitätssicherung auf verschiedenen Endgeräten testbar macht. Die entsprechende Patern Libary wurde sukzessive für das Team der ONLINEPRINTERS dokumentiert und konnte so einfach in die Backend-Systeme integriert werden.