๐Ÿ“ท App icon + iPhone mockup hero โ€” dark background, app home screen visible Hero Image ยท 16:7

Tarot

A full-featured tarot reading iOS app โ€” designed and built solo for readers who can't always be there when their clients need guidance.

Role

Design ยท Development

Type

iOS App ยท Personal Project

Tools

Figma ยท SwiftUI ยท Xcode

Status

Complete ยท Pending Launch

Overview

I've been reading tarot for years โ€” for myself and for friends. But being available whenever someone needs a reading isn't always possible. At the same time, most tarot apps on the market feel either too generic or too shallow to replace a real reading.

This project started as a personal tool and grew into a full iOS app with AI-powered interpretation โ€” designed to bridge the gap between a human reader and an on-demand experience.

The Problem

Tarot readers โ€” myself included โ€” often can't respond to clients in real time. A question that feels urgent at 2am doesn't wait until morning. And while messaging a reader is personal, some questions are small enough to be answered without a full session.

I validated this pain point with tarot practitioner friends who shared the same frustration: clients needed help, but immediate availability wasn't always realistic.

๐Ÿ“ท Diagram โ€” "Reader unavailable โ†’ client waits โ†’ question goes unanswered" Problem Diagram

Who It's For

Three primary users shaped the design: tarot enthusiasts who want to do self-readings anytime, practicing readers whose clients need quick answers between sessions, and beginners learning the cards through daily practice.

๐Ÿ“ท User persona cards โ€” Enthusiast / Practitioner / Beginner (3 cards side by side) User Personas

What I Built

The app is structured around three core experiences โ€” mirroring how people actually use tarot, not how apps typically present it.

๐Ÿ“ท Today's Reading tab TarotDailyView
๐Ÿ“ท Spread Menu tab SpreadMenuView
๐Ÿ“ท Card Library tab CardLibraryView

Today's Reading

A daily card pull with personalized guidance, designed to become a quiet morning ritual. One card, one focus, one intention for the day.

๐Ÿ“ท Card face up with interpretation text Daily Reading ยท Screenshot
๐Ÿ“ท AI interpretation expanded view AI Response ยท Screenshot

Spread Readings

Eight spread options โ€” from a single-card pull to the Celtic Cross โ€” match the depth of the question being asked. Upright and reversed positions are randomized, just like a real shuffle.

๐Ÿ“ท Spread selection screen showing all 8 options SpreadMenuView ยท Screenshot
๐Ÿ“ท Cards laid out in spread formation SpreadReadingView ยท Screenshot

Design Decisions

The UI uses a deep purple-black background โ€” intentional contrast to most apps which feel either too occult or too clinical. The goal was something that felt personal and calm, not theatrical.

Navigation is kept to three tabs, mirroring how readers think: today / a reading / the cards. No unnecessary layers.

๐Ÿ“ท Color palette + typography โ€” dark purple background, white text, accent colors Design System ยท Color & Type

AI Interpretation

The core insight: small questions don't need a 30-minute session. AI interpretation powered by OpenAI replicates the personalized, nuanced response a human reader gives โ€” making it possible to get a real answer at 2am without waiting.

๐Ÿ“ท AI reading response screen โ€” full interpretation from OpenAI AI Reading ยท Screenshot

Process

Solo โ€” design and development, AI-assisted.

๐Ÿ“ท Process timeline โ€” Design โ†’ Wireframe โ†’ Prototype โ†’ Build โ†’ Pending Launch Process Diagram

Status

The app is complete. AI integration is built and pending API key configuration. App Store submission is the next step.

๐Ÿ“ท Xcode / TestFlight screenshot showing completed build ready for submission Build Status ยท Screenshot

Tarot Web

A gesture-controlled tarot website โ€” designed to give users the feeling that they are physically drawing the cards themselves.

Role

Design ยท Development

Type

Web ยท Personal Project

Tools

HTML ยท CSS ยท JavaScript

Live

Web Browser

Origin

After building the iOS app, I realized the web could offer something the app couldn't: a more immersive, ceremonial experience. Traditional tarot websites present the practice as a form โ€” click a button, get a card. That felt flat.

Tarot as a practice is ritualistic. The interface should reflect that.

The Design Question

How do you create a sense of ritual through a screen?

๐Ÿ“ท Website hero screenshot โ€” star field background, single face-down card centered Website Hero ยท Screenshot

The Wheel

Cards are arranged on a 3D rotating carousel. Users drag to spin it, and it responds with real momentum and inertia โ€” decelerating naturally, like a physical object. Choosing a card means stopping the wheel on the one you feel drawn to.

๐Ÿ“ท Wheel closed โ€” single face-down card before gesture Wheel Closed State
๐Ÿ“ท Wheel expanded โ€” 5 cards in 3D carousel, mid-spin Wheel Expanded State

Open Palm Gesture

Using the device camera, an open hand gesture expands the wheel from a single face-down card into the full carousel. The act of opening your hand mirrors the act of opening yourself to a reading.

Together, these make the user feel like they are shuffling and drawing โ€” not clicking.

๐Ÿ“ท Gesture recognition in action โ€” open palm triggering wheel expansion (camera view + wheel side by side) Gesture Interaction ยท Screenshot or Screen Recording

Design Decisions

A dark star field canvas establishes atmosphere before any interaction begins. Cormorant Garamond and Crimson Pro โ€” both editorial serifs with a historical, ceremonial quality โ€” contrast with the modern sans-serif of the app, giving the web experience its own distinct personality.

Draws come from a real 78-card pool without replacement, preserving the integrity of a physical reading.

๐Ÿ“ท Typography + color system โ€” Cormorant Garamond / Crimson Pro, dark purple palette, star canvas Design System ยท Web

App vs. Web

The app is intimate and personal โ€” a tool you use alone, quietly. The website is experiential โ€” something you might open with a friend, or when you want the full ritual. They serve different emotional needs and different moments.

๐Ÿ“ท Side-by-side comparison โ€” iOS app screenshot (left) vs. website screenshot (right) App vs Web Comparison

AI Analysis

After completing a spread, users can request an AI deep analysis. The same OpenAI integration from the app provides personalized interpretation โ€” bridging the experiential ritual of the web with the depth of a real reading.

๐Ÿ“ท AI analysis screen โ€” three cards drawn, interpretation text below AI Analysis ยท Screenshot