Website und Web-Software für einen Innenausbau- und Renovationsbetrieb aus Cham ZG. Kundinnen laden ein Foto ihres heutigen Bades oder ihrer Küche hoch und sehen den eigenen Raum neu gestaltet, mit laufender Kostenspanne. Dazu ein Preisrechner für acht Gewerke, ein Offert-Wizard und ein geschützter Verwaltungsbereich, in dem der Betrieb jede Anfrage mit Grundriss, Preiszeilen und Herkunft bearbeitet.
Was Bodin Bau GmbH brauchte und was wir gebaut haben
Ausgangslage
Bodin Bau führt Gipser-, Trockenbau-, Maler-, Platten-, Parkett- und Fassadenarbeiten sowie Badumbauten selbst aus, von Cham aus in Zug, Zürich, Schwyz, Luzern und Aargau. Wer ein Bad oder eine Küche erneuern will, hat zwei Fragen, bevor er anruft: Wie sieht das in meinem Raum aus, und in welchem Kostenrahmen bewege ich mich? Ein Kontaktformular beantwortet keine davon. Gleichzeitig kamen Anfragen bisher ohne Masse, Umfang und Material an, und der Betrieb musste jede Grundlage am Telefon nachfragen.
Unsere Lösung
Kern ist der Badplaner: Die Kundin lädt ein Foto ihres Bades hoch, tippt Raumgrösse und Objekte an und zieht den Grundriss in echten Zentimetern zurecht, auch mit einem Finger auf dem Handy. Danach wählt sie Platten, Fugen, Verlegemuster, Boden und Armaturen, die CHF-Spanne rechnet mit. Ein KI-Bildmodell zeigt am Schluss ihren eigenen Raum mit Fenster, Türe und Perspektive, aber mit dem neuen Bad. Die Bilderzeugung läuft als Auftrag auf dem Server weiter, auch wenn das Fenster zu ist; wer eine E-Mail hinterlässt, bekommt den Link. Nach demselben Prinzip gibt es einen Küchenplaner in sechs Schritten. Für alle anderen Arbeiten führt ein Preisrechner in drei Schritten zur Richtpreis-Spanne, ganz ohne Kontaktdaten, und ein Offert-Wizard in vier Schritten nimmt die verbindliche Anfrage auf. Im Verwaltungsbereich mit Anmeldung per E-Mail-Code sieht der Betrieb jede Anfrage mit Grundriss, Preiszeilen, Herkunft und Verlauf, dazu liegen gebliebene Konfigurationen als Arbeitsliste und ein Dashboard mit eigener Reichweitenmessung ohne Drittanbieter.
Architektur
So hängt alles zusammen
Die Bausteine von Bodin Bau GmbH und wie die Daten zwischen ihnen fliessen.
Vereinfachte Darstellung der Seitenstruktur. Seitenzahlen laut Live-Prüfung (Sitemap) vom 12.10.2026.
Ablauf
Wer macht was, Schritt für Schritt
Kunde
Betreiber
System
Kunde
Betreiber
System
01
Foto hochladen
Die Kundin startet den Badplaner und lädt ein Foto ihres heutigen Bades hoch. Ohne Foto entsteht ein allgemeines Bad.
02
Raum und Ausstattung wählen
Grösse, Objekte und Grundriss, danach Stil, Platten, Fugen, Boden und Armaturen. Die Kostenspanne läuft mit.
03
Visualisierung erzeugen
Der Server erzeugt das Bild als Auftrag. Dauert es länger, hinterlässt die Kundin ihre Mail und erhält den Link zur Ergebnisseite.
04
Unverbindlich anfragen
Mit Name und E-Mail geht die Anfrage samt Auswahl, Spanne, Foto und Visualisierung an den Betrieb.
05
Anfrage im Cockpit bearbeiten
Bodin Bau meldet sich per E-Mail-Code an, öffnet die Anfrage mit Grundriss und Preiszeilen und ruft zurück.
06
Status und Verlauf pflegen
Nach dem Gespräch setzt der Betrieb Status, Betrag oder Verlustgrund. Jede Änderung bleibt im Verlauf nachvollziehbar.
01
Kunde
Foto hochladen
Die Kundin startet den Badplaner und lädt ein Foto ihres heutigen Bades hoch. Ohne Foto entsteht ein allgemeines Bad.
02
Kunde
Raum und Ausstattung wählen
Grösse, Objekte und Grundriss, danach Stil, Platten, Fugen, Boden und Armaturen. Die Kostenspanne läuft mit.
03
System
Visualisierung erzeugen
Der Server erzeugt das Bild als Auftrag. Dauert es länger, hinterlässt die Kundin ihre Mail und erhält den Link zur Ergebnisseite.
04
Kunde
Unverbindlich anfragen
Mit Name und E-Mail geht die Anfrage samt Auswahl, Spanne, Foto und Visualisierung an den Betrieb.
05
Betreiber
Anfrage im Cockpit bearbeiten
Bodin Bau meldet sich per E-Mail-Code an, öffnet die Anfrage mit Grundriss und Preiszeilen und ruft zurück.
06
Betreiber
Status und Verlauf pflegen
Nach dem Gespräch setzt der Betrieb Status, Betrag oder Verlustgrund. Jede Änderung bleibt im Verlauf nachvollziehbar.
Schritt für Schritt
So läuft es im Einsatz
Echte Bildschirmaufnahmen entlang des Ablaufs.
Badplaner: vom Foto zur Kostenspanne
Der Weg einer Kundin durch den Badplaner, aufgenommen auf der Live-Site. Die Bildaufnahme am Schluss ist nicht abgebildet: Sie löst einen kostenpflichtigen KI-Auftrag aus.
Schritt 01 / 06
bodin-bau.swiss
01 · Einstieg «Sehen Sie Ihr neues Bad»Pfeiltasten wechseln den Schritt
Alle Schritte
01Schritt 1 / 6
bodin-bau.swiss
Einstieg «Sehen Sie Ihr neues Bad»
Die Landingpage zeigt mit einem Vorher-Nachher-Regler, was am Ende herauskommt, und erklärt den Ablauf in drei Punkten. So weiss die Kundin, worauf sie sich einlässt, bevor sie startet.
02Schritt 2 / 6
Schritt 1: Foto des Bades
Auf dem Handy öffnet «Kamera» direkt die Kamera, alternativ lädt sie ein Foto hoch oder überspringt den Schritt. Der Hinweis «bleibt privat» nimmt die häufigste Sorge vorweg.
03Schritt 3 / 6
bodin-bau.swiss
Schritt 2: Masse und Ausstattung
Breite und Länge per Regler, danach WC, Lavabo oder Dusche antippen. Die Kostenspanne rechts rechnet ab hier bei jeder Auswahl mit.
04Schritt 4 / 6
Grundriss in echten Zentimetern
Aus den Angaben entsteht sofort ein Grundriss mit Türe und Objekten. Wände und Objekte lassen sich mit dem Finger verschieben, der Plan fliesst in Kosten und Bild ein.
05Schritt 5 / 6
bodin-bau.swiss
Schritt 3: Stil, Platten und Fugen
Stilwelten, Plattenformat, Farbe, Verlegemuster und Fuge als Bildkacheln statt Dropdowns. Wer eigene Platten hat, wählt oben die zweite Option.
06Schritt 6 / 6
bodin-bau.swiss
Schritt 4: Ausstattung und Zusatzwünsche
Ausstattungslinie, Armaturenfarbe und Extras wie Regendusche als Chips. Die Zusammenfassung rechts zeigt jede Auswahl, «Mein Bad ansehen» startet danach die Visualisierung.
Zum nächsten Schritt seitlich wischen.
Preisrechner und Offert-Wizard
Für alle anderen Gewerke: zuerst der Richtpreis ohne Kontaktdaten, dann die verbindliche Anfrage. Aufgenommen bis vor dem Absenden.
Ansichten mit Kundendaten zeigen Beispieldaten oder sind geschwärzt.
Schritt 01 / 07
bodin-bau.swiss
01 · Rechner Schritt 1: Gewerk wählenPfeiltasten wechseln den Schritt
Alle Schritte
01Schritt 1 / 7
bodin-bau.swiss
Rechner Schritt 1: Gewerk wählen
Acht Gewerke mit Preis pro m² direkt auf der Karte. Der Hinweis «kostenlos und ohne Anmeldung» steht neben dem Knopf.
02Schritt 2 / 7
bodin-bau.swiss
Rechner Schritt 2: Menge
Die Fläche lässt sich per Regler oder als Zahl eingeben. Ein Beispiel unter dem Regler hilft beim Schätzen.
03Schritt 3 / 7
bodin-bau.swiss
Rechner Schritt 3: Zustand und Zusätze
Zustand der Flächen und Zusatzaufwand wie Möblierung oder Farbwechsel. Diese Angaben verschieben die Spanne am stärksten.
04Schritt 4 / 7
bodin-bau.swiss
Richtpreis-Spanne ohne Kontaktdaten
Die Spanne erscheint sofort, mit Menge, Preis pro Einheit und Berechnungsgrundlage. Von hier führt «Verbindliche Offerte anfordern» in den Wizard.
05Schritt 5 / 7
Offerte Schritt 1: Arbeiten
Mehrfachauswahl der Gewerke. Kommt die Kundin von einer Gewerkseite, ist das passende Gewerk schon angekreuzt.
06Schritt 6 / 7
Offerte Schritt 3: Zeitraum
Objekt und Ort sind erfasst, jetzt folgt der Zeitraum als Chips und eine freiwillige Beschreibung. Oben bleibt die bisherige Auswahl sichtbar und änderbar.
07Schritt 7 / 7Beispieldaten
Offerte Schritt 4: Kontakt
Nur drei Felder: Name, Telefon, E-Mail, hier mit Beispieldaten. Der Satz darunter erklärt, wofür beides gebraucht wird.
Zum nächsten Schritt seitlich wischen.
Funktionen
Was die Lösung kann
Badplaner mit Foto-Visualisierung
Fünf Schritte: Foto, Bad, Stil, Ausstattung, Ergebnis. Am Ende steht der eigene Raum neu gestaltet, mit einer CHF-Spanne, die sich Position für Position aufklappen lässt.
Grundriss zum Antippen
Erst fragen, dann zeichnen: Raumgrösse und Objekte wählen, der Plan steht da. Wände ziehen und WC, Lavabo oder Dusche in echten Zentimetern verschieben. Der Plan speist Kosten und Bild.
Küchenplaner
Sechs Schritte von Foto und Laufmeter über Fronten, Abdeckung und Geräteklasse bis zur Visualisierung, mit laufender Preisspanne und Regionsfaktor.
Eigene Platten mitbringen
Wer die Platten schon gekauft hat, lädt Fotos davon hoch und beschreibt den Verlegewunsch. Die Bilder gehen als Anhang mit der Anfrage an den Betrieb.
Preisrechner für 8 Gewerke
Gewerk wählen, Menge einstellen, Details angeben: Die Richtpreis-Spanne erscheint ohne Name oder Telefonnummer. Kleine Mengen berücksichtigen den Mindestauftrag.
Offert-Wizard in 4 Schritten
Arbeiten, Objekt und Ort, Zeitraum, Kontakt. Elf Gewerkseiten belegen den Wizard vor, die Herkunft der Anfrage geht mit. Betrieb und Anfragende erhalten je eine Mail.
Anfragen-Cockpit
Anfragen mit Filterleiste, Status direkt in der Zeile, Detail mit Grundriss, Preiszeilen, Herkunft und Bildern. Jede Änderung an Status, Betrag oder Notiz landet im Verlauf.
Dashboard und eigene Messung
Besucher, Trichter vom Besuch bis zur Anfrage und die beliebtesten Planer-Auswahlen, jeweils mit Vorperiode. Gemessen ohne Drittanbieter und ohne Banner.
Anmeldung ohne Passwort
Sechsstelliger Code per Mail, nur als Prüfsumme gespeichert. Nach fünf Fehlversuchen ist der Zugang 30 Minuten gesperrt.
Gewerk × Gemeinde
Elf Leistungsseiten, Seiten für Leistung und Ort, Standort- und Kantonsseiten, Kostenratgeber, Glossar und Referenzen mit Vorher-Nachher-Regler.
Mobil
Auf dem Smartphone
Offert-Wizard auf dem Handy, Schritt 1 von 4
Startseite mobil
Badplaner: Grundriss auf dem Handy
Seitlich wischen für weitere Ansichten.
Einblicke
So sieht es aus
Einstieg in den Badplaner mit Vorher-Nachher-Regler
Startseite «Alle Gewerke. Ein Betrieb.»
Badplaner: Grundriss in echten Zentimetern, Objekte antippen
Badplaner: Stil, Platten und Fugen wählen
Preisrechner: Gewerk wählen, Richtpreis ohne Kontaktdaten
FAQ
Häufige Fragen
Wie funktioniert der Badplaner von Bodin Bau?
+
Die Kundin lädt ein Foto ihres heutigen Bades hoch, gibt Raumgrösse und Objekte an und passt den Grundriss an. Danach wählt sie Platten, Fugen, Verlegemuster, Boden und Armaturen, während die Kostenspanne mitläuft. Ein KI-Bildmodell zeigt am Schluss ihren eigenen Raum mit dem neuen Bad. Die Visualisierung ist eine Vorstellungshilfe, kein Planungsstand.
Warum zeigt der Preisrechner das Ergebnis ohne Kontaktdaten?
+
Bauherren wollen zuerst wissen, ob ihr Vorhaben ins Budget passt. Bei Bodin Bau erscheint die Richtpreis-Spanne sofort. Wer danach eine verbindliche Offerte will, wechselt in den Offert-Wizard und gibt seine Daten dort freiwillig an.
Was sieht der Betrieb von einer Anfrage?
+
Im geschützten Verwaltungsbereich sieht Bodin Bau Kontakt, gewählte Konfiguration, Grundriss, Preiszeilen, die Einstiegsseite der Anfrage und bei Planer-Anfragen Foto und Visualisierung. Status, Betrag, Notiz und Verlustgrund werden direkt erfasst und im Verlauf gespeichert.
Wer sieht die hochgeladenen Fotos?
+
Fotos und Visualisierungen liegen in einem privaten Objektspeicher. Der einzige Weg nach aussen führt über einen geschützten Pfad im Verwaltungsbereich, der eine Anmeldung voraussetzt.