×
Enigma

The Project

Enigma did not want a shop; it wanted a cult with a checkout. The brief was a members-first resale house where authenticated grails change hands under theatre: renaissance skies, painted clouds and a wordmark that turns in three dimensions set the stage, and a full commerce engine runs underneath it. Lots close on a live countdown with anti-snipe extensions and card-on-file bidding, so the winning bid is charged the moment the hammer falls. Mystery boxes ship curated pieces sight-unseen, matched to each member through an AI style analysis built on Anthropic’s Claude — an eight-step quiz whose answers Claude reads into a taste codex the curation team works from. And the site behaves like the world it sells: pages fall through painted clouds between routes, the homepage assembles itself behind a counting overture, wind breathes through the skies for members who switch the sound on, and a golden question mark hides in a corner for the ones who look closer — type the cult’s name anywhere and the site initiates you, reward code in hand. Shop, auctions, boxes and community stories all live in one dark typographic world that reads like an editorial title and sells like a storefront.

What we did

Custom WordPress FSE theme and full WooCommerce build. A bespoke auction engine: card-on-file bidding through Stripe, anti-snipe clock extensions, automatic charge and order creation at close, and a complete notification lifecycle — bid placed, outbid, won, lost — on branded WooCommerce emails. Mystery Box commerce gated by an AI style analysis: an eight-step quiz read by Anthropic’s Claude API into a member taste profile that drives the curation. Live bid and countdown updates on every surface. three.js scenes for the hero cloud ring, the rotating logo, the modal menu and the footer skies; GSAP and ScrollTrigger drive the pinned narratives, including the zip-open Mystery Box reveal. A full experience layer on top: painted-cloud page transitions scored with a descent that hands its echo to the arriving page, a cinematic preloader where the live 3D clouds condense while the title descrambles from DECODING to DECODE, AI-generated diegetic sound — wind over every cloud scene, a gavel on the auctions, sneaker footsteps on the shop, a pocket-watch tick on every countdown — and a hidden initiation ritual whose reward coupon pre-fills itself at checkout. Speculative hover-intent prefetching lands navigations from cache. Stripe and PayPal at checkout, Google and Discord sign-in, and support over email, WhatsApp and Discord.

Web Design & Development

The art direction crosses renaissance painting with streetwear worship, and the build keeps that theatre honest at production weight. The three.js scenes — hero ring, turning wordmark, menu and footer clouds — load lazily and swap in over still frames, so the drama never taxes the first paint. Typography runs on a fluid clamp() system calibrated to the 1920px design, holding the editorial scale from desktop to phone. The auction core is our own: bids validated atomically at the database, the closing pipeline settled through a job queue with a reaper for stuck lots, winners charged off-session on their saved card, and every state change mailed on WooCommerce-branded templates. The experience layer is engineered, not decorated: transitions time their sound to the exact navigation cut and pass the echo across the page boundary; the preloader’s counter claims 100 only when the WebGL scene reports its first rendered frame, and lifts instantly for visitors who arrive scrolled, reduced-motion or WebGL-less; the audio layer negotiates browser autoplay policy with an acknowledge-and-retry cue contract; and Claude reads the style quiz into the taste codex that steers Mystery Box curation. WhatsApp and Discord sit beside email as first-class support channels, and the whole storefront ships with security headers, versioned long-cache assets and a translate-proof, cult-dark finish.

Enigma website by Ruler

Enigma website by Ruler

Enigma website by Ruler

Enigma website by Ruler

Enigma website by Ruler

Enigma website by Ruler

Enigma website by Ruler

Enigma website by Ruler

Enigma mobile experience

Enigma mobile experience

Enigma mobile experience

Enigma mobile experience

Enigma mobile experience

Enigma mobile experience

Enigma mobile experience

Enigma mobile experience

LIGHTHOUSE OPTIMIZATION

Launching is the starting line. In the week after enigmascult.com went live, we ran a full performance and accessibility pass over the site: third-party scripts now wait until the visitor actually moves (335KB of Google's reCAPTCHA no longer taxes first paint), main-thread blocking dropped 46%, and Speed Index fell from 7.1s to 4.9s on mobile — with zero visual compromise to the site's cinematic 3D world. Accessibility was tuned to a perfect 100: WCAG AA contrast across every surface, proper list semantics in the carousels for screen readers, and a keyboard path through the whole experience. Every page shipped with hand-written titles and descriptions in the brand's own voice — because search snippets are brand copy too. Performance is design nobody screenshots. We do it anyway.

96
Performance
97
Accessibility
100
Best Practices
100
SEO
Made by humans, sharpened by AI. What's on your mind?

Rule with us

Get in touch

A boutique digital agency in Athens, building for brands across the World.

74, Mantzagriotaki Str. 176 76 Kallithea, Athens - Greece

TEL: +30 210 9567847

EMAIL: hello@ruler.agency

powder in space a day at the digital agency