Sujet 30 Jahre FUNchestra

FUNchestra©

02Band2026

Kunde
FUNchestra
Plattform
Next

Der erste Eindruck

Ganz oben läuft ein durchlaufendes Laufband – ein kleiner, aber wirksamer Kniff, der sofort Energie und Live-Charakter vermittelt, noch bevor man überhaupt scrollt. Direkt darunter der große Claim über einer Bildcollage aus 30 Jahren Bandgeschichte. Das signalisiert: hier geht's um eine Band mit langer Geschichte, nicht um ein neues Projekt.

Aufbau

Die Seite ist als durchgehende „Erlebnis-Erzählung" aufgebaut, nicht als klassische Unterseiten-Navigation:

About – ein längerer, in mehrere Abschnitte gegliederter Text über die Band, jeweils mit einem großformatigen Konzertfoto dazwischen, das beim Scrollen sanft einblendet

Media – ein Tab-Bereich mit drei Reitern: Audio-Mitschnitte, YouTube-Videos (die erst nach Klick nachladen, um die Seite schnell zu halten) und Fotogalerien vergangener Konzerte

Besetzung – eine Foto-Kachel für jedes der zwölf Bandmitglieder mit Instrument und Social-Media-Links, dazwischen dunkle Hintergrundbilder mit Parallax-Effekt (die sich beim Scrollen langsamer bewegen als der Rest – erzeugt Tiefe)

Termine – als fixer Programmpunkt vorgesehen

Sign-Up – ein eingebettetes Newsletter-Formular für Terminbenachrichtigungen

Blog – ältere Beiträge aus der Bandgeschichte als Rückblick

Das Ganze liest sich wie ein langes, bebildertes Konzerterlebnis zum Durchscrollen – passend zu einer Live-Band, die von Atmosphäre lebt.

Design-Sprache

Dunkel, konzertartig, fotolastig – viel Bühnenlicht, Publikum, Nahaufnahmen der Musiker. Die Parallax-Hintergründe und sanften Einblendungen beim Scrollen (wieder dank Motion) geben ein Gefühl von Live-Atmosphäre, fast wie ein kurzer Konzertmitschnitt in Textform.

  • FUNchestra Stadttheater 2025
  • Jürgen Steiner am Keyboard

Die Technik, einfach erklärt

Next.js + React sorgt für schnelles Laden und ein App-artiges Klickgefühl beim Wechseln zwischen Audio-, Video- und Foto-Reiter.

Tailwind hält Abstände, Farben und Typografie über die vielen unterschiedlichen Bausteine (Bandmitglieder-Kacheln, Blog, Tabs) hinweg einheitlich.

Motion ist für genau diese Parallax- und Einblend-Effekte beim Scrollen zuständig, die der Seite ihre „Live-Atmosphäre" geben.

Ein besonderes Schmankerl ist der simulierte Plattenspieler beim Abspielen von MP3s

Kurz zusammengefasst:

eine stimmungsvolle, foto- und mediengetriebene Band-Website, die Bühnenenergie ins Digitale überträgt.

Weitere Projekte

Projekt starten

Ich freue mich über deine Nachricht und dich kennenzulernen.

PWPeter WindholzNET3

Ich antworte in der Regel innerhalb von 24 Stunden.