Interaction & Development
May. 2026
Lumen Field
Lumen Field is a coordination-focused marketing experience I built end to end — membership access and treasury visibility told through a premium dark infra UI. The page walks the funnel in one scroll: hero, manifesto, membership tiers, treasury lens, season-based roadmap, community invite, and a Market Field block that adds live cryptocurrency context beside the narrative.
Visual craft carries the story. A React Three Fiber hero anchors the first fold; GSAP and ScrollTrigger stage section reveals without breaking readability. SCSS modules and design tokens keep the dark palette consistent across manifesto copy, tier cards, treasury tiles, and the roadmap ladder. Market Field fetches public spot pricing through typed Next.js server integration with short revalidation — informational, read-only, not a trading surface.
Opening hero — glowing centerpiece on a deep dark backdrop, confident headline on treasury oversight, three skim-friendly stats.
Manifesto — “Visibility is coordination” headline, warm explanatory copy, sidebar on transparency keeping choices accountable.
Membership — “Keys that choreograph—not gatekeep” headline, inviting intro, three tier cards with prices and skim-ready perk lists.
Treasury — “Treasury glass, hardened.” headline; figures illustrate storytelling only, three skim tiles plus one wider insight strip.
Roadmap — “Season-based shipping.” headline; seasons link narrative to milestones, stepped ladder showing finished work and what lines up next.
Community — “Join the luminous council.” headline, steady pacing note, two clear actions, bullets contrasting today versus later options.
Market Field — “Live market context” headline; watch-only snapshot from public pricing data, tidy asset rows with live price and daily change.