41 lines
2.9 KiB
Markdown
41 lines
2.9 KiB
Markdown
# 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.
|