Alle Arbeiten

Fallstudie · 2026 · Web

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

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.

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.

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.

STATEC BINDER Startseite-Hero — der Firmensitz in Gleisdorf mit dem Headline 'Highly efficient bagging and palletizing solutions'
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.

STATEC BINDER Maschinen-Übersicht — vier Produktkategorie-Cards vor einem Fabrikbild
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.

STATEC BINDER Produktdetail — Galerie-Thumbnails über einer Optionen-vs-Vorteile-Vergleichsdarstellung
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.

Die vier Kacheln 'Was möchten Sie tun?' — Unverbindlich anfragen, Ansprechpartner kontaktieren, Infomaterial anfordern, Service & Ersatzteile anfordern
Vier Lead-Intents, vier HeyFlow-Pfade — jeder zum richtigen Team geroutet
STATEC BINDER Kontaktseite — Intent-Kacheln über der Adress-Card mit eingebetteter Gleisdorfer Karte
Kontaktseite — 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.

Lass uns reden