Ausgangslage
Die Wilhelm Schmidlin AG, ist ein Innerschweizer Traditionsunternehmen für Badewannen, Duschwannen, Duschflächen und Waschbecken aus glasiertem Titanstahl. Die bestehende Webseite von Schmidlin war bereits technisch in die Jahre gekommen und verfügte über eine hohe Informationsdichte, die jedoch kaum strukturiert war.
Produkte liessen sich nur schwer auffinden, und der Weg vom Interesse bis zur Conversion, also Kauf oder Abschlussberatung, war unklar definiert. Dieser Sales-Userflow bildete eine Kernherausforderung in der Neuerarbeitung der Webseite. Auf Basis der gemeinsam definierten Anforderungen wurden die zentralen UX-Ziele und Lieferobjekte festgelegt und Schwerpunktthemen wie die Conversion Userflows etabliert.
Die Wilhelm Schmidlin AG, ist ein Innerschweizer Traditionsunternehmen für Badewannen, Duschwannen, Duschflächen und Waschbecken aus glasiertem Titanstahl. Die bestehende Webseite von Schmidlin war bereits technisch in die Jahre gekommen und verfügte über eine hohe Informationsdichte, die jedoch kaum strukturiert war.
Produkte liessen sich nur schwer auffinden, und der Weg vom Interesse bis zur Conversion, also Kauf oder Abschlussberatung, war unklar definiert. Dieser Sales-Userflow bildete eine Kernherausforderung in der Neuerarbeitung der Webseite. Auf Basis der gemeinsam definierten Anforderungen wurden die zentralen UX-Ziele und Lieferobjekte festgelegt und Schwerpunktthemen wie die Conversion Userflows etabliert.
Konzeption
Ausgangspunkt der Konzeption war eine vollständige Analyse und Neuorganisation sämtlicher Produktgruppen. Daraus entstand ein schlankes Navigationskonzept, das sowohl B2B- als auch B2C-Kunden zielgerichtet zu ihren Produkten führt. Um die Hypothesen frühzeitig zu validieren, wurde parallel ein Schwerpunkt Userflow erarbeitet und mit Figma Make in einen visuellen, voll funktionalen Prototypen überführt. Im Rahmen der Konzeption wurde auch das Design überarbeitet und in einen modernen Auftritt übertragen.
Testing
Um die zentralen UX-Hypothesen frühzeitig zu validieren, wurde der interaktive Prototyp mit Useberry getestet und mit bestehenden Kunden evaluiert. Dabei wurden insbesondere Produktsuche, Filterung, Produktvergleich, Downloads und der Weg zur Beratung untersucht.
Das Testing bestätigte die grundsätzliche Nutzerführung: Produktauswahl und Vergleich wurden als übersichtlich und intuitiv wahrgenommen, 90 % der Tester fanden den Download von Dokumenten sofort und über 80 % bewerteten die verwendeten Icons als verständlich. Gleichzeitig wurden konkrete Usability- und Conversion-Hürden sichtbar. Besonders die Navigation über die Merkliste zur Beratung war für mehrere Nutzer nicht unmittelbar verständlich. Auch bei Filtern, Vergleichsfunktionen, Icon-Bedeutungen und der Bezeichnung der Händlersuche zeigten sich Optimierungspotenziale.
Die Erkenntnisse wurden priorisiert und direkt in die weitere Konzeption und Umsetzung überführt. Unter anderem wurden eine direkte Beratungsoption auf der Produktdetailseite, eine einfacher zugängliche Vergleichsfunktion, zusätzliche und verständlichere Filter, klarere Download-Strukturen sowie präzisere Bezeichnungen und Tooltips umgesetzt.
Ausgangspunkt der Konzeption war eine vollständige Analyse und Neuorganisation sämtlicher Produktgruppen. Daraus entstand ein schlankes Navigationskonzept, das sowohl B2B- als auch B2C-Kunden zielgerichtet zu ihren Produkten führt. Um die Hypothesen frühzeitig zu validieren, wurde parallel ein Schwerpunkt Userflow erarbeitet und mit Figma Make in einen visuellen, voll funktionalen Prototypen überführt. Im Rahmen der Konzeption wurde auch das Design überarbeitet und in einen modernen Auftritt übertragen.
Testing
Um die zentralen UX-Hypothesen frühzeitig zu validieren, wurde der interaktive Prototyp mit Useberry getestet und mit bestehenden Kunden evaluiert. Dabei wurden insbesondere Produktsuche, Filterung, Produktvergleich, Downloads und der Weg zur Beratung untersucht.
Das Testing bestätigte die grundsätzliche Nutzerführung: Produktauswahl und Vergleich wurden als übersichtlich und intuitiv wahrgenommen, 90 % der Tester fanden den Download von Dokumenten sofort und über 80 % bewerteten die verwendeten Icons als verständlich. Gleichzeitig wurden konkrete Usability- und Conversion-Hürden sichtbar. Besonders die Navigation über die Merkliste zur Beratung war für mehrere Nutzer nicht unmittelbar verständlich. Auch bei Filtern, Vergleichsfunktionen, Icon-Bedeutungen und der Bezeichnung der Händlersuche zeigten sich Optimierungspotenziale.
Die Erkenntnisse wurden priorisiert und direkt in die weitere Konzeption und Umsetzung überführt. Unter anderem wurden eine direkte Beratungsoption auf der Produktdetailseite, eine einfacher zugängliche Vergleichsfunktion, zusätzliche und verständlichere Filter, klarere Download-Strukturen sowie präzisere Bezeichnungen und Tooltips umgesetzt.
Umsetzung
In der Umsetzung wurde die Webseite um moderne Interaktionen, Scrollytelling-Elemente und eine grosszügige Bildsprache erweitert. Die Produktdarstellung und Filtermöglichkeit wurde geschärft und auf die Zielgruppen ausgerichtet.
Eine zusätzliche Herausforderung stellte die Anbindung eines PIM-Systems dar, das die Datenstruktur und Produktverwaltung deutlich komplexer machte. Auch das PIM verfügte bereits über eine grosse Informationsdichte, welche im Projektverlauf überarbeitet und mit dem Design in Einklang gebracht wurde.
In der Umsetzung wurde die Webseite um moderne Interaktionen, Scrollytelling-Elemente und eine grosszügige Bildsprache erweitert. Die Produktdarstellung und Filtermöglichkeit wurde geschärft und auf die Zielgruppen ausgerichtet.
Eine zusätzliche Herausforderung stellte die Anbindung eines PIM-Systems dar, das die Datenstruktur und Produktverwaltung deutlich komplexer machte. Auch das PIM verfügte bereits über eine grosse Informationsdichte, welche im Projektverlauf überarbeitet und mit dem Design in Einklang gebracht wurde.
Die Designumsetzung erfolgte Komponentenbasiert, was eine effiziente Übergabe an die Entwickler sowie eine gesteigerte Flexibilität für den Kunden ermöglichte.
Endprodukt
Entstanden ist eine spürbar optimierte Userführung, mit der B2B- wie B2C-Kunden ihre Produkte gezielt finden und anschliessend direkt mit Schmidlin in Kontakt treten können. Das neue Navigationskonzept schafft Struktur in einem breiten Produktsortiment, ohne die Auffindbarkeit einzelner Produkte einzuschränken. Dank modernem und grosszügigem Webauftritt und einer soliden technischen wie auch nutzerorientierten Umsetzung ist ein zukunftssicherer Webauftritt entstanden.
Dank einem klar strukturierten Designfile und und einer ausführlichen Dokumentation des Designsystems, der Komponenten und Umsetzungsanforderungen konnte das Design 1:1 fristgerecht umgesetzt werden.
Entstanden ist eine spürbar optimierte Userführung, mit der B2B- wie B2C-Kunden ihre Produkte gezielt finden und anschliessend direkt mit Schmidlin in Kontakt treten können. Das neue Navigationskonzept schafft Struktur in einem breiten Produktsortiment, ohne die Auffindbarkeit einzelner Produkte einzuschränken. Dank modernem und grosszügigem Webauftritt und einer soliden technischen wie auch nutzerorientierten Umsetzung ist ein zukunftssicherer Webauftritt entstanden.
Dank einem klar strukturierten Designfile und und einer ausführlichen Dokumentation des Designsystems, der Komponenten und Umsetzungsanforderungen konnte das Design 1:1 fristgerecht umgesetzt werden.
