← From Concept to Experience

04 · Brand system · Digital experience

Lumen Stage

A responsive editorial festival experience that builds from quiet anticipation through Neon Current to the Lumen Finale.

Narrative pacingResponsive editorial gridControlled color
Hybrid Figma-to-code websiteOpen websiteOriginal concept ↗
Lumen Stage festival landing page without portfolio controls

Challenge

Create a festival identity energetic enough for promotion and structured enough to support schedules, stages, and practical event information.

Approach

The approved four-stop gradient and alternating editorial grid now support responsive navigation, accessible sequencing, and restrained interaction.

Outcome

A working responsive festival site that preserves the Figma narrative while adapting its hierarchy and controlled chaos to real browser behavior.

Experience architecture

Three days. One controlled crescendo.

The coded experience turns the original still composition into a paced editorial scroll.

Opening Pulse festival scene

Day One · Anticipation

Opening Pulse

A quiet stage and visible rigging establish scale before the audience arrives.

Neon Current festival scene

Day Two · Climax

Neon Current

The darkest background and largest type turn the central performance into the visual peak.

Lumen Finale festival scene

Day Three · Afterglow

Lumen Finale

Daylight and open space release the tension without breaking the visual system.

Responsive system

Alternation creates energy without adding noise.

40 / 60 gridMobile reflowClear hierarchyReduced motion
Full Lumen Stage page sequence

Color as narrative

The gradient carries the emotional timeline.

Anticipation#475C61 · 0%
Momentum#3A4A50 · 35%
Climax#12161B · 55%
Afterglow#263136 · 100%

The darkest point lands at Day Two—the performance climax—then lifts into a quieter closing tone.