Jiyoung Lee

About

Resume

LinkedIn

Jiyoung Lee

Jiyoung Lee

Enhancing the referral flow and design systems

Enhancing the referral flow and design systems

MY ROLE

Product designer

UX researcher

TOOLS

Figma

Figjam

TIMELINE

Oct 2024 - Dec 2024

TEAM

2 Product Designers

2 Product Managers

1 Developer

1 CEO

MY ROLE

Product designer

UX researcher

TOOLS

Figma

Figjam

TIMELINE

Oct 2024 - Dec 2024

TEAM

2 Product Designers

2 Product Managers

1 Developer

1 CEO

Krush, a dating app targeting Asian millennial users, introduced a referral feature to drive user acquisition—but struggled with low engagement and conversion rates. I collaborated with the CEO and the team on redesign.

Krush, a dating app targeting Asian millennial users, introduced a referral feature to drive user acquisition—but struggled with low engagement and conversion rates. I collaborated with the CEO and the team on redesign.

What was the problem of Krush?

What was the problem of Krush?

Krush’s referral flow had high growth potential but suffered from low conversions due to a fragmented user experience. Inconsistent UI further weakened brand trust and recognition.

Krush’s referral flow had high growth potential but suffered from low conversions due to a fragmented user experience. Inconsistent UI further weakened brand trust and recognition.

Current screens

Current screens

Issues with the current flow

Issues with the current flow

The UI lacks consistency with other screens, particularly with the heart icons, which appear in varying styles across the app.

The UI lacks consistency with other screens, particularly with the heart icons, which appear in varying styles across the app.

The current screen requires users to take an extra step by manually entering names and phone numbers.

The current screen requires users to take an extra step by manually entering names and phone numbers.

There’s a lack of feedback—users can’t see whether their invitee has joined or track referral progress.

There’s a lack of feedback—users can’t see whether their invitee has joined or track referral progress.

Design opportunity

Design opportunity

How might we increase referral engagement while building a cohesive, scalable design system that improves usability throughout the app?

How might we increase referral engagement while building a cohesive, scalable design system that improves usability throughout the app?

Background on this project

Background on this project

Krush’s referral flow was hard to find and lacked compelling incentives, resulting in low engagement and conversion. Visual inconsistencies and the absence of a reusable design system also created challenges for brand consistency, developer handoff, and long-term scalability.

Krush’s referral flow was hard to find and lacked compelling incentives, resulting in low engagement and conversion. Visual inconsistencies and the absence of a reusable design system also created challenges for brand consistency, developer handoff, and long-term scalability.

The CEO of Krush asked us to boost referral engagement and elevate design consistency throughout the app for a more cohesive and effective user experience.

The CEO of Krush asked us to boost referral engagement and elevate design consistency throughout the app for a more cohesive and effective user experience.

Our project goal to achieve user needs

Solution 1

New entry point

Reposition the referral feature on the home screen for easy discovery and engagement

Solution 2

Tiered program

Restructure rewards into a tiered program to drive ongoing engagement.

Solution 3

Cohesive system

Build a cohesive UI and scalable design system to reinforce brand experience.

Hypothesis

Making referrals visible, adding reward feedback with tier rewards, and building a scalable design system will boost engagement and keep design consistent.

Background research

Background research

Uncovering what works - and what doesn’t

Uncovering what works - and what doesn’t

Competitor Benchmarking

Competitor Benchmarking

(3 dating app and 2 non-dating app)

Used clear CTAs and instant feedback to boost referral engagement

Used clear CTAs and instant feedback to boost referral engagement

Collected User surveys through Googleforms

Collected User surveys through Googleforms

(10 user responses, aged 20-35)

Low visibility and unclear rewards stopped users from sharing referrals.

Low visibility and unclear rewards stopped users from sharing referrals.

UI Audit of current Krush screens

UI Audit of current Krush screens

(3 different flows through out the app)

Color, spacing and typography varied across screens

Color, spacing and typography varied across screens

Usability testing

Usability testing

Diving into the real problem

Diving into the real problem

Users completed specific tasks during moderated sessions, helping us identify usability issues and pain points. These are the key pain points identified.

Users completed specific tasks during moderated sessions, helping us identify usability issues and pain points. These are the key pain points identified.

Pain point 1

Pain point 1

Received feedback that there is no clear entry point for the referral feature on the main screen, leading to poor discoverability and low engagement.

Received feedback that there is no clear entry point for the referral feature on the main screen, leading to poor discoverability and low engagement.

Pain point 2

Pain point 2

Received feedback that the referral flow lacked confirmation or feedback after sharing and unable to track process.

Received feedback that the referral flow lacked confirmation or feedback after sharing and unable to track process.

Pain point 3

Pain point 3

Received feedback regarding the button color contrast and inconsistency of design system through out the app

Received feedback regarding the button color contrast and inconsistency of design system through out the app

Insights from the research

User feedback revealed three main pain points. hese insights underscored the need for a more visible, rewarding, and trustworthy referral experience—supported by a cohesive visual system to enhance usability and brand consistency.

Insight #1

Discoverability

The referral option was buried under My Page → Referral, resulting in low user awareness and engagement.

Insight #2

Weak Motivation

Users found the reward (3 hearts) unmotivating. Without confirmation or feedback after sharing, trust and re-engagement dropped.

Insight #3

UI Inconsistency

Inconsistencies in color, typography, spacing, and component styles weakened the overall brand and user experience.

Final design based on the feedback!

Final design based on the feedback!

Solution for drop-off, delay, and accessibility

Solution for drop-off, delay, and accessibility

Solution 1

New entry point

To lower entry barriers, we repositioned the referral feature on the home screen using a top banner, making it easy to find and naturally inviting to interact with.

Solution 2

Tiered reward programs

To encourage ongoing engagement, the reward system was restructured into a tiered program, shifting the experience from a one-time action to a series of motivating steps.

Solution 3

Cohesive system

We built a cohesive visual system across the UI to strengthen the brand experience. By componentizing the UI through a design system, we also improved development efficiency and long-term maintainability.

Solution 1

New entry point

To lower entry barriers, we repositioned the referral feature on the home screen using a top banner, making it easy to find and naturally inviting to interact with.

Solution 2

Tiered reward programs

To encourage ongoing engagement, the reward system was restructured into a tiered program, shifting the experience from a one-time action to a series of motivating steps.

Solution 3

Cohesive system

We built a cohesive visual system across the UI to strengthen the brand experience. By componentizing the UI through a design system, we also improved development efficiency and long-term maintainability.

Final usability testing

Final usability testing

Words from the users on final design

Words from the users on final design

We conducted follow-up usability testing on the final design to validate flow clarity, engagement, and trust. Results confirmed improved usability and higher task success rates:

We conducted follow-up usability testing on the final design to validate flow clarity, engagement, and trust. Results confirmed improved usability and higher task success rates:

Let’s explore Krush Design Systems!

Let’s explore Krush Design Systems!

Design System

Design System

The Krush Design System brings consistency, clarity, and warmth to every touchpoint. It was built to reflect the app’s playful yet meaningful tone—balancing modern dating UI patterns with cultural sensitivity. From typography to components, each element supports a seamless and emotionally resonant user experience.

The Krush Design System brings consistency, clarity, and warmth to every touchpoint. It was built to reflect the app’s playful yet meaningful tone—balancing modern dating UI patterns with cultural sensitivity. From typography to components, each element supports a seamless and emotionally resonant user experience.

Color

Krush’s color palette blends warmth and energy to evoke connection, trust, and playfulness. It reflects both modern dating dynamics and cultural vibrancy rooted in Asian identity.

Primary

HEX - FFFFFF

HEX - 000000

HEX - 6D2E46

Secondary

HEX - FFF5F2

Tertiary

HEX - EE4A5F

HEX - 8F6932

HEX - 494949

HEX - 696969

Semantic

Danger

HEX - DC0722

Default

HEX - 494949

Warning

HEX - DBC30E

Success

HEX - 12842B

Typorgaphy

Typorgaphy

Our typography is set in Nunito, chosen for its soft, balanced forms and readability. It embodies Krush’s voice—welcoming, expressive, and rooted in meaningful connection.

Our typography is set in Nunito, chosen for its soft, balanced forms and readability. It embodies Krush’s voice—welcoming, expressive, and rooted in meaningful connection.

Aa

Nunito

Regular

Medium

Semi-bold

Bold

Aa

Nunito

Regular

Medium

Semi-bold

Bold

H1

Find your Krush. Your culture. Your connection.

H2

Find your Krush. Your culture. Your connection.

H3

Find your Krush. Your culture. Your connection.

H4

Find your Krush. Your culture. Your connection.

P1

Find your Krush. Your culture. Your connection.

P2

Find your Krush. Your culture. Your connection.

P3

Find your Krush. Your culture. Your connection.

Icons

Our icons are built on a simple, rounded system that aligns with Krush’s friendly tone. They enhance usability and visual cohesion without distracting from key content or interactions.

Components

Our component library brings together visual clarity and functional reliability. Each element—from buttons to cards—is crafted to reflect Krush’s brand voice while supporting intuitive user flows.

text

text

CTA

CTA

CTA

CTA

Refer more

Refer more

Refer

Refer

Invite 1 friend, get 3 Hearts + Boost!

Refer

Invite 1 friend, get 3 Hearts + Boost!

Refer

links/code

CTA

CTA

Tier

Silver

Gold

Platinum

Requirement

Invite 1 friend

Invite 3 friends

Invite 5 friend

Reward

Get 3 +

Boost

Get 4 +

3 Boost

Get 6 +
5 Boost

Title text

Sub title text

Detail text

Silver

Gold

Platinum

CTA

Message

Detail message

Message

Message

Detail message

CTA

Design system & accessibility

Design system & accessibility

Defined a design token–based system that included a consistent color palette, typography scale, and button structure across the UI. To ensure visual coherence and efficiency, I standardized reusable components such as home banners, CTA buttons, and content cards with a clear visual hierarchy. The system was built in alignment with WCAG 2.1 AA guidelines, ensuring proper text contrast, minimum touch target sizes (44px and above), and accessible focus states for an inclusive user experience.

Defined a design token–based system that included a consistent color palette, typography scale, and button structure across the UI. To ensure visual coherence and efficiency, I standardized reusable components such as home banners, CTA buttons, and content cards with a clear visual hierarchy. The system was built in alignment with WCAG 2.1 AA guidelines, ensuring proper text contrast, minimum touch target sizes (44px and above), and accessible focus states for an inclusive user experience.

Impact

Words from the client!

Words from the client!

The CEO of Krush expressed satisfaction with the depth of the redesign work and showed strong interest in expanding the design system to elevate consistency and scalability across the product.

The CEO of Krush expressed satisfaction with the depth of the redesign work and showed strong interest in expanding the design system to elevate consistency and scalability across the product.

Lessons learnt

Lessons learnt

Reflection & Takeaways

Reflection & Takeaways

This project deepened my understanding of how critical structural design is in shaping user behavior. I realized that simply changing a button’s position or adjusting reward amounts isn’t enough—without a clear journey that leads users from awareness → anticipation → action → repetition, even the best features won’t drive real impact.


I also came to see referrals not just as a feature, but as a growth channel for brand expansion.


Building the design system further showed me the value of consistent UX in creating trust and usability. By unifying scattered styles and components, I was able to create a smoother, more reliable experience—one that keeps users oriented and engaged.


Ultimately, this project reminded me that great design isn’t just about visual polish—it’s about creating a clear, reusable structure that helps both users and teams navigate with ease. It brought me closer to the core of what design truly is: building systems that make action intuitive and collaboration efficient.

This project deepened my understanding of how critical structural design is in shaping user behavior. I realized that simply changing a button’s position or adjusting reward amounts isn’t enough—without a clear journey that leads users from awareness → anticipation → action → repetition, even the best features won’t drive real impact.


I also came to see referrals not just as a feature, but as a growth channel for brand expansion.


Building the design system further showed me the value of consistent UX in creating trust and usability. By unifying scattered styles and components, I was able to create a smoother, more reliable experience—one that keeps users oriented and engaged.


Ultimately, this project reminded me that great design isn’t just about visual polish—it’s about creating a clear, reusable structure that helps both users and teams navigate with ease. It brought me closer to the core of what design truly is: building systems that make action intuitive and collaboration efficient.

More Projects