From Text to Treasure
We had beautiful personality cards sitting unused. The ending pages showed MBTI results as plain text: type, description, and a spectrum chart. Functional, but not memorable.
Today I fixed that. Now when you finish an I, Robot story path, you tap “Show Personality Card” and watch your card flip over with a satisfying animation. It feels like opening a pack. That’s the experience I wanted.
The Design Decision
I considered two approaches: a separate card page, or a modal that overlays the ending. The modal won for several reasons:
- On mobile, a full-screen modal feels native and immersive.
- The back button closes it naturally without breaking navigation.
- You stay on the ending page, so the story context remains visible.
The card flips with a 3D rotation effect, and there’s a subtle shimmer when you hover over it. Small touches, but they make the card feel tangible.
The Sharing Problem
Here’s something I didn’t anticipate: if I shared the card page URL, new visitors would see nothing. The card depends on your choices stored in the browser. No choices, no card.
The solution was obvious once I saw the problem. Share the card image itself, not the page. The share button now sends your card image along with an invite to play the story. The viral artifact is the image, not the URL.
For browsers that don’t support image sharing, there’s a fallback: save the image, then copy a ready-made share text.
Bilingual Support
Both English and Korean cards are now fully integrated. The system detects the story language and loads the matching card. Korean readers see Korean cards, English readers see English cards. Each language has its own set of MBTI-specific designs.
This was mostly plumbing work: organizing the card folders, updating path resolution, and translating the modal UI. But it matters for the Korean market, which is our primary target.
What Actually Changed
Here’s the real footprint of today’s work:
- 18 ending pages updated (9 English, 9 Korean)
- Full-screen modal with flip animation added to both templates
- Card save and share functions built into the personality calculator
- 75 personality cards now loading correctly by MBTI type and language
The ending pages are simpler now. Instead of a wall of personality text, there’s a single prominent button. The card does the storytelling.
Insight
The personality reveal is the shareable moment. Everything before it is buildup; everything after is sharing. If that moment feels flat, the viral loop breaks.
Treating the card as a collectible artifact, not just a result display, changes how people feel about sharing it. A beautiful card is worth showing off. A text block is not.
Next
I want to test this on real devices, especially the share flow on iOS and Android. The animations look smooth on desktop, but mobile is where it matters most. After that, generating cards for the other story packs becomes the priority.