Am vergangenen Wochenende habe ich in einer vierstündigen Session ein Konzept für eine Café Webseite entworfen und programmiert. Als Besitzer einer Rocket Appartamento ist das Thema Kaffee für mich eine echte Leidenschaft. Diese Begeisterung für Qualität und Ästhetik wollte ich schon länger in ein digitales Projekt fließen lassen.
Die Inspiration lieferte ein lokales Café in Köln. Deren aktueller Webauftritt schöpft das Potenzial des Konzepts meiner Meinung nach nicht ganz aus. Für mein Redesign habe ich mich für eine performante Architektur entschieden. Als Basis dienen Next.js für optimale Ladezeiten sowie Payload CMS für eine spätere, flexible Content Integration. Das Deployment läuft auf einem eigenen Server und die gesamte Infrastruktur wird mit Grünstrom betrieben.
Eine Webseite muss auf den ersten Blick überzeugen. Daher habe ich eine kreative Hero Section entworfen: Ein Video eines Siebträgers und einer Espressotasse mit transparentem Hintergrund.
Das Basismaterial wurde mit Veo 3.1 generiert und durch ein weiteres KI Tool freigestellt. Die Nutzung von KI war hierbei allerdings keine große Hürde. Die eigentliche technische Herausforderung bestand darin, das Video für alle Endgeräte zu optimieren. Um das transparente Video auch auf nativen iOS Browsern wie Safari lauffähig zu machen, musste es in das HEVC Format konvertiert werden. Nach einigen Versuchen mit FFmpeg ließ sich das umsetzen. Der Prozess gestaltete sich anfangs komplex, da für diesen spezifischen Workflow zwingend eine Apple kompatible Umgebung erforderlich ist, um die entsprechende Library nutzen zu können.
Das restliche Interface entstand in einem iterativen Prozess mit Cursor und Claude Opus. Das Ziel war ein sauberes und fokussiertes Design.
Bei diesem Projekt handelt es sich um eine Designstudie. Der Name ist vom echten Café inspiriert, dient hier aber nur zur Veranschaulichung des Konzepts. Passend dazu habe ich die Domain brunchy.cafe registriert, da diese Top Level Domain deutlich eleganter und moderner wirkt als gängige Alternativen. Ich habe die Inhaber des Kölner Cafés bereits kontaktiert. Da es mir bei diesem Projekt primär um die technische Umsetzung ging, bin ich selbstverständlich bereit, die Domain bei Interesse an die Betreiber abzugeben.