2.9 KiB
Website Konzept: E-TIB Rework
1. Executive Summary
Das Zielprojekt umfasst einen vollständigen, top-modernen Rework der digitalen Präsenz der E-TIB Gruppe. Weg von den statischen HTML-Strukturen der Legacy-Website (siehe ./legacy), hin zu einer hochperformanten, dynamisch generierten Next.js-Plattform. Die Plattform fungiert als zentraler, professioneller Ankerpunkt für die gesamte Unternehmensgruppe und unterstreicht die Marktführerschaft im Bereich Kabeltiefbau und Leitungsbau.
2. Design- und Interaktionsphilosophie
- Premium Industrial Aesthetic: Ein minimalistisches, aber hochqualitatives Design-Paradigma. Keine überladenen Animationen, stattdessen flüssige Micro-Interactions, Glassmorphismus-Akkzente und ein extrem aufgeräumtes Grid.
- Top Moderne UX: Fullbleed-Sektionen, Cinematic Video Heros (Referenz: schleicher-gruppe.de) und 3D-Bento-Grids für die Leistungsübersicht.
- Responsives Höchstmaß: Von extremen Widescreens bis zum Smartphone flüssig skalierend, verankert durch die detaillierten Breakpoints aus dem Mintel Design System.
3. Architektur
- Frontend Core: Next.js (App Router, React 19), vollständig in TypeScript.
- Content Management: Headless Payload CMS v3 (PostgreSQL-basiert) für alle dynamischen Inhalte, Karriereseiten und Timeline-Verwaltung.
- Styling: TailwindCSS v4 mit den Mintel-Standardpaketen (
@mintel/ui). - Infrastruktur: Vollständige Dockerisierung (App, DB, Redis, Qdrant, Gatekeeper-Authentifizierung, Traefik Reverse-Proxy).
4. Kernbereiche & Navigation
Die Navigation ist "Industrial Grade" gehalten: Ein durchgehend präsenter Header ("Floating Logo & Hero Clearance").
Startseite
- Aufhänger: "DIE EXPERTEN FÜR KABELTIEFBAU …"
- Ein einnehmender "Hero Video" Bereich im Hintergrund.
- Sub-Company-Hub: 4 zentrale Kacheln als Einstieg zu den jeweiligen Bereichen:
- E‑TIB GmbH – Ausführung elektrischer Infrastrukturprojekte
- E‑TIB Bohrtechnik GmbH – Präzise Horizontalbohrungen
- E‑TIB Verwaltung GmbH – Zentrale Dienste, Einkauf, Finanzen
- E‑TIB Ingenieurgesellschaft mbH – Planung, Projektierung, Dokumentation
- Slider/Grid für Referenzen und Kompetenzen.
Kompetenzen
High-Fidelity "Bento Grid" Darstellungen aller 10 Kernkompetenzen, von einfachen Kabelpflugarbeiten über Komplexe Querung bis zur Vermessung & Dokumentation.
Über uns (Timeline)
Eine visuell ansprechende Meilenstein-Komponente (scroll-animiert), welche die Gründung der verschiedenen Gesellschaften zwischen 2015 und heute erzählt.
Karriere & Messen
Ein Bereich für offene Vakanzen, gesteuert über das Payload CMS, gepaart mit den kommenden Messepräsenzen (z. B. Intersolar München, Windenergietage Linstow).
Kontakt
Ein dynamisches Leaflet-Kartenmodul mit Payload-gepflegten Ansprechpartnern, gesichert durch das @mintel/mail Framework für interaktive Formular-Beteiligung.