So führt Lollypop die Kund*innen vom Briefing bis zur Umsetzung in Figma
Lollypop Design Studio ist eine globale UI/UX-Design-Agentur mit einem Team von über 180 Designer*innen und Ingenieur*innen, die in Indien, den USA, den VAE und Vietnam verteilt sind. Im Laufe eines Jahrzehnts hat das Studio über 1.000 Kund*innen bedient, mehr als 50 globale Designpreise gewonnen und über zwei Milliarden Menschen erreicht. Es arbeitet mit Start-ups und Fortune 500-Unternehmen in den Bereichen Gesundheitswesen, Fintech und E-Commerce zusammen, um komplexe Geschäftsanforderungen in skalierbare digitale Produkte zu übersetzen.
Als das Kundenportfolio von Lollypop wuchs und die Engagements komplexer wurden, stellte sich auch die Herausforderung, Designer*innen, Entwickler*innen und Kund*innen auf denselben Weg zu bringen, ohne an Kundentreue und Schwung zu verlieren.
Als sie begannen, eine Onlineplattform für Einzelhandelsoperationen für mehrere Regionen für einen Kunden zu entwerfen, benötigten sie eine schnellere Möglichkeit, vom Konzept zur Entwicklung zu gelangen, ohne die Ausrichtung aus den Augen zu verlieren. Indem Lollypop seinen Workflow in Figma konsolidierte – über FigJam, Figma Design, Dev Tools und Figma Make – wurde der Aufwand für das Prototyping um das 3- bis 4-Fache reduziert, Feedbackzyklen von mehreren Tagen auf einen Tag verkürzt und die Zeitpläne für die Front-End-Entwicklung von Monaten auf Wochen reduziert.
Die Herausforderung: Verwaltung komplexer Produktworkflows über Teams und Kundenkreis hinweg
Vor Figma haben Designer*innen, Entwickler*innen und Client-Stakeholder*innen Arbeiten über verschiedene Tools und Dokumente hinweg überprüft, was es schwieriger machte, Entscheidungen synchron zu halten und das Feedback in kritischen Phasen verlangsamte.
Die Herausforderungen vervielfachten sich, als sie begannen, eine Online-Einzelhandelsplattform für einen Kunden zu entwerfen, der in mehreren Regionen tätig ist. Die Plattform musste den Geschäftsleitungen Sichtbarkeit in die Einzelhandelsleistung über die Filialen hinweg geben, während Felddaten kontinuierlich Informationen über die Logik und die Workflows des Produkts lieferten.
Ohne einen gemeinsamen Workspace wurde der Fortschritt oft über Tabellenkalkulationen, Präsentationen und E-Mail-Threads verfolgt, wodurch Lücken zwischen dem, was entworfen, entwickelt und vom Unternehmen benötigt wurde, entstanden.
Wir mussten das Einzelhändler-Onboarding, die Aufgabenverteilung, das tägliche Aktivitätstracking und die Leistungsüberwachung in einem System zusammenführen. Ohne diese zentrale Sichtweise wird die Koordination über Regionen hinweg extrem schwierig.
— Sri Chandra Dronavalli, Director, Software Services, Lollypop
Die Lösung: Entwerfen, Validieren und Bereitstellen in einem verbundenen Workflow
Lollypop hat seinen gesamten Projektworkflow um eine einzige, vernetzte Umgebung neu strukturiert. Das Team hat alles in Figma verlagert – sie nutzen FigJam für Entdeckung und Abstimmung, Figma Design für Prototyping und Validierung, Dev Tools für reibungslosere Übergaben und Figma Make, um die Front-End-Bereitstellung zu beschleunigen.
Das Ergebnis war ein Prozess, bei dem Entscheidungen, die in der Entdeckungsphase getroffen wurden, direkt in das Design einflossen, und sowohl Designer*innen als auch Entwickler*innen ohne Verlust von Assets oder Kontext in die Implementierung übergehen konnten.
Einen strukturierten Entdeckungsprozess in FigJam aufbauen
Das Team begann jedes Engagement mit moderierten Workshops in FigJam. Designer*innen und Stakeholder*innen arbeiteten zusammen, um Retailer Journeys zu kartieren, Leistungsauslöser zu definieren, Interventionsszenarien zu modellieren und Randfälle aufzuzeigen – alles, bevor der erste Bildschirm entworfen wurde.
Die Fähigkeit, direkt von der Forschung in das Design überzugehen, ohne Tools wechseln oder Flows neu erstellen zu müssen, bedeutet, dass wir mehr Zeit damit verbringen, gute Entscheidungen zu treffen, und weniger Zeit damit, Informationen zu verwalten. Dies hat den Entdeckungsprozess bereits um das Zweifache beschleunigt.
— Ameet Palkar, Design Director, Lollypop
Validieren von Workflows mit nativen Figma-Prototypen
„Früher mussten wir alle 100 Bildschirme in JPEG-Format exportieren, all diese JPEGs in ein anderes Tool eingeben und die Prototypen hartkodieren und erstellen“, sagte Naseer Ahmed, Senior Design Manager bei Lollypop.
Indem das Prototyp-Erstellen nativ in Figma integriert wurde, hat das Team diese Phase vollständig eliminiert.
Mit dem nativen Prototyp-Erstellen von Figma mussten wir nicht mehr bei jeder Designänderung den Export-und-Neuaufbau-Prozess wiederholen, was unseren Aufwand im Vergleich zu unserem vorherigen Workflow um fast das 3- bis 4-Fache reduzierte.
— Naseer Ahmed, Senior Design Manager, Lollypop
Durch intelligente Animationen kamen die Prototypen auch dem fertigen Produkt näher, was zu klarerem Feedback von Stakeholder*innen und zu weniger Missverständnissen im Feld führte.
Der Unterschied ist nicht nur die Geschwindigkeit. Wenn sich der Prototyp in derselben Datei wie das Design befindet, fallen dir Dinge früher auf – Interaktionen, die nicht stimmig sind, Flows, die überdacht werden müssen. Diese Qualitätsprüfung fand früher viel später statt.
— Mohith S, Lead UI Designer, Lollypop
Halten von Design und Code auf der gleichen Arbeitsfläche mit Dev Mode, Code Connect und dem MCP-Server von Figma
Früher arbeitete Lollypop mit verschiedenen Tools, die von Designer*innen verlangten, separate Dateien zu pflegen, und von Entwickler*innen, mehrere Plattformen zu durchlaufen, um Spezifikationen, Assets und Annotationen abzurufen.
Indem sie alles zu Figma konsolidierten, ersetzte das Team diesen Workflow durch eine einzige, verbundene Umgebung, in der Entwickler*innen direkt innerhalb der Designdatei auf genaue Spezifikationen, Komponenten-Details und Assets zugreifen konnten – und das, was entwickelt wurde, konnte zur Überprüfung auch wieder zu Figma zurückkehren. Hierdurch konnten Mehrdeutigkeit reduziert und Design und Code während des gesamten Projekts synchron gehalten werden.
„Figma hat die Art und Weise verändert, wie Design und Entwicklung während des gesamten Erstellungsprozesses synchron bleiben.“ Das Design-Kontext fließt direkt in unseren Entwicklungs-Workflow ein, und was entwickelt wird, kann zur Überprüfung zurück zu Figma kommen. „Es hat die Unklarheiten reduziert, den Hin- und Her-Klärungsbedarf minimiert und eine engere Ausrichtung zwischen Design und Umsetzung sichergestellt – letztendlich Zeit gespart und die Lieferungseffizienz verbessert“, sagte Sri Chandra Dronavalli, Director, Software Services bei Lollypop.
Das Team verband auch den MCP-Server von Figma mit ihren IDEs, sodass KI-Agenten Design-Dateien direkt abfragen und Code erstellen können, der im realen Designsystem-Kontext verankert ist, anstatt auf Screenshots oder manuelle Spezifikationen zurückzugreifen. Durch die Verwendung von Code Connect zur Verknüpfung von Figma-Komponenten mit ihrem Produktionscode nutzten KI-Tools exakte Elemente des Codebestands anstelle neuer Annäherungen – was zu 90 % Komponentengenauigkeit bereits nach ein oder zwei Versuchen führte. Das Ergebnis waren weniger Nacharbeiten, weniger Bugs durch Token-Abweichungen und schnellere Iterationen auf Benutzerfeedback.
Beschleunigung der Front-End-Lieferung mit Figma Make
Für Module, bei denen Back-End-Systeme bereits vorhanden waren, half Figma Make mit dem nächsten Schritt, indem es reduzierte, wie viel von der Front-End-Ebene neu erstellt werden musste.
Mit Figma Make hat das Team ein initiales Front-End-Gerüst aus den genehmigten Entwürfen erstellt. Ingenieur*innen verwendeten dies als Ausgangspunkt, um es zu verfeinern und mit Back-End-Systemen zu integrieren, anstatt die Benutzeroberflächenebene von Grund auf neu zu erstellen.
Wir müssen die gesamte Front-End-Ebene nicht mehr von Grund auf neu erstellen – Figma Make bietet uns mit einfachen Texteingaben einen starken Ausgangspunkt. Was zuvor 2 bis 2,5 Monate dauerte, kann jetzt in 3 bis 4 Wochen für die anwendbaren Module geliefert werden.
— Sri Chandra Dronavalli, Director, Software Services, Lollypop
Verkürzung der Feedback-Zyklen durch gemeinsame Dateien
Feedback war immer ein persistenter Engpass, und das Exportieren von Bildschirmen in PDF und das Warten von Tagen auf Antworten bedeutete, dass die Iteration immer den Zeitplänen der Kundschaft hinterherhinkte.
„Früher haben wir Präsentationen verschickt, alle Bildschirme in JPEG exportiert, in ein PDF umgewandelt und ein paar Tage auf Feedback und Bewertungen gewartet“, sagte Naseer.
Indem sie Live-Figma-Dateien mit den Stakeholder*innen teilten, konnte das Team die Überprüfungen direkt in den Design-Workspace verlagern. Diskussionen und Entscheidungen wurden direkt in der Datei festgehalten, wodurch ein nachvollziehbarer Bericht ohne zusätzlichen Dokumentationsaufwand entstand.
Heute wurde die Bearbeitungszeit auf einen Tag verkürzt. Du sendest die Designdateien am Nachmittag und erhältst Feedback bereits am Abend oder am nächsten Nachmittag.
— Naseer Ahmed, Senior Design Manager, Lollypop
Vorausblick: Zusammenarbeit ausbauen und Arbeitsabläufe verbessern
Da Lollypop immer komplexere, multiregionale Kundenprojekte übernimmt, wird Figma zur gemeinsamen Ebene, auf der Teams zusammenarbeiten, präsentieren und liefern. Die Konsolidierung ihres Workflows hat eine Grundlage geschaffen, die sie nun auf neue Teile des Geschäfts ausweiten.
„Wenn wir schneller und besser liefern, beeinflusst das, wie wir uns auf dem Markt präsentieren.“ Die Workflows und Prozesse, die wir in Figma erstellt haben, haben uns geholfen, schnell zu arbeiten, schnell zu veröffentlichen und jedes Mal unsere beste Arbeit abzuliefern. „Das ist es, was die Marke aufbaut“, sagte Charan Babu N., Senior Manager, Global Marketing und Partnerships bei Lollypop.
Mit Figma Slides bringt das Team Stakeholder-Präsentationen näher an den Designprozess heran und hilft Teams, sich über Regionen hinweg abzustimmen, ohne die Tools wechseln zu müssen. Sie verwenden auch Figma Buzz, um Vorlagen und Content-Delivery zu verwalten, wobei sichergestellt wird, dass der Markenstil und die Konsistenz über Kampagnen, Formate und Regionen hinweg gewahrt bleiben, ohne dass Assets von Grund auf neu erstellt werden müssen.
Wenn dein gesamter Workflow – von der Entdeckung bis zur Lieferung – an einem Ort abläuft, vervielfacht sich die geschäftliche Wirkung. Wir liefern schneller und stimmen uns besser ab, was sich direkt in stärkeren Kundenbeziehungen niederschlägt. Figma hat wirklich unsere Fähigkeit beeinflusst, die Art von Arbeit zu skalieren, die wir übernehmen.
— Rama Kini, EVP, Design and Software Services, Lollypop
So kannst du mit Figma Designs skalieren
Kontaktiere uns, um mehr darüber zu erfahren, wie du mit Figma dein Design skalieren kannst.
So kannst du mit Figma Designs skalieren
Großartiges Design hat das Potenzial, dein Produkt und deine Marke von der Masse abzuheben. Aber Großes entsteht nur gemeinsam. Figma vereint Produktteams in einem schnellen und inklusiveren Design-Workflow.
Kontaktiere uns, um mehr darüber zu erfahren, wie du mit Figma dein Design skalieren kannst.
Wir zeigen dir, wie dich Figma unterstützen kann:
- Zusammenführung aller Schritte des Designprozesses an einem Ort – von der Ideenfindung über den Entwurf bis hin zur Umsetzung von Designs
- Schnellere Design-Workflows dank unternehmensweit genutzter Designsysteme
- Inklusivität bei den Abläufen im Produktteam dank intuitiver und benutzerfreundlicher webbasierter Produkte