100grammes

Herausforderung

100grammes ist für Menschen, die ihren Wocheneinkauf optimieren wollen. Lebensmittelpreise in Québec ändern sich von Woche zu Woche und von Laden zu Laden - und ohne Live-Daten von jedem Händler in Ihrer Umgebung ist es in der Praxis unmöglich, die günstigste Kasse zu wählen. 100grammes löst das: Sie nehmen Ihre Einkaufsliste, sehen Live-Preise von jedem Lebensmittelhändler in Ihrer Umgebung, und gehen zu der Kasse, die am wenigsten kostet.

Der Auftrag war anspruchsvoll: Preise von lokalen Lebensmittelhändlern abziehen, sie aktuell halten, sie so präsentieren, dass es sich nach Storefront anfühlt und nicht nach Tabelle, und eine persönliche Einkaufsliste bauen, die die Nutzer überallhin begleitet - zu Hause am Web und im Geschäft am iPhone.

Vorgehen

Wir haben 100grammes.ca als gepaartes Web- und iPhone-Erlebnis rund um eine gemeinsame Einkaufsliste und eine Preis-Aggregations-Engine gebaut, die die lokalen Händler beobachtet:

• Web-Storefront - ein breites, bildstarkes Produkt-Grid mit kuratierten Streifen (“C’est le temps du Superbowl”, “Bataille d’avocats”) und Kategorie-Navigation. Jede Produktkarte zeigt den aktuell besten Preis über die aggregierten Händler hinweg; die Startseite kann für Events und saisonale Kampagnen ohne Engineering-Aufwand neu thematisiert werden.
• iPhone-Begleit-App - ein fokussierter Mobile-Flow rund um “Mon épicerie”: persönliche Einkaufsliste, schnelles Add-Product-Screen, Vorschläge, Produktdetails und eine Suche, die für die Nutzung im Laden optimiert ist. Vor dem Aufbruch öffnen, die günstigste Kasse ist schon gewählt.
• Operations-Konsole - eine Backoffice-Desktop-Sicht für Katalog, Preis-Feeds und Aggregations-Logik, gebaut wie ein modernes Admin-Panel.
• Marke und Design-System - Proxima Nova für den Fliesstext, Rubik für die Titel, ein Moodboard rund um frische Lebensmittel verdichtet zu einer kompakten Komponenten-Bibliothek, die beide Oberflächen teilen.

Wir sind demselben disziplinierten Ablauf gefolgt, den wir bei regulierter Software anwenden: Ideation und Roadmap, Moodboard und Style Guide, Wireframe, UX/UI-Prototyp und Design, Software-Entwicklung, Software-Testing, technischer Betrieb.

Resultat

Ein französischsprachiger Lebensmittel-Preisvergleich für Québec, live unter 100grammes.ca im Web und auf dem iPhone in der Hosentasche - eine Einkaufsliste, mehrere Händler, die günstigste Kasse für jeden Posten. Das Versprechen auf der Startseite: bis zu 30% sparen beim Wocheneinkauf.