FallstudieLive seit Juni 2026

Alleman An Bord:
Team-Website mit
Racing-DNA

Sim-Racing-Teams brauchen eine professionelle Präsenz um Sponsoren zu überzeugen. Generische Templates transportieren keine Racing-Atmosphäre. Das Ergebnis hier: eine Custom-Site die in den ersten drei Sekunden klar macht, mit wem man es zu tun hat.

Next.js 16Tailwind v4Bebas NeueFramer MotionDocker
Live-Site öffnen
2 Tage
Redesign
10
Farb-Tokens
100
LH Score
Statische Seiten
SHA-256
Members Area
Das Problem

Generische Templates überzeugen keine Sponsoren

Die meisten Sim-Racing-Team-Sites sehen gleich aus: Esports-Neonfarben, Scanline-Overlays, Stock-Car-Fotos von irgendwo. Das Ergebnis ist eine Website die Masse transportiert statt Identität. Sponsoren springen ab. Die eigene Crew findet sich nicht darin wieder.

Alleman An Bord brauchte das Gegenteil: eine Präsenz die den Charakter des Teams widerspiegelt, bevor ein Besucher ein einziges Wort liest. Keine SaaS-Landing-Page-Struktur, keine Stock-Photos, kein RGB-Gamer-Ästhetik.

Das Ziel: Eine Website die Schweizer Präzision und Motorsport-Leidenschaft verbindet. Professional genug für Sponsoren, authentisch genug für die Crew. Mit einem geschützten Members-Bereich für interne Setup-Daten und Strategie-Dokumente.

Design-System

10 Tokens. Zwei Schriften. Null Kompromisse.

void
#05080F
Page background
surface
#0D1520
Card backgrounds
gold
#C5A059
Primary accent
gold-bright
#D4AF37
Hover on gold
snow
#F8FAFC
Primary text
fog
#94A3B8
Secondary text
1

Das Auto verdient seinen Platz

Die Gold-Livery ist das stärkste Marken-Asset. Sie wird als primäres Visual gezeigt, nicht als Hintergrundtextur.

2

Gold ist ein Material

Kein Highlight-Farbe. Wenn Gold erscheint, soll es schwer und warm wirken, sparsam eingesetzt auf 8–12% des Screens.

3

Editoriales Selbstbewusstsein

Text atmet. Headers fühlen sich wie ein Magazin-Cover an, nicht wie ein Slide-Deck. Bebas Neue auf clamp(5rem, 12vw, 10rem) im Hero.

4

Geschwindigkeit durch Einfachheit

Weniger, grösser, mutiger. Alles was keine Bedeutung trägt wird entfernt. Kein RGB-Gamer-Ästhetik, keine SaaS-Metrik-Cards.

ALLEMAN AN BORD
Bebas Neue · Hero-Headline · clamp(5rem, 12vw, 10rem)
Architektur

Public Presence. Private Garage.

Public Site

  • Next.js 16 App Router, statisch gerendert
  • Hero-Section mit Livery als primärem Asset
  • Driver-Profile, Race Results, Team-Story
  • Framer Motion Einblendungen (expo-out)

Members Area

  • SHA-256 Cookie-Auth, kein Drittsystem
  • Setup-Daten, Race-Strategie, Dokumente
  • Middleware-geschützt auf /members/*
  • Utilitarian UI, kein Design-Overhead

Design-System

  • 10 Farb-Tokens: void → gold → snow
  • Zwei Schriften: Bebas Neue + Geist
  • Expo-out Easing, 300ms / 500ms
  • Glassmorphism: max. 1× pro Seite

Zielgruppe

  • Sim Racing Enthusiasten (iRacing, LMU)
  • Potenzielle Team-Sponsoren
  • Bestehende Crew-Mitglieder
  • Desktop-first (post-race browsing)

Public

Team-Story, Fahrer-Profile, Race Results. Offen für Sponsoren und Fans.

Members

Setup-Daten, Race-Strategie, Dokumente. SHA-256 Cookie, kein externer Auth-Dienst.

Das Ergebnis

Sponsoren-ready in 2 Tagen

Die Site lebt vom Kontrast: Deep-void Hintergrund, sparsam eingesetztes Gold, Bebas Neue als editorial-starke Schrift. Wer die Seite öffnet, weiss in drei Sekunden womit er es zu tun hat, noch bevor er zu scrollen beginnt.

Der Members-Bereich erfüllt seinen Zweck ohne Design-Overhead: einfach, fokussiert, vollständig Middleware-geschützt. Setup-Daten, Race-Strategien und Dokumente bleiben intern. Kein externer Auth-Dienst, keine Account-Verwaltung.

2 Tage
Build-Zeit
Komplettes Redesign inklusive Design-System
Zero-Trust
Auth
SHA-256 Cookie, kein Account, kein Drittanbieter
100
LH Performance
Statisch gerendert, minimales JS, sofort ladend