So hat HelloFresh mit Figma ein Designsystem für seine 8 Marken aufgebaut

Bei der HelloFresh Group dient das Design nicht nur der Ästhetik. Es hat eine hohe strategische Bedeutung für den Erfolg der Marke und die Kundenzufriedenheit. Das Unternehmen mit Sitz in Berlin beschäftigt weltweit über 14.000 Mitarbeitende und ist vor allem für seine Kochboxen bekannt. Inzwischen hat HelloFresh sein Angebot jedoch auf acht verschiedene Marken ausgeweitet, die ein breites Spektrum an Produkten im Lebensmittelbereich abdecken, von Fertiggerichten bis hin zu Haustierfutter.

Angesichts der Komplexität, solch vielfältige Marken zu verwalten, ist ein solider und einheitlicher Design-Ansatz unerlässlich. Die UX-Abteilung von HelloFresh umfasst rund 75 Designer*innen, Content-Designer*innen und Researcher, die sowohl an den Standorten in Berlin, New York und Toronto als auch remote arbeiten.

Ihre Mission ist es, über alle acht Marken hinweg ein einheitliches und ansprechendes Kundenerlebnis zu schaffen. Und genau hier kommt Figma ins Spiel.

„Figma ist der Dreh- und Angelpunkt für alle Designer*innen bei HelloFresh. Sie können damit reibungslos zusammenarbeiten, egal wo sie sich befinden“, erklärt Marlene Rosner, Sr Director UX Design bei HelloFresh. Figma hostet das Designsystem von HelloFresh, sodass Designer*innen gleichzeitig an derselben Datei arbeiten können. Dies erleichtert sowohl die synchrone als auch die asynchrone Zusammenarbeit und ist entscheidend, um vom ersten Konzept bis zur endgültigen Einführung einen konsistenten und effizienten Designprozess zu ermöglichen.“

Das Designsystem von HelloFresh heißt Zest. Es handelt sich dabei um ein System für mehrere Marken und Plattformen, das für alle acht Marken genutzt wird. Es basiert auf einer Token-Architektur, um volle Flexibilität und Anpassbarkeit zu bieten und so den Anforderungen der unterschiedlichen Marken zu entsprechen.

„Mit diesem Ansatz bleiben Komponenten über alle Plattformen hinweg konsistent, sodass Designer*innen und Entwickler*innen stets auf dem gleichen Stand sind und der Designprozess insgesamt effizienter gestaltet wird“, sagt Adnan Puzić, DesignOps Lead bei HelloFresh.

Die Einführung von Dev Mode in Figma hat die Zusammenarbeit zwischen Design und Entwicklung weiter erleichtert. Entwickler*innen können mühelos zwischen Design-Dateien wechseln, Komponenten überprüfen und auf die benötigten Spezifikationen zugreifen. „Dev Mode hat den gesamten Prozess optimiert, Übergaben deutlich vereinfacht und die Effizienz erheblich gesteigert. So können sich Entwickler*innen vollständig darauf konzentrieren, Produkte von höchster Qualität zu liefern“, erklärt Adnan weiter.

Die Kollaborationsfunktionen von Figma beschränken sich nicht nur auf die UX- und Entwicklungsteams. Sie unterstützen auch das Marken- und Marketingdesign sowie das Content-Design und tragen so zu einem ganzheitlichen Designansatz bei, der alle Aspekte der Kundenerfahrung abdeckt.

„Beim Thema Design geht es bei HelloFresh nicht nur darum, visuell ansprechende Produkte zu schaffen. Wir möchten die gesamte Kundenerfahrung gestalten, die betriebliche Effizienz steigern und die Zusammenarbeit über Teams hinweg fördern“, erklärt Marlene. „Figma leistet einen entscheidenden Beitrag dazu, dass unsere acht Marken nutzerfreundlich und effizient bleiben. So trägt es insgesamt zu Effizienz des Betriebs von HelloFresh bei.“