Joelle Cottle

Case study · Product design

DbJ Deck Generator.

A browser tool that turns static card art into an interactive digital deck.

Role
Product definition, UX, visual design, testing, launch
Built with
Claude Code, HTML, CSS, JavaScript
Timeline
Core build in two weekends
Status
Live, sold on Etsy
Three-card past, present, future spread in the Guidance of Khepri deck
Three-card spread in a generated deck, Guidance of Khepri

The point

Let card creators sell a digital deck that works like a real one, with no technical setup for them or their buyers.

Problem

I found the gap while looking at oracle card art as an Etsy product. Making the art was straightforward. Delivering it digitally was not.

Most digital decks were sold as PDFs or folders of images. Buyers got the cards, but had to print them, shuffle by hand, or find a workaround. Creators who wanted something better needed technical skills, paid hosting, or a platform subscription.

How do you turn finished card art into a digital deck a customer can use, without the creator or the buyer dealing with technical setup?

Constraints

It had to work for creators who don’t code and buyers who won’t read instructions. So: no account, no subscription, no hosting, no API, and no internet connection after download.

So the finished deck had to be one self-contained HTML file.

The creator sells one file. The buyer double-clicks it. Everything else in the product supports that handoff.

How it works

Card art and a spreadsheet go in. A finished deck comes out.

Card images A CSV of titles and meanings Branding and a shop link
What the creator brings
The generator form creators fill in
The generator
A finished deck
One HTML file the buyer opens

What the buyer gets

Deck home screen with draw options
Draw a card or a spread
Single card with its meaning
Card meaning
Full deck gallery view
Browse the full deck

Scope

Cut from version one.

AI made extra features easy to add. I cut most of them. The test was whether a feature improved the first experience for the creator or the buyer enough to justify the added complexity.

  • Live preview in the generator
  • Markdown in card meanings
  • CSV editing in the generator
  • Light and dark theme toggle
  • Background colour picker
  • Five-card spread
  • Verification table

Outcome

“It was hard to find a solution to distribute the deck digitally. This app is perfect and absolutely solves the problem.”

Etsy buyer review

The generator launched as a paid Etsy product with a landing page, live demo, documentation and license terms. It has a 5.0 rating. Sales are still early, but buyers with this exact problem understood the product and said it solved it.

Examples

Two finished decks made with the generator.

These are what a creator’s customers receive. The generator itself is sold on Etsy.

Guidance of Khepri ↗ Wild Wisdom ↗ About the generator ↗
NextThe Ashen Court