Stielvoll
Aus einem einzelnen Produkt wird ein interaktives 3D-Erlebnis
Ein Bio-Eis-Shop mit einem Echtzeit-3D-Produkt zum Ziehen und Abbeißen, einem Box-Konfigurator und Stripe-Checkout.
Kapitel · Zu einem Schritt springen
Was in diesem Video passiert
Sechs Sorten erscheinen nacheinander, jede in ihrer eigenen Farbe. Eine Hand zieht am Eis, es wackelt wie Wackelpudding, dann wird abgebissen. Mit der Sortenwahl färbt sich die ganze Seite um. Sortenkarten geben nach, während Eis in den Warenkorb fliegt. Eine Sechser-Box entsteht mit Live-Preis, der Warenkorb zeigt Allergene in jeder Zeile, und der Checkout bietet Abholung oder Lieferung im Zwei-Stunden-Fenster. Die Bestellung wird mit Stripe im Testmodus bezahlt und erscheint als bezahlte Bestellung mit Nummer. Das Video hat keinen Ton.
Stielvoll ist eine Konzeptmarke, die wir entworfen und entwickelt haben, um diese Art von Produkt zu zeigen. Der Shop nimmt keine echten Bestellungen an, hat keine echte Zertifizierung, und Zahlungen laufen im Testmodus von Stripe.
Das Problem
Kleine Lebensmittelmarken brauchen einen Shop, der sich nach ihrer Marke anfühlt, nicht nach einer Vorlage. Die meisten Shop-Vorlagen sehen gleich aus, und das Produkt – das, was die Marke ausmacht – endet als flaches Foto in einem Raster.
Was wir gebaut haben
Ein 3D-Eis in Echtzeit
Ziehen, und es wackelt wie Wackelpudding; antippen, und man beißt ab. Es läuft reibungslos im Browser, auch auf dem Handy.
Box-Konfigurator mit Live-Preis
Sechs oder zwölf Eis frei kombinieren und dabei Preis und Ersparnis live mitverfolgen.
Stripe-Checkout
Abholung oder Lieferung am selben Tag im Zwei-Stunden-Fenster, bezahlt über Stripe Checkout; die Preise berechnet der Server.
Allergene bei jeder Sorte
Zutaten in der Reihenfolge ihrer Menge, Allergene hervorgehoben, wie es die EU-Kennzeichnung vorsieht.
Deutsch und Englisch
Jede Seite und jede Meldung in beiden Sprachen, dazu eine Bestellübersicht für den Shop.
Unter der Haube
- Next.js
- React Three Fiber
- Stripe
- Supabase
Das Eis ist eine kleine, selbst geschriebene Soft-Body-Simulation – ein Gitter aus Federn – statt eines Videos oder einer schweren Physik-Bibliothek. So bleibt es flüssig und leicht genug für mobile Geräte.
Galerie
Was es zeigt
- Wir bauen ein vollständiges Produkt, vom verspielten Frontend bis zur bezahlten Bestellung in der Verwaltung.
- Wir können das Produkt selbst zum Erlebnis machen, in Echtzeit-3D, ohne den Shop auszubremsen.
- Wir erledigen auch die unspektakulären Teile sauber: Zahlungen, Zeitfenster, Allergene, zwei Sprachen.
Das möchten Sie auch für Ihr Unternehmen?
Erzählen Sie uns, was Sie vorhaben, und wir sagen Ihnen ehrlich, wie wir es bauen würden.
