Ein Konfigurator, der aus Interessenten konkrete Anfragen macht.

Viele Betriebe verkaufen Produkte oder Leistungen mit Optionen: Carports in verschiedenen Größen, Menüs für Feiern, Umzüge mit Zusatzservices. Interessenten stellen dazu immer dieselben Fragen — meist per Telefon, verteilt über den ganzen Tag.

Diese Demo haben wir in Eigenregie entwickelt, um zu zeigen, wie ein Konfigurator dieses Problem löst. Sie läuft vollständig hier im Browser — probieren Sie sie oben aus.

• Interessenten haben keine Preisorientierung und trauen sich deshalb oft gar nicht erst anzufragen.
• Anfragen kommen unvollständig an — es folgen mehrere Runden Rückfragen, bevor ein Angebot möglich ist.
• Der Betrieb beantwortet immer dieselben Grundfragen, statt Angebote zu schreiben.

Interessenten sollen sich selbstständig orientieren können — Optionen durchspielen, einen Richtpreis sehen — und am Ende eine Anfrage senden, die alle Angaben für ein konkretes Angebot enthält.

• Vier klare Schritte: Größe, Material, Dach, Extras — jede Option mit verständlicher Beschreibung und transparentem Aufpreis.
• Live-Zusammenfassung: Die Auswahl und der Richtpreis aktualisieren sich sofort — der Interessent behält jederzeit den Überblick.
• Richtpreis statt Festpreis: Der Konfigurator gibt Orientierung („ab …“), das verbindliche Angebot macht der Betrieb.
• Anfrage als Abschluss: Ein Klick übergibt die komplette Konfiguration — keine Rückfragen zu den Grundlagen mehr.

Aufgeräumtes Karten-Layout mit deutlich sichtbarem Auswahlzustand, große Klickflächen auch für Daumen am Smartphone, und eine dunkle Zusammenfassung, die sich beim Scrollen mitbewegt. Die Preiszeile nutzt Tabellenziffern, damit Beträge ruhig und bündig stehen.

Reines HTML, CSS und JavaScript — ohne externe Bibliotheken. Die Optionen sind echte Formular-Elemente: vollständig mit der Tastatur bedienbar, von Screenreadern vorlesbar, und die Zusammenfassung wird über eine Live-Region angekündigt.

Preise und Optionen liegen als einfache Datenwerte im Code — ein Betrieb kann sie ohne Programmierkenntnisse anpassen. In einem echten Projekt würde die Anfrage per E-Mail-Dienst oder n8n-Webhook übertragen und automatisch bestätigt.

Eine funktionierende, übertragbare Konfigurator-Vorlage — hier live erlebbar statt nur behauptet. Das Muster passt überall dort, wo Leistungen aus wählbaren Bausteinen bestehen: vom Gartenhaus über das Catering-Menü bis zum Dienstleistungspaket.