Building a digital oracle deck

Jurate came to us with a physical deck of oracle cards and a simple question. Could people draw a card on her website the way they would at her table?

That turned into one of the more enjoyable things we have built. Here is roughly how it went.

The brief

The draw had to feel like a draw. Not a page reload with a random image on it. She wanted the shuffle, the pause, the small moment before the card turns over. If that part felt cheap, nothing else would rescue it.

It also had to earn her something. Someone draws a card, sees the image, then enters a name and email to read the full meaning.

What we built

No framework. The whole front end is one JavaScript file, 424 lines, plus CSS transforms for the card movement. React would have meant more code and more waiting for very little in return.

No database either. The 52 cards live in a JSON file, settings in another, and sign ups get appended to a third. There is a small admin page where she edits card text herself. For a deck that changes a few times a year, a database would have been maintenance she does not need.

Sound mattered more than we expected. There is a shuffle and a soft sparkle when the card lands. Browsers refuse to play audio until someone taps the screen, which is a sensible rule and also an annoying one, so we start the audio on the same tap that starts the shuffle. It never feels blocked because it is never asked to play on its own.

Card images are the heavy part. Fifty two of them, and they are preloaded in the background while the visitor is still reading the intro. By the time anyone taps, the reveal has nothing left to download.

The part that took longest

Timing. Shuffle, pause, card, text. We rebuilt that sequence several times. Too fast and it reads like a slot machine. Too slow and people tap again because they think it broke.

The card meaning types itself out one character at a time. On paper that sounds like a gimmick. In practice it slows the reader down to roughly the speed of the words, and it turned out to be the difference between a web page and something that feels like it is speaking to you.

Where it ended up

It runs on her own domain, on her own hosting, in her name. Sign ups go straight into the list she was already using. She can add a card, reword a meaning, or swap an image without calling us.

That last part matters more than any of the technical decisions above. The best outcome for a build like this is that the person who owns it stops needing the person who made it.

You can try it at oracle.sovselfpath.com. Draw one and see what turns up.