OCB Deutschland
Zahlen die Spaß machen
OCB ist eine der bekanntesten Marken für Drehpapier, mit rund 20 Produktfamilien vom klassischen Blättchen bis zum Zubehör. Für den deutschen Markt haben wir die Website komplett neu in Webflow gebaut. Die Basis ist ein Komponenten-System: Header, Produktkarten, Eyebrows, Slider und Footer werden einmal gepflegt und wirken auf der ganzen Seite. Farben, Abstände und Schriften laufen über Webflow-Variablen, jede Produktlinie bekommt so ihre eigene Farbwelt, ohne dass ein einziges Template doppelt existiert. Die Produktübersicht lässt sich nach Shortpapes, Longpapes, Filtern, Filterhülsen und Zubehör filtern. Für die Academy haben wir ein dynamisches Video-Mockup entwickelt: Das Video läuft in einer Hand, auf der sich ein Ranken-Tattoo animiert aufbaut, Hoch- oder Querformat erkennt das Script selbst. Instagram-Feed und YouTube-Videos laden erst nach Einwilligung im Cookie-Banner, vor dem ersten Besuch steht eine Altersabfrage. Stellenanzeigen kommen aus dem CMS, Bewerbungen mit Unterlagen direkt über die Website.
Leistungen
Website-Relaunch
Komponenten-System
Variablen & Farbwelten
Filterbare Produktübersicht
Video-Mockup mit Tattoo-Animation
Social-Media-Integration
Altersabfrage & Consent
Recruiting mit Bewerbungsupload
System
Webflow
Webflow CMS
Cookiebot
Splide
Mittwald
Lottie
Design
Jede Produktfamilie, jede Wortmarke, jedes Template wurde zuerst in Figma gestaltet und dann eins zu eins in Webflow-Komponenten übersetzt. Ein Blick aufs Board.
Auf einen Blick
Rund 20 Produktfamilien, von Blue über Premium bis Organic Hemp, jede mit eigener Farbe und eigener Seite. Alles kommt aus einer CMS-Collection, die Farbe steuert eine Variable. Neue Sorten legt das Team ohne Entwickler an.
Styleguide
Logo, Schriften und die Farben der Produktlinien bringt OCB mit. Daraus haben wir die Bausteine der Website gebaut. Unten siehst du das System im Einsatz.
.svg){kind=logo}
Mobile First Ansatz!
OCB lebt auf Instagram und TikTok, viele Besucher kommen also direkt vom Smartphone. Menü, Produktfamilien und Produktübersicht wurden deshalb zuerst für kleine Bildschirme gebaut und erst danach für den Desktop.
Filter
Manche wissen genau, welches Format sie drehen. Andere kennen nur ihre Lieblingslinie. Die Produktübersicht bedient beide, mit Filtern nach Kategorie und Seiten pro Produktfamilie.
Shortpapes, Longpapes, Drehfilter, Aktivkohlefilter, Filterhülsen, Zubehör: Ein Klick, und die Übersicht zeigt nur noch das passende Format.
Jede Linie hat ihre eigene Seite mit Farbwelt, Merkmalen und allen Varianten. Die Produktkarten kommen aus derselben Collection wie die Übersicht.
Für Marken gebaut
Markenwebsites scheitern selten am Design. Sie scheitern daran, dass das Team sie nach dem Launch nicht selbst weiterbauen kann. Bei OCB steckt das System unter der Oberfläche.
~20
Produktfamilien im CMS
1918
Markengeschichte seit
18+
Altersabfrage vor dem ersten Besuch
1
Template für alle Produktlinien
01
Header, Produktkarten, Eyebrows, Slider und Footer sind Webflow-Komponenten. Eine Änderung an einer Stelle wirkt auf der ganzen Seite.
02
Farben, Abstände und Typo laufen über Webflow-Variablen. Jede Produktlinie bekommt ihre Farbe als eigenen Wert, eine neue Linie ist in Minuten angelegt.
03
Das ganze Sortiment auf einer Seite, gefiltert nach Shortpapes, Longpapes, Filtern, Hülsen, Zubehör und Limited Editions.
04
Academy-Videos laufen in einer Hand, auf der sich ein Ranken-Tattoo animiert aufbaut. Hoch- oder Querformat erkennt das Script selbst, gepflegt wird nur eine URL im Text.
05
Instagram-Feed und YouTube-Videos sind eingebunden und laden erst nach Einwilligung im Cookie-Banner. Bis dahin steht ein Hinweis mit Link zu den Einstellungen.
06
Vor dem ersten Besuch wird das Alter abgefragt. Stellenanzeigen kommen aus dem CMS, Bewerbungen mit Unterlagen gehen direkt über die Website ein.
Look at these projects!
Hier findest du einen Auszug aus unseren Projekten. Vielleicht findest du hier ja bald auch dein Projekt!?
Mit Vollspeed zum Webauftritt in 3 Wochen – pünktlich zur Weltpremiere in Abu Dhabi.
Website Relaunch | 3D Rendering
Für den Fahrzeugveredeler HOF Manufaktur aus Sindelfingen haben wir einen unvergleichlichen Webauftritt geschaffen, der die Exklusivität der Marke widerspiegelt. Mit der stärksten G-Klasse der Welt mit 1065 PS, hat sich HOF international einen Namen gemacht und begeistert Kunden auf der ganzen Welt. Der neue Online-Auftritt wurde in nur drei Wochen realisiert und setzt neue Maßstäbe in Design und Inszenierung.
Einer der beliebtesten Marken für Drehpapier weltweit und steht seit Jahrzehnten für Qualität, Tradition und ein authentisches Raucherlebnis.
Website Relaunch
Für die Premium-Brand OCB haben wir einen modernen Webauftritt entwickelt, der die Identität der Marke digital erlebbar macht. Im Fokus stand eine klare, hochwertige Inszenierung der Produkte kombiniert mit einer starken visuellen Sprache und performanter User Experience. Durch gezielte Animationen, dynamische Übergänge und ein responsives Design entstand eine Plattform, die die Markenwelt von OCB authentisch transportiert und Nutzer auf jedem Endgerät überzeugt.
Detailiertes Beratungsgespräch
Analyse des aktuellen Standes
Unverbindliches Angebot
Daniel Rothmund
Ansprechpartner
Teckstraße 66
70190 Stuttgart
Made with love by Hochkonzept.
© Hochkonzept 2026 |Gegründet 2017 | Hochkonzept die Agentur für modernes Webdesign und Sichtbarkeit im Internet.
