Headless-Relaunch für die Produktstory von STATEC BINDER
Ein komponierbarer Rebuild auf Storyblok und Next.js — der die alte WordPress-Seite ablöst, dem Marketing-Team eine eigene Komponentenbibliothek zum Selbstbedienen gibt und in fünf Sprachen aus einer einzigen Quelle ausspielt.
Web
Headless
Storyblok
Next.js
01
DIEHERAUSFORDERUNG
Die alte statec-binder.com lief auf einer in die Jahre gekommenen WordPress-Codebasis, die nicht mehr zu dem passte, wie STATEC BINDER tatsächlich am Markt auftritt — fünf Sprachen pflegen, tiefe Produktkataloge publizieren, und ein Vertrieb, der qualifizierte Leads braucht und nicht ein Kontaktformular.
02
DIELÖSUNG
Ein Headless-Rebuild auf Storyblok und Next.js. Wir haben eine Komponentenbibliothek entworfen, aus der das Marketing-Team Seiten frei zusammenbaut, mehrsprachiges Redigieren in denselben Workflow eingebaut, HeyFlow-Multi-Step-Formulare für die Leadgewinnung angebunden und Storyblok mit Vimeo verbunden, damit Maschinenvideos sauber streamen — ohne Bandbreiten-Strafe.
03
DIEERGEBNISSE
5
Sprachen, ein CMS
100%
Editor-gesteuerte Seiten
0
Zeilen Legacy-WP
Multi-Step
Lead-Funnel
Der Kunde
STATEC BINDER ist ein österreichischer Maschinenbauer mit Sitz in Gleisdorf. Sie bauen vollintegrierte Absack- und Palettieranlagen — Offensack- und FFS-Verpackungsmaschinen, Palettierer, Big-Bag-Stationen, Waagen und Sackverschluss-Systeme — die an industrielle Kunden auf der ganzen Welt ausgeliefert werden. „Highly efficient bagging and palletizing solutions, made in Austria” ist nicht nur ein Claim, sondern die Latte, an der sich der gesamte Katalog messen lassen muss.
Die neue Startseite — ein selbstbewusster, redaktioneller Einstieg in die Produktstory
Das Briefing
Die bisherige Seite lief auf einer alten WordPress-Codebasis, die zur Wartungslast geworden war — träge im Update, schwierig zu erweitern, und immer weiter weg davon, wie das Unternehmen tatsächlich am Markt auftritt. STATEC BINDER bedient Industriekunden in fünf Sprachregionen, mit einem tiefen Maschinen-Katalog, in dem jede Anlage ihre eigene Konfigurationsstory verdient. Die neue Seite musste dem internen Team den Raum geben, diese Story selbst zu erzählen — ohne bei jeder Copy-Änderung oder jedem Produktlaunch wieder bei der Engineering-Truppe anzuklopfen.
Was wir gebaut haben
Headless auf Storyblok
Wir haben die Seite als komponierbares System auf Storyblok neu gebaut — dem Headless-CMS, das eine Seite als Stapel editor-gesteuerter Blöcke versteht statt als starres Template. Dazu eine eigene Komponentenbibliothek: Heros, Produktübersichts-Cards, Feature-Listen, Kontakt-Grids, Video-Blöcke, Multi-Step-Formulare — alle so geschnitten, dass das Marketing-Team beliebige Seiten daraus zusammenstellt. Alles, was im Frontend sichtbar ist, wird in Storyblok konfiguriert. Keine Entwickler-Tickets mehr für einen Copy-Tweak, einen neuen Abschnitt oder eine frische Landingpage.
Maschinen-Übersicht — eine Storyblok-Komponente, die das Team wiederverwendet, um jede Auswahl aus dem Portfolio zu inszenieren
Fünf Sprachen aus einer Quelle
STATEC BINDER liefert weltweit, und die Seite ist in fünf Sprachen übersetzt. Wir haben mehrsprachiges Redigieren direkt in Storyblok verdrahtet — jede Seite existiert einmal als strukturierter Baum, übersetzte Felder liegen nebeneinander. Redaktion wechselt die Sprache per Klick; Engineering muss nichts tun, wenn ein neues Locale dazukommt.
Next.js für ein schnelles, modernes Frontend
Das Frontend ist Next.js. Das gibt uns Rendering-Kontrolle pro Seite, Bild- und Font-Optimierung ab Werk und genau die Cold-Start-Performance, die ein Industriekunde von einer ernstgemeinten B2B-Seite erwartet. Darüber liegen dezente, scrollgesteuerte Animationen entlang der wichtigsten User-Journeys — Maschinen-Übersichten, Deep-Dive-Produktseiten, der Kontaktflow — damit sich das Erlebnis lebendig anfühlt, ohne von der technischen Substanz darunter abzulenken.
Produktdetail — Galerie, Optionen und Vorteile, alles über Storyblok-Komponenten gesteuert
HeyFlow Multi-Step-Formulare für qualifizierte Leads
Ein B2B-Kontaktformular, das nur „Name, E-Mail, Nachricht” abfragt, lässt Geld liegen. Wir haben HeyFlow integriert, um saubere Multi-Step-Lead-Strecken zu bauen — eigene Pfade für eine unverbindliche Anfrage, eine Ansprechpartner-Suche, eine Infomaterial-Anforderung und ein Service-&-Ersatzteile-Ticket. Jeder Pfad fragt genau das ab, was er braucht, leitet den Interessenten direkt an den richtigen Desk innerhalb von STATEC BINDER weiter und fühlt sich leichter an als eine einschüchternde Wand aus Eingabefeldern.
Vier Lead-Intents, vier HeyFlow-Pfade — jeder zum richtigen Team geroutetKontaktseite — Intents oben, Hauptsitz, Standort und direkte Durchwahl unten
Storyblok ↔ Vimeo für Maschinenvideos
Absack- und Palettieranlagen sind Maschinen, die man in Bewegung sehen muss. Wir haben Storyblok mit Vimeo verbunden, damit Video im selben redaktionellen Flow sitzt wie Text und Bild — die Redaktion fügt einen Vimeo-Link ein, das Frontend streamt adaptiv. Keine Bandbreiten-Steuer auf der Seite, kein klobiger Drittanbieter-Player, und das Team muss sich nicht um Hosting, Transcoding oder Geräte-Kompatibilität kümmern.
Ergebnis
Eine Seite, die STATEC BINDERs Marketing-Team end-to-end besitzt. Fünf Sprachen leben aus einem einzigen redaktionellen Workflow, jeder sichtbare Block ist komponier- und wiederverwendbar, Multi-Step-Lead-Formulare routen Interessenten an den richtigen Desk, Maschinenvideos streamen sauber im selben Baum mit. Der Headless-Ansatz läuft so reibungslos, dass wir das System gemeinsam Stück für Stück erweitern — neue Komponenten, neue Sections, neue Lead-Pfade — statt es zu ersetzen. Genau die Plattform, auf der eine ernstzunehmende Industriemarke laufen sollte.
Ein Projekt, auf das wir stolz sind, für ein Unternehmen, das sein „highly efficient” tatsächlich einlöst.
Lass uns gemeinsam etwas aufbauen.
Hast du ein Projekt im Sinn?
Wenn diese Art von Arbeit deiner ähnelt – oder das Gegenteil, und du dich fragst, ob wir trotzdem die Richtigen für dich sind – erzähl uns davon. Wir melden uns innerhalb von drei Werktagen mit einer ehrlichen Einschätzung zurück.