Vitalis — Online-Shop für biologisch aktive Nahrungsergänzungsmittel für Europa: Funktionstüchtiger Prototyp an einem Tag

Was wurde gemacht

Der Online-Shop wurde mit Next.js – einer modernen Technologie, die die größten E-Commerce-Websites der Welt antreibt – und Claude AI erstellt. Er ist professionell und nach den besten Traditionen der Programmierung von 2026 gefertigt: Der Quellcode befindet sich auf GitHub mit vollständiger architektonischer Dokumentation. Der Code des Shops ist vertrauliche Kundeninformation: Das Repository ist privat, nicht öffentlich zugänglich und nur der Shop-Besitzer hat Zugriff. Das Projekt ist bereitgestellt und unter einer permanenten Adresse in Betrieb. Für den Kunden bedeutet dies eine einfache Sache: Sie sind nicht an einen einzigen Entwickler gebunden – jeder Programmierer kann auf den Code zugreifen, die Dokumentation lesen und die Weiterentwicklung des Shops fortsetzen.

Vitalis – ein Prototyp für einen Nahrungsergänzungsmittel-Shop in Europa. Aufgabe: Ein Online-Shop für Nahrungsergänzungsmittel für den Verkauf in ganz Europa, im Stil von kuratierten Wellbeing-Marktplätzen (Referenz – healf.com), ohne Standardplattformen wie Shopify – nur individuelle Entwicklung.

Live-Demo: www.gptaria.com/p/vitalis – das sind nicht nur Bilder, das ist ein funktionierender Shop: Klicken Sie sich durch und erkunden Sie ihn.

Ein Katalog, der bei der Auswahl hilft

Produkte sind in vier Gesundheitsbereiche – Ernährung, Bewegung, Geist, Schlaf – und nach Zielen kategorisiert: Immunität, Verdauung, Schlaf, Langlebigkeit, Energie. Kunden scrollen nicht durch eine endlose Liste; sie beginnen mit ihrem Ziel: „Ich möchte besser schlafen“ – und sehen nur relevante Produkte. Jede Produktkarte enthält ein Foto, die Marke, eine Bewertung mit Rezensionen und den Preis.

Empfehlungen, die den durchschnittlichen Bestellwert erhöhen

Jede Produktkarte enthält einen Abschnitt „Häufig zusammen gekauft“. Hier werden keine zufälligen Artikel angezeigt: Empfehlungen basieren auf übereinstimmenden Zielen – Kreatin kann mit Protein und Magnesium kombiniert werden, da diese oft zusammen gekauft werden. So funktioniert Upselling ohne einen einzigen Verkäufer.

Ein Warenkorb, der sich selbst verkauft

Der Warenkorb beinhaltet zwei Verkaufsmechanismen: eine Aktion „Kaufe 3, erhalte 1 gratis“ (das günstigste der vier ist gratis) und eine Fortschrittsanzeige für kostenlosen Versand über 50 € – der Kunde sieht „füge 12 € hinzu“ und legt Artikel in den Warenkorb. Der Inhalt des Warenkorbs bleibt erhalten, während der Nutzer die Website durchstöbert.

Persönliches Kundenkonto – Weniger Supportanfragen

Kunden haben ihr eigenes Konto: Bestellhistorie mit Daten, Inhalten, Beträgen und Status – bezahlt, versendet, geliefert, zurückgesendet – und die Sendungsnummer des Spediteurs (DHL, DPD) direkt in der Bestellkarte. Die häufigste Frage an den Support eines Online-Shops ist „Wo ist meine Bestellung?“; hier beantwortet der Kunde sie selbst, ohne eine E-Mail senden oder anrufen zu müssen.

Der Kunde sieht auch den Gesamtbetrag aller seiner Einkäufe im Shop – dies ist praktisch für die Implementierung eines Treueprogramms: Sammeln Sie einen bestimmten Betrag, erhalten Sie einen Status und einen Rabatt. In den Einstellungen können Kunden ihre E-Mail-Adresse und die Anzeigesprache ändern – die gleichen vier Sprachen wie auf der Website, sodass ein deutscher Kunde seine Bestellungen auf Deutsch liest.

Fertige Website und Vertriebsmanagement-System (CRM)

Der Shop wird mit einem Admin-Panel geliefert – kein separater Kauf und keine Integration eines separaten Managementsystems erforderlich. Es ist unter /admin erreichbar und erfordert keine technischen Kenntnisse: Alles wird in einer Tabelle bearbeitet, wie eine normale Datei.

Geld oben. Vier Kennzahlen, die typischerweise in Berichten geprüft werden: Umsatz abzüglich Retouren, Anzahl der Bestellungen, Anzahl der Kunden und durchschnittlicher Check. Der Inhaber kann den Status des Shops sofort nach der Anmeldung einsehen.

Der Tab „Produkte“ dient der Verwaltung des Frontends. Preis und Lagerbestand können direkt in der Tabellenzeile bearbeitet werden, der Status kann zwischen „Veröffentlicht“ und ausgeblendet umgeschaltet werden, und neue Produkte werden mit drei Feldern hinzugefügt – Marke, Name, Preis. Für jeden Artikel werden Bewertungen und die Anzahl der Rezensionen abgerufen. In der Vollversion steht hier eine KI-Importfunktion zur Verfügung: Lieferanten-Feed (CSV / XML / API) → automatische Generierung von Beschreibungen und SEO-Texten in EU-Sprachen → Moderation → Veröffentlichung, was bedeutet, dass tausend Artikel ohne manuelle Eingabe hinzugefügt werden können.

Der Tab „Kunden (CRM)“ ist eine Datenbank für wiederkehrende Verkäufe. Für jeden Kunden: Land, Anzahl der Bestellungen, LTV, Datum und Status der letzten Bestellung, Suche nach Name und E-Mail. Das System segmentiert Kunden automatisch – neue, wiederkehrende, VIP – und dies sind fertige Listen für Aktionen: VIPs erhalten frühen Zugang zu neuen Produkten, wiederkehrende Kunden erhalten Erinnerungen, wenn ihre aktuelle Versorgung zur Neige geht, und neue Kunden erhalten eine Willkommens-E-Mail. Im Geschäft mit Nahrungsergänzungsmitteln liegt der Gewinn nicht aus der ersten, sondern aus der zweiten und dritten Bestellung, daher sind Segmente keine bloßen Berichtsdekorationen, sondern umsatzgenerierende Werkzeuge.

Admin-Panel ansehen: www.gptaria.com/p/vitalis/admin – es ist im Demomodus mit Beispieldaten geöffnet.

SEO und KI-Sichtbarkeit – Integriert, nicht nachträglich hinzugefügt

Der Shop verfügt über einen automatischen SEO-Mechanismus: Wenn ein Produkt oder Artikel hinzugefügt wird, werden alle notwendigen On-Page-Metadaten – Titel, Beschreibungen, Markup für Suchmaschinen (schema.org) – automatisch generiert. Diese werden sowohl von Google als auch von KI-Systemen gelesen: ChatGPT, Gemini und andere KI-Assistenten, die Menschen zunehmend für „Wo kaufen“-Anfragen konsultieren. Die Promotion funktioniert von selbst: Keine Notwendigkeit, eine separate SEO-Firma einzustellen und die Website später neu zu machen – der Shop ist von Geburt an sichtbar. In der Vollversion schreibt die KI auch automatisch überzeugende Beschreibungen und SEO-Texte in EU-Sprachen für jedes importierte Produkt.

Vier Sprachen – Verkauf in ganz Europa

Ukrainisch, Russisch, Englisch und Deutsch sind bereits funktionsfähig: ein Umschalter im Header, und alles ist übersetzt, einschließlich des Menüs. Die Architektur ist bereit für jede EU-Sprache – die Erschließung eines neuen Marktes erfordert keine Shop-Modifikationen.

Mobile Version

Vollständige mobile Anpassung: kompaktes Header, Navigation nach Gesundheitsbereichen, Produktgitter optimiert für schmale Bildschirme. Die meisten Käufe von Nahrungsergänzungsmitteln werden über Smartphones getätigt – der Shop ist dafür bereit.

Wie der Arbeitsfortschritt aussah

Ein funktionierender Prototyp war am Tag des Erstkontakts fertig – in Stunden, nicht in Wochen. Iterationen folgten demselben Muster: Der Kunde bat um Änderungen und sah die Ergebnisse am selben Tag unter demselben Link. Basierend auf diesem Feedback machte der Kunde ein Angebot – das Projekt wurde mit einem Deal abgeschlossen.

Was in der Vollversion enthalten ist

KI-Produktimport aus Lieferantenpreislisten mit automatisch generierten Beschreibungen und Überprüfung von Gesundheitsaussagen gemäß EU-Vorschriften (Verordnung 1924/2006), Stripe / PayPal / Klarna-Zahlungen, DHL / DPD / GLS / InPost-Versand, PostgreSQL-Datenbank und schnelle Suche mit Filtern.

Stack: Next.js 15 · React 19 · Tailwind CSS 4 · TypeScript · Claude.