MagicSurvey

Optimizing usability, prompting and design system for an AI-Native user research tool

Optimizing usability, prompting and design system for an AI-Native user research tool

My Role

Lead UX designer

Timeline & Status

6 weeks
Shipped in Q3 2024.

Team

1 product manager
1 designer (me)
2 software engineers

Tools

Figma, ProtoPie

Skills

Interaction design
Visual design
Design systems
Rapid prototyping
Usability testing

Handoff

THE OPPORTUNITY

THE OPPORTUNITY

THE OPPORTUNITY

THE OPPORTUNITY

THE OPPORTUNITY

As ByteDance’s internal AI-Native Product for the company's user research team, MagicSurvey was newly launched in Q1 2023 and have being used by 40K+ users company wide. However, due to the complexity of its homepage and poor visual design, the product suffered from low retention rate and low task success rate.

As ByteDance’s internal AI-Native Product for the company's user research team, MagicSurvey is a new product used by 40K+ users company wide. However, due to the complexity of its homepage and poor visual design, the product suffered from low retention rate and low task success rate.

As ByteDance’s internal AI-Native Product for the company's user research team, MagicSurvey was newly launched in Q1 2023 and have being used by 40K+ users company wide. However, due to the complexity of its homepage and poor visual design, the product suffered from low retention rate and low task success rate.

MY ROLE

MY ROLE

MY ROLE

MY ROLE

MY ROLE

As the sole UX designer, I proposed the redesign solution to the product leaders and worked closely with UX researchers and ML engineers, owing the end-to-end redesign of the homepage, improving its overall usability and contributing components to the design system. The redesign was launched in Q3 2024, and received amazing results.

As the sole UX designer, I proposed the redesign solution to the product leaders and worked closely with UX researchers and ML engineers, owing the end-to-end redesign of the homepage, improving its overall usability and contributing components to the design system. The redesign was launched in Q3 2024, and received amazing results.

IMPACT

IMPACT

IMPACT

IMPACT

IMPACT

37%

37%

growth in the monthly retention rate

26%

26%

increase in task success rate

7%

7%

improvement of the monthly churn rate

WHAT

WHAT

WHAT

WHAT

WHAT

MagicSurvey is internal AI-Native Product for ByteDance's employees. With over 40K+ users, it uses text-based AI prompt to generate survey questionnaires, summaries, and interview outlines.

CONTEXT

CONTEXT

CONTEXT

CONTEXT

CONTEXT

MagicSurvey's H1 2023 data shows the product suffers in low user retention rate and low task success rate, with significant user drop out at its homepage.

Low Retention Rate

-50%

More than 50% of the users dropped off after landing at the home papge.

Low Task Success Rate

-63%

More than 63% of the generated content were not exported and not utilized by the user.

THE PROBLEM

THE PROBLEM

THE PROBLEM

THE PROBLEM

THE PROBLEM

At the homepage, users found it difficult to discover core functions, follow task completion steps, and write accurate AI prompts.

THE GOAL

THE GOAL

THE GOAL

THE GOAL

THE GOAL

Redesign the homepage that allow users to clearly navigate, understand and choose functions in simple steps while receive assistance in AI prompt writing.

RESEARCH

RESEARCH

RESEARCH

RESEARCH

RESEARCH

What isn't working for the current homepage?

Complicated task completion steps.

User are required to follow through 6 steps before completing the task, resulting in high drop off rate.

Template are not discoverable.

Templates hey are too hidden in the information architecture, not discoverable by the users.

Inconsistent visuals and interactions

Inconsistent interactions across different functions.

Users tent to use the wrong feature and receive unsatisfactory results.

Lack of AI prompt guidance

Product does not provide enough assistance to show users what a "good" AI prompt is.

DESIGN GOAL

DESIGN GOAL

DESIGN GOAL

DESIGN GOAL

DESIGN GOAL

Enable users to clearly navigate core functions and easily choose different templates, while receiving guidance for the AI prompt input.

REDESIGN FEATURE #1

REDESIGN FEATURE #1

REDESIGN FEATURE #1

REDESIGN FEATURE #1

REDESIGN FEATURE #1

Highlighting the core functions while emphasizing on each function's templates, allowing users to quickly discover and choose.

REDESIGN FEATURE #2

REDESIGN FEATURE #2

REDESIGN FEATURE #2

REDESIGN FEATURE #2

REDESIGN FEATURE #2

Simplifying task completion process to 3 steps, reducing frictions in the homepage user flow.

REDESIGN FEATURE #3

REDESIGN FEATURE #3

REDESIGN FEATURE #3

REDESIGN FEATURE #3

REDESIGN FEATURE #3

Tailoring and populating an AI prompt input library with 30+ examples.

DESIGN GOAL

DESIGN GOAL

DESIGN GOAL

DESIGN GOAL

DESIGN GOAL

Creating a consistent visual identity and reusable components for the product's Design System.

RDESIGN FEATURE #4

RDESIGN FEATURE #4

RDESIGN FEATURE #4

RDESIGN FEATURE #4

RDESIGN FEATURE #4

Establish visual hierarchy based on functions and different usage sceneriors.

Default state

With AI prompt library

DESIGN FEATURE #5

DESIGN FEATURE #5

DESIGN FEATURE #5

DESIGN FEATURE #5

DESIGN FEATURE #5

Creating brand new color system and defining different usage sceneriors.

DESIGN FEATURE #6

DESIGN FEATURE #6

DESIGN FEATURE #6

DESIGN FEATURE #6

DESIGN FEATURE #6

Establishing reusable components for the product design system, including template card, prompt input bar and 10+ new UI icons.