Case Study

The Oracle — Digital Fortune Teller Experience

A speculative interactive system where every fortune is revealed through a living, abstract 3D transformation. Built as a mood-driven, ceremonial micro-experience that blends UI, motion, and generative form.

Role Visual / Motion / Experience Design Tools Figma · Spline · Cinema 4D · After Effects Type Prototype, Speculative Experience

Overview

The Oracle reimagines fortune-telling for a digital context. Users encounter a pentagon-shaped device, choose a path, and receive a reading manifested as a unique abstract 3D transformation—hypnotic, symbolic, and open to interpretation.

The experience was designed as a short, ritual-like moment: intentional pacing, restrained UI, and a strong visual reveal. The end result is a cinematic interaction that feels more like a performance than a utility.

Context & Opportunity

Most fortune apps are text-heavy and literal. I wanted to create a tactile, mood-first experience where meaning is discovered rather than explained.

The opportunity was to invent a language of motion and form that could act as a personal “reading” without relying on written fortune copy.

“Anticipation → Choice → Reveal → Reflection.”

Device & Character

The Oracle lives in a small handheld pentagon — a tactile object you hold, press, and turn to receive a reading. The hardware vocabulary borrows from the Magic 8 Ball, the Nintendo Switch, and a charcoal jewelry box: familiar enough to invite play, strange enough to feel ceremonial.

The character behind the device is simple: The Oracle is a sentient being who advises mankind. Two top buttons handle navigation and selection; everything else happens on-screen.

Dimensions
3 × 3 inches
Screen
448 × 427 px
Controls
2 top buttons (select + on)
Inspiration
Magic 8 Ball · Nintendo Switch · Charcoal Box
Character
The Oracle is a sentient being who advises mankind.
Device specifications alongside the pentagon-shaped Oracle device with select and on buttons labeled

Site Map

The product fans out from a single entry point into five elemental paths. Each path resolves the same way — a reading, then quit — so the structure stays legible no matter which element a user picks.

Off → Intro → Start branches into the five elements; each element carries its own base state, animation, and reading. A persistent Quit returns the device to rest.

Site map diagram: Off, Intro, Start, and Quit nodes with five elemental branches (Heart, Sun, Moon, Crystal Ball, Star) each leading to a base state and reading

Intro Screens

Pressing the on button plays an intro video that introduces The Oracle as a presence, not a product. The navigation menu only appears once the video resolves — anticipation is part of the ritual.

From the menu the user chooses one of five elements: Moon, Sun, Crystal Ball, Heart, or Star. Each has its own intro screen with a short matter — matters of intuition, matters of clarity, matters of guidance, matters of the heart, matters of destiny.

Two pentagon screens: first showing The Oracle title over a base form, second showing the element selection menu
Five element intro screens side-by-side: Moon, Sun, Crystal Ball, Heart, and Star, each labeled with its matter

User Flow

The flow narrows toward a single moment of reveal. Minimal UI, strong pacing, and a clear end state give space for interpretation.

Anticipation builds through the intro and selection screens; the reveal is a slow, breathing 3D transformation; quit returns the device to its waiting state — ready to be picked up again.

Annotated user flow showing on, intro, selection, five elemental responses, and quit

Possible Responses & Visuals

Each element resolves to one of two visual options — ten total readings. The animation is the message: a unique 3D form blooms inside the pentagon, holds, and softens out.

Two options per element keep readings feeling personal without becoming literal. Forms range from soft floral silhouettes to spiked star bursts, each tuned for its element's tone.

Option 1 visual responses for Heart, Moon, Sun, Crystal Ball, and Star elements
Option 2 visual responses for Heart, Moon, Sun, Crystal Ball, and Star elements

Process Work

The device, character, and response language came out of sketching, motion tests in After Effects, and 3D form exploration in Cinema 4D. The pentagon was the anchor — everything else grew around it.

A second prototype iteration tightened the connections between intro, navigation, and each element's base state, so the flow could be tested end-to-end before committing to final motion.

Process work: sketches, After Effects timeline, Cinema 4D viewport, and early pentagon render states
Figma prototype map for iteration 2 showing navigation wiring across element states
Two intro flow frames showing the on-press video and the navigation menu reveal

Outcome

A compact, cinematic reading experience that merges UI, 3D, and motion—demonstrating multi-tool fluency and strong art direction.

The prototype is ready for a real-time generative expansion with voice or touch input, and a growing “library” of readings that evolve with each session.

Next Steps

Future iterations focus on personalization, spatial audio, and richer input modalities that deepen the ritual.