Relaunch-Konzept · Vertraulich
Wie wir kroll-fahrzeugbau.com neu denken — von Drupal 7 auf ein token-basiertes Design-System und Drupal 11. Klarer geführt, eigenständiger im Auftritt, zukunftssicher im Fundament.
01 — Ausgangslage
Seit 2015 läuft kroll-fahrzeugbau.com stabil auf Drupal 7. Elf Jahre Betrieb sind ein Beleg für Solidität — und zugleich das Signal, dass es Zeit ist. Drupal 7 hat das Ende seines Lebenszyklus erreicht: keine Sicherheits-Updates, kein direkter Upgrade-Pfad, wachsender Wartungsaufwand. Die Marke KROLL ist stark, die Inhalte sind es auch. Was fehlt, ist ein Auftritt, der beides auf der Höhe der Zeit trägt.
Wir behandeln den Relaunch nicht als Reparatur, sondern als Chance: kein Alt-Ballast, sondern ein sauberes Fundament — von der ersten Zeile an.
02 — Leitidee
Der Kern des Konzepts ist eine gestalterische Disziplin. Die alte Seite setzt Rot großflächig ein — vollrote Blöcke, rot-weißes Flatterband. Rot verliert dadurch seine Signalwirkung und wirkt schnell billig. Wir drehen das um: Anthrazit ist die tragende, wertig-industrielle Fläche. Rot ist konsequent reserviert für genau zwei Dinge — die Marke und die Handlungsaufforderung.
Rot als Fläche — das Signal verpufft.
AktionAktionAnthrazit trägt, ein Rot führt das Auge.
Anfrage startenMehr erfahrenRot ausschließlich für Marke und Handlungsaufforderung — sonst trägt Anthrazit.
Genau eine Primäraktion pro Sichtbereich führt das Auge, statt es zu zerstreuen.
Radius 0 über alle Bausteine — industrielle Formsprache mit Rothenberger-Nähe.
Farbe, Abstand, Kante aus einer Quelle — konsistent über die ganze Seite.
03 — Denken in Problemen & Lösungen
Jede Entscheidung im neuen Konzept beantwortet ein konkretes Problem der Bestandsseite. Links der Ist-Zustand, rechts unsere Antwort.
Verschachtelte Menüs mit kryptischen URLs (/de/content/concept-kroll-…). Wer ein passendes Fahrzeug sucht, muss sich durchklicken statt zu finden.
Kanalreinigung · Nassabfallentsorgung · Tankreinigung — das ganze Portfolio auf einen Blick, plus Filter-Chips nach Einsatzbereich. B2B-Einkäufer denken in Anwendungsfällen, nicht in Modellnamen.
Vollrote Flächen und Diagonal-Flatterband. Die wichtigste Farbe der Marke nutzt sich ab, der Auftritt wirkt unruhig.
Anthrazit als Bühne, Rot nur für Marke und CTA. Ein hell/dunkel-Rhythmus gibt der Seite einen ruhigen, wertigen Takt — und jeder rote Akzent zählt wieder.
Der Nutzer wird nicht geführt. Es ist unklar, was der nächste Schritt sein soll — Produkte ansehen? Kontakt aufnehmen?
Genau ein roter Button je Abschnitt. Die zwei Geschäftsziele — Produkte entdecken und Vertrieb kontaktieren — sind mehrfach verankert: Navigation, Mega-Menü, Quick-Tiles, eigene Sektionen.
Keine Sicherheits-Updates mehr, kein Upgrade-Pfad, steigender Pflegeaufwand. Technisches Risiko wächst mit jedem Monat.
Token-basiert und komponentenorientiert auf einem modernen Bootstrap-5-Fundament. Kein geerbter Alt-Code — ein System, das die nächsten Jahre trägt.
Die Zugehörigkeit zu Rothenberger überlagert die eigene Identität. KROLL tritt nicht als das auf, was es ist: eine eigenständige, starke Marke.
Wir haben beide Seiten analysiert und daraus ein eigenes Design-System gebaut. Anthrazit, eckige Form und einzelne bewusst übernommene Module erzeugen die Nähe zu Rothenberger — eigenes KROLL-Rot und Nutzfahrzeug-Bildsprache halten die Marke eigenständig.
04 — Wie wir den Nutzer führen
Die Startseite ist als durchgängige Dramaturgie gebaut. Jeder Abschnitt hat einen Job — und übergibt sauber an den nächsten. Zwei Zielgruppen laufen parallel: der technische Käufer, der Daten scannt, und der Entscheider, der von Menschen kauft.
Sprache (DE/EN/PL) und ein vorgesehener Einstieg mit Schloss-Icon für den geplanten Kunden- & Servicepartner-Bereich (siehe Ausblick) — der wichtigste wiederkehrende Weg ist oben bereits angelegt.
„Fahrzeugtechnik für eine Umwelt mit Zukunft.“ Links die Aussage, zwei Pfade — „Fahrzeuge entdecken“ (primär) und „Vertrieb kontaktieren“ (sekundär). Das Medium läuft vollflächig nach rechts aus, ideal für ein stummes Ambient-Video.
Produkte · Vertrieb · Service als rotes Kachelband direkt unter dem Hero — maximale Aufmerksamkeit für die wichtigsten Wege, ein kräftiger Marken-Akzent gleich oben.
Filter-Chips nach echter Taxonomie, Karten mit Kategorie-Tag, ADR-Kennzeichnung, Kurz-Spezifikation und „Datenblatt →“. Der PDF-Download ist im Fahrzeugbau ein starkes Kaufsignal.
Baukasten · Maßanfertigung · niedrige Life Cycle Costs — plus die Leitdevise als Pull-Quote. Vollflächig anthrazit, damit es als Statement wirkt.
Links die drei Vertriebswege plus Partner-Finder (PLZ/Land). Rechts eine sticky Kontakt-Karte mit echter Person, Telefon, Mail und rotem „Anfrage starten“. Im B2B kauft man von Menschen.
„Wir sind da, wenn Sie uns brauchen.“ Ein roter Reassurance-Block kurz vor dem Footer — 24-Stunden-Notruf, mobiler Einsatz, Ersatzteile — genau dort, wo der Nutzer den Langzeit-Partner abwägt.
Vier Spalten plus Rechtliches, die Sub-Brand-Marker KROLL / HELLMERS und ein zweiter Einstieg zum geplanten Kundenbereich.
05 — Das Design-System
Wir liefern keine Sammlung von Seiten, sondern ein Regelwerk. Jeder Farbwert, jeder Abstand, jede Kante ist ein Token — die einzige Quelle der Wahrheit. Ein späterer Feinschliff an Farbe oder Schrift ist ein Eingriff an genau einer Stelle, nicht an hundert.
KROLL-Rot #E30613 authentisch aus dem Vektor-Logo. Für Text auf Weiß das barrierefreie #C00510. Anthrazit #21272A trägt die Flächen — an Rothenberger angelehnt, aber nicht das harte Logo-Schwarz. Kontraste erfüllen WCAG-AA.
Vier freie OFL-Schriften — keine Lizenzkosten, keine Rechtefragen.
Radius 0 über alle Bausteine. Die eckige Formensprache unterstreicht den industriellen, präzisen Charakter — und ist die zweite klare Parallele zur Rothenberger-CI. Full-Bleed-Bänder mit geboxtem Inhalt (~1180px) verbinden Flächenwirkung mit Lesbarkeit.
Jeder Baustein ist eine wiederverwendbare Komponente mit typisierten Eigenschaften. Styleguide und CMS teilen sich eine Definition — kein Auseinanderdriften von Design und Umsetzung.
06 — Markenarchitektur
Kein „by Rothenberger“. Wir haben beide Auftritte — KROLL und Rothenberger — analysiert und daraus ein eigenständiges Design-System entwickelt. Die Verwandtschaft entsteht über einzelne, bewusst übernommene Design-Module: vollflächige Farb-Bänder, eckige Formensprache, Anthrazit als Bühne — nicht über eine übergestülpte Marke. Eigenes KROLL-Rot und die Nutzfahrzeug-Bildsprache halten die Marke klar eigenständig. Die Sub-Brand HELLMERS ist im System bereits mitgedacht.
07 — Das Fundament
Der Wechsel von Drupal 7 auf 11 ist eine Neuimplementierung mit Daten-Migration — kein In-Place-Update. Genau das ist die Chance: Wir erben keine Alt-Architektur, sondern bauen das System von Beginn an sauber.
Aktuelle, langfristig gepflegte Basis mit Single Directory Components im Core. Redaktionell komfortabel, technisch zukunftssicher.
Ein Bootstrap-5-Sub-Theme (Radix) mit nativer Komponenten-Unterstützung. Native Elemente erben automatisch die KROLL-CI.
KROLL-Tokens werden auf Bootstrap-Variablen gemappt. Eine Wertänderung wirkt überall — im Theme, in Datenblättern, in einer zweiten Sub-Brand.
Bestehende Inhalte und Struktur werden in das neue, saubere Content-Modell überführt — inklusive der realen Fahrzeug-Taxonomie mit 11 Aufbautypen.
Off-Canvas-Navigation, Fullscreen-Overlay-Menü, touch- und tastaturtauglich. Der Desktop-Auftritt steht — der mobile ist vollständig durchgearbeitet.
Neue Bereiche und Funktionen wachsen aus vorhandenen Komponenten — ohne Neubau. Ein geschützter Kunden- & Partnerbereich etwa lässt sich später als eigenes Modul andocken (siehe Ausblick).
08 — Interaktive Ebenen
Drei Dinge suchen Besucher konkret: die nächste Servicestation, den richtigen Ansprechpartner und das passende Fahrzeug. Für jedes bauen wir eine eigene, datengetriebene Ebene — im Prototyp bereits funktionsfähig, in Drupal 1:1 über Views und die Standort- und Personen-Entitäten abgebildet.
GIS-Ebene: Leaflet-Karte mit heller CARTO-„Positron“-Kachel und roten, eckigen, nummerierten Markern. Karte und Liste sind gekoppelt — ein Klick auf den Marker hebt die Station hervor, ein Klick in der Liste zoomt auf die Karte. Datenbasis in Drupal: Geofield (Koordinaten automatisch per Geocoder aus der Adresse) und eine Leaflet-View — DSGVO-konform mit Consent-gesteuertem Nachladen der Kacheln.
Vertrieb Innendienst
Bereichs-Chips plus Freitextsuche. Jede Person ist eine eigene Entität — einmal pflegen, überall aktuell (Produktseite, Service, Standort). Foto oder Monogramm-Avatar als Fallback, roter Gebiets-Badge.
Wasserrückgewinnung · Ø 2.400 mm · Simultan
Filter-Chips nach echter Taxonomie (11 Aufbautypen in 3 Bereichen). Jede Karte trägt Kategorie-Tag, ADR-Kennzeichnung, Kurz-Spezifikation und „Datenblatt →“ als Mikro-Conversion.
09 — Zum Anfassen
Dieses Dokument beschreibt das Denken. Die folgenden Seiten zeigen es in Funktion — das vollständige Design-System und die interaktiven Prototyp-Seiten mit echtem Wording und realer Fahrzeug-Struktur.
10 — Ausblick · Ausbaustufe 2
Eine schöne Website? Ist erst der Anfang. Weil das neue Fundament modular angelegt ist, trägt es weit mehr als Startseite und Portfolio. Digitalisierung, die wir mit euch Schritt für Schritt gehen — jede Ausbaustufe für sich planbar. Und der naheliegendste erste Schritt liegt heute schon im Fahrzeug: auf einem USB-Stick, den keiner mehr liest.
Und wohin die Reise weitergeht
Getrennte Zugänge für Bestandskunden und Servicepartner — jede Rolle sieht genau das Ihre.
Alle Unterlagen je Fahrzeug an einem Ort: Datenblätter, Prüfprotokolle, Historie.
Datenblätter und Service-Unterlagen hinter Login — statt öffentlich verstreut.
Ersatzteil-Anfrage und Service-Kontakt direkt aus der Fahrzeugakte heraus.
Digitalisierung mitgedacht — kein Bestandteil des aktuellen Relaunch-Umfangs.
Eigene Ausbaustufe, die wir euch separat vorstellen und kalkulieren.