Flex Fiesta 2027
One day, eleven bands, one website.
I built a website for the Flex Fiesta 2027 festival, which was hard to find online. It's an unofficial showcase of the event, included in my portfolio with the organizers' permission.
My portfolio was missing a project about an event where motion and typography play the lead. So I made a poster in the browser: a giant headline, an interactive ASCII circle pit in the hero, a countdown to the club's doors opening and a line-up that slams onto the screen as you scroll. All of that motion can be switched off, and the site still works, with tickets one click away.
- Role
- Design and build
- Time
- One day
- Tools
- Astro, GSAP, Lenis, Vercel
- Status
- Personal project, with the organizers' permission flex-fiesta-concept.vercel.app
Starting point
I started with a gap, not with an effect.
Flex Fiesta is a beatdown hardcore festival at Cross Club in Prague, on Saturday, May 22, 2027: eleven bands and one room. The organizers, the PRGBD crew, sold tickets through GoOut and their own shop, and posted announcements on Instagram and Facebook. The festival had no website: flexfiesta.com is a parked domain, and prgbd.com is a shop.
GoOut and their own shop
A Czech ticketing platform and the organizers' shop, PRGBD Store.
Instagram and Facebook
Announcements on the @nfnc_beatdown and /nfncbeatdown profiles.
I chose the event against four criteria:
- 01
A real edition between November 2026 and September 2027.
- 02
No website of its own.
- 03
A niche.
- 04
Public contact details for the organizers.
At first, the first criterion was “a weak website”.
I dropped it after looking at the candidates in the browser: they had fresh, good websites, so judging from a description alone had been off the mark. What was left were events that simply lack a website, and Flex Fiesta was one of them.
Direction
I took the look from the scene, not from event websites.
Beatdown is hardcore at its heaviest: slow, crushing, built on the breakdown. That's why I didn't look for a model among pretty event websites. In the moodboard I chose the “Brutal Poster” direction: heavy, raw, poster-like, like the scene itself.
-
01
Color
Acid yellow
#e6ff00on black#0a0a0agives maximum contrast. -
02
Typefaces
Anton, a narrow, heavy poster face, carries the headings. Space Mono turns the text into a flyer or a terminal and provides the characters for the ASCII. I host both typefaces locally.
-
03
No sound, no photos in the hero
I left out sound so the site wouldn't take anyone by surprise, and photos in the hero, because the ASCII replaces them.
-
04
Signature moments
At first I chose two: the countdown and the line-up slam. In the second round I added the ASCII pit in the hero and a rotating 3D tower in the venue section. Typography and ASCII are the visual language of the whole site.
Motion and weight
Heavy graphics, light website.
The hero is a single WebGL shader: a ring of characters spins around an empty center like a circle pit, a click sends out a shockwave, and the cursor pushes the crowd away. The tower in the “Den akce” (event day) section is a second scene in the shader, rotated by dragging with a mouse or a finger. The site builds the characters for both scenes on the fly from a Space Mono atlas.
ASCII circle pit
Slam and a band photo
A tower you turn with a finger
I wanted all that weight not to cost usability.
- 01
One animation clock drives the scrolling and all the effects, instead of several competing with each other.
- 02
prefers-reduced-motionturns off decorative motion. Scrolling becomes native, the text stays still, the countdown keeps running because it's content, and the ticket buttons are always within reach. - 03
The directions map is a static SVG built by a script from OpenStreetMap data, with no external tiles to load.
- 04
The site has no trackers and no forms.
- First screen
- 190 KB
- The document, the script and six font files, compressed.
- Script
- 151 KB
- Uncompressed. Compressed, 58 KB goes over the wire.
- With photos
- 1.2 MB
- Eight band photos load in the background, when the browser is idle.
- Trackers and forms
- 0
- The site collects nothing about its visitors.
I measured the weight of the live site on October 14, 2026, on a first visit, with no browser cache.
The same site without motion
This is what the whole site looks like when the system asks for reduced motion. Scroll the frame: all the content is there, the countdown shows the number of days, and the ticket buttons are where they always are.
Enlarge frame
I used AI as a tool, not an oracle.
I wrote the code with the help of Claude Code: Astro, the shaders, the translation dictionary. The choice of event, the criteria, the visual direction, the signature moments, the rules toward the organizers and the review of every version in the browser were mine. After the first launch, I came back once more with mobile fixes.
Tickets and consent
Tickets by link, not by sale.
There are two official places to buy: GoOut (925 CZK) and the organizers' shop, PRGBD Store (€35). The site shows both, explains the difference and sells nothing itself. Every button opens the seller in a new tab.
That follows from the project's status. The organizers don't update this site, so I marked the prices, line-up and dates “as of October 13, 2026”, with a note that the seller's information always takes precedence.
Result
What works, and what I haven't checked.
The site is live at
flex-fiesta-concept.vercel.app,
in Czech at / and in English at /en/. I checked it at widths of 1440 and
390 px: no horizontal scrolling and no console errors.
The Czech copy hasn't been proofread by a native speaker, and Czech isn't my language. I also have no outcome I could call a result: the site has no traffic to measure, because it's deliberately not indexed, and nobody maintains it. The evidence is the craft and the organizers' permission.
Takeaway
Look first, judge second.
My first criterion for choosing the event only fell apart in the browser, because from a description every website looked worse than it was.
An effect doesn't have to cost usability. The site has heavy graphics, yet the first screen weighs about 190 KB, the motion can be switched off, and tickets are always within reach.
A project without a brief needs rules agreed up front. I showed the finished result,
named its status, limited the risk for the other side (noindex, takedown on request)
and asked for one thing. The reply came within a day.