B2C

End to End

Product Strategy

Design System

Citrology ( 2022 ) - Necessary Behavior

A coach based tarot application, designed for mobile devices that simulates the experience of a traditional, physical tarot card reading. Providing digital card decks experience to offer daily guidance, specific insights, and spread interpretations on topics like love, career, and personal growth.

Build from scratch with challenges

Necessary Behavior is an organization focus on the media platform dedicated to social justice, sharing educational resources through digital content, podcasts, and e-commerce. While the organization had a strong presence in media sector, Citrology is an entirely new product line.

There was no design system on that time, the only website was built couple years ago and no document available.

That's where I came in.

Necessary Behavior is an organization focus on the media platform dedicated to social justice, sharing educational resources through digital content, podcasts, and e-commerce. While the organization had a strong presence in media sector, Citrology is an entirely new product line.

There was no design system on that time, the only website was built couple years ago and no document available.

That's where I came in.

My Role

I was the only designer worked with 2 developers.

As the lead designer for this initiative, I defined the UX strategy, built the product foundation, scaled the design system and reusable patterns. Bridged the gap between the established brand's language and this new product experience.

As the lead designer for this initiative, I defined the UX strategy, built the product foundation, scaled the design system and reusable patterns. Bridged the gap between the established brand's language and this new product experience.

I conducted competitive analysis and interviews to identify the opportunity to design a coaching-based Tarot app for beginner-level users

Key Insights

  • There were many expert-level Tarot apps on the market, which follow many card rules and are too complex for beginners.

  • The traditional tarot cards are tangible cards that people can draw from the physical deck. The challenge is to re-create the scene and bring a realistic experience for users in a digital deck.

💬

“The major arcana only have 22 cards. I can pull one or three cards at most for Yes and No questions, or for past/present/future spread, but beyond that, I’m not really sure what I’m looking at.”

— Jessica Judd

“The major arcana only have 22 cards. I can pull one or three cards at most for Yes and No questions, or for past/present/future spread, but beyond that, I’m not really sure what I’m looking at.”

— Jessica Judd

“My best friend and I would spend hours reading each other’s tarot cards. I have my own physical tarot deck at home that I use often and it’s nice to look at their brief descriptions.”

— Ashley Brown

“My best friend and I would spend hours reading each other’s tarot cards. I have my own physical tarot deck at home that I use often and it’s nice to look at their brief descriptions.”

— Ashley Brown

Design Solutions - to differentiate this product from expert-level Tarot tools, this product was designed with a coach-based purpose

I designed the screens to guide beginner-level users to pick it up with no prior training. Dedicated to providing a smooth experience moving from the physical deck to the digital tarot world.

I designed the screens to guide beginner-level users to pick it up with no prior training. Dedicated to providing a smooth experience moving from the physical deck to the digital tarot world.

60 seconds of Reading experience is a key metric I designed to differentiate from an expert-level Tarot app

As the product targets beginner-level users, the core function of the "Reading daily card" workflow aims to be completed in under 60 seconds, encouraging users to open the app every day without getting bored too quickly.

As the product targets beginner-level users, the core function of the "Reading daily card" workflow aims to be completed in under 60 seconds, encouraging users to open the app every day without getting bored too quickly.

One of the usability is Time-on-task, 92% participants can complete the task under 60 seconds

To validate whether a new user can complete the reading experience within 60 seconds, I conducted testing, and 92% of users completed the task on time.

To validate whether a new user can complete the reading experience within 60 seconds, I conducted testing, and 92% of users completed the task on time.

Design a seamless Tarot experience from physical environment to digital world

Offering three types of reading formats, guiding users from spread selection to detailed reading results.

Offering three types of reading formats, guiding users from spread selection to detailed reading results.

Coach-based tarot experience allows the user to play and learn

Providing 2 different learning modes about the cards and the Core Concepts & Knowledge

Providing 2 different learning modes about the cards and the Core Concepts & Knowledge

Build a tool to track personal growth, analyzing patterns and create a personalized, accessible reference tool

Users can save readings to compare them over time, helping to identify recurring patterns or cards that indicate a developing situation or personal growth.

Users can save readings to compare them over time, helping to identify recurring patterns or cards that indicate a developing situation or personal growth.

A personal account can save reading history, track progress over time, and sync data across devices.

Features of account management included the Premium upgrade, user dashboard, and profile editing screens. To maintain a user-friendly approach with a clear, transparent language regarding subscription pricing and data privacy, and build trust between the business and users.

Design System

emotions-happy

emotions-happy

emotions-happy

emotions-happy

emotions-happy

emotions-happy

My primary goal was to establish a consistent user experience for light and dark themes across the product, seamlessly bridging the brand identity across diverse product sections. I built the foundational design system, defining reusable patterns, UI components, and usage guidelines.

Taking a bird's-eye view of the entire digital ecosystem, I've also extended the visual style guide into a holistic framework for other business sections by delivering clear, robust documentation, empowering cross-functional teams to adopt the system easily, and ensuring a unified and frictionless user experience across the board.

My primary goal was to establish a consistent user experience for light and dark themes across the product, seamlessly bridging the brand identity across diverse product sections. I built the foundational design system, defining reusable patterns, UI components, and usage guidelines.

Taking a bird's-eye view of the entire digital ecosystem, I've also extended the visual style guide into a holistic framework for other business sections by delivering clear, robust documentation, empowering cross-functional teams to adopt the system easily, and ensuring a unified and frictionless user experience across the board.

Tarot Made Simple

The first design system provided us with a solid foundation for creating and maintaining the future system. The interface is consistent, tailored, and intuitive, helping new users pick up easily and reducing drop-off rate. By extending the system guideline to diverse product systems, we filled the gap between brands and new products.

The first design system provided us with a solid foundation for creating and maintaining the future system. The interface is consistent, tailored, and intuitive, helping new users pick up easily and reducing drop-off rate. By extending the system guideline to diverse product systems, we filled the gap between brands and new products.

💬

"Honestly, I was always a bit intimidated by Tarot, but this app makes it so simple. The layout just makes sense. I didn't have to guess what any of the spreads meant, and I picked up the rules almost immediately without feeling overwhelmed."

— Matthew Anderson

"Honestly, I was always a bit intimidated by Tarot, but this app makes it so simple. The layout just makes sense. I didn't have to guess what any of the spreads meant, and I picked up the rules almost immediately without feeling overwhelmed."

— Matthew Anderson

"It's so easy to navigate. I love that I don't have to go digging for information. Everything from pulling the cards to understanding their meaning is right there. It feels really welcoming for someone who has never done this before."

— Jessica Miller

"It's so easy to navigate. I love that I don't have to go digging for information. Everything from pulling the cards to understanding their meaning is right there. It feels really welcoming for someone who has never done this before."

— Jessica Miller

[ Back on top ]

Hi, I'm Miranda Liang

Resume

Work Experience :

5+ years

Domain :

User Experience Design

User Interface Design

Worked On :

Web & Mobile

B2B & B2C

Contact Me :

Mirandaliang6622@gmail.com

LinkedIn

Hi, I'm Miranda Liang

Resume

Work Experience :

5+ years

Domain :

User Experience Design

User Interface Design

Worked On :

Web & Mobile

B2B & B2C

Contact Me :

Mirandaliang6622@gmail.com

LinkedIn

Hi, I'm Miranda Liang

Resume

Work Experience :

5+ years

Domain :

User Experience Design

User Interface Design

Worked On :

Web & Mobile

B2B & B2C

Contact Me :

Mirandaliang6622@gmail.com

LinkedIn