Case Study: Webflow Website für ein mittelständisches Unternehmen

Von der Idee zur Realität: Webflow als Lösung für eine moderne Website eines mittelständischen Unternehmens. Die alte Website von ZAHNA FLIESEN spiegelte nicht den hohen Standard und die Qualität wieder, welche das Unternehmen mit den eigenen Produkten repräsentiert. Mit einem Relaunch der Website sollte diese Qualität auch auf den digitalen Auftritt übertragen werden. In diesem Zuge sollte auch eine neu erarbeitete digitale Designsprache gestaltet werden, die tradition und moderne vereint.
Die Herausforderung in der Umsetzung bestand unter anderem darin, eine komplexe Website mit über 2000 CMS-Elementen performant umzusetzen. In diesem Video zeige ich dir den gesamten Prozess von der Planung über die Gestaltung bis hin zur Umsetzung.  

Zur Website: https://www.zahna-fliesen.de‍

Video Timestamps

00:00 – Intro
01:24 – Infos zum Kunde
02:20 – Ausgangslage
04:50 – Ablauf Projektstart
07:39 – Erarbeitung der neue Designsprache
19:55 – Startseite
24:32 – Seite: Technische Perfektion
25:51 – Kunden eigene Seiten über Webflow aufbauen lassen
27:49 – Seite: Über uns
30:07 – Seite: Downloads
30:35 – Seite: Interaktive Händlerkarte mit Mapbox
31:40 – Produktseiten
44:10 – Erfahrungen und Probleme mit Webflow

Von der Idee zur Realität: Webflow als Lösung für eine moderne Website eines mittelständischen Unternehmens

Ich möchte heute mit euch meine Erfahrungen bei der Erstellung einer neuen Webflow Website für das Unternehmen ZAHNA FLIESEN teilen. Gemeinsam mit meinem Kollegen Lukas Rudrof habe ich an diesem spannenden Projekt gearbeitet. Die Herausforderung bestand darin, eine moderne und komplexe Website für ein mittelständisches Unternehmen mit über 2000 CMS-Elementen zu erstellen. In diesem Beitrag werde ich euch durch den gesamten Prozess führen und euch zeigen, wie wir die Website Schritt für Schritt geplant, gestaltet und umgesetzt haben.

Die Ausgangslage und Planung

Die alte Website von ZAHNA FLIESEN entsprach nicht den heutigen Standards für mittelständische Unternehmen. Sie war nicht modern oder benutzerfreundlich. Änderungen mussten über eine Agentur durchgeführt werden, was zu zusätzlichen Kosten führte. Unser Ziel war es, eine moderne und ansprechende Website zu schaffen, die es dem Kunden ermöglicht, Inhalte eigenständig zu verwalten. Wir haben uns zu Beginn mit dem Kunden getroffen, um die Ziele und Anforderungen zu besprechen und eine klare Strategie für den Relaunch zu entwickeln.

Die Designsprache entwickeln

Gemeinsam mit Lukas haben wir uns Gedanken über die Designsprache gemacht. Wir wollten eine Kombination aus traditionellem und modernem Design, um das Premium-Segment des Unternehmens hervorzuheben. Wir haben uns verschiedene Schriftarten und Farbpaletten angesehen und erste Entwürfe erstellt, um dem Kunden eine visuelle Vorstellung zu präsentieren.

Der One-Pager und der Kick-off-Call

Im ersten Anlauf haben wir einen One-Pager erstellt, der die wichtigsten Informationen kompakt präsentierte und als Vorgeschmack auf die neue Website diente. Dieser musste vor einer Messer fertig sein. Vor dem eigentlichen Projektstart hatten wir einen Kick-off-Call mit dem Kunden, um die Ziele und Wünsche im Detail zu besprechen. Wir haben gemeinsam Ideen gesammelt und erste Entwürfe vorgestellt, um sicherzustellen, dass wir auf dem richtigen Weg waren.

Die Gestaltung der Unterseiten

Nachdem die Designsprache und die Grundstruktur festgelegt waren, haben wir uns an die Gestaltung der Unterseiten gemacht. Die Herausforderung bestand darin, die vielen Produkte  ansprechend darzustellen und eine benutzerfreundliche Navigation zu gewährleisten. Als Roten Faden haben wir ein Linien-Grid entworfen, um die verschiedenen Bereiche der Website visuell voneinander abzugrenzen und eine klare Struktur zu schaffen.

Die Umsetzung und der Launch

Nachdem die Gestaltung abgeschlossen war, haben wir uns an die Umsetzung der Website in Webflow gemacht. Wir haben uns für Webflow entschieden, da es uns komplette Design-Freiheit zu Verfügung stellt und gleichzeitig eine benutzerfreundliche CMS-Lösung für den Kunden schafft. Die Umsetzung in Webflow dauerte ca 2 Monate, aber das Ergebnis war überzeugend. Nach gründlichen Tests und Anpassungen ging die Website schließlich live und erhielt positive Resonanz von Kunden und Besuchern.