Lucidchart

Opportunity

New users find Lucidchart challenging and making their first experience overwhelming

Due to its steep learning curve, Lucidchart challenged us out to make users onboarding and learning easier.

Lucidchart is an online diagramming tool with 14,000 new users signing up each day.

How might we ease and empower new users during onboarding?

Solution

Through research we found that Lucidchart has an extensive set of tools. New users were unfamiliar with these tools and the current learning experience was not effective.

To familiarize them with these tools quickly, we proposed real-time tutorials that provides tips based on user's current activity.

Tutorials based on current diagramming activity

A modal window appears with a list of tips based on the current tool being used by a user.

GIF based tutorials to encourage learning by doing

Selecting of a particular tip leads to GIF based tutorial to show how to use the tool. This helps in learn the tool while using it.

Process

We used double diamond

Our team went through several converging and diverging throughout our process. As we did so, we challenged ourselves to think both about the user goals and the business goals.

Research

To explore our design space, we started with research.

Lucidchart provided us with quantitative data to narrow down the scope of the problem. Additionally, we observed both new and seasoned users while they diagrammed. This helped us explore various painpoints during onboarding.

Assumptions

To form initial hypothesis

Quantitative Analysis

To validate our assumptions and form new hypothesis

Interviews

To observe new and seasoned users using Lucidchart

Research Insights

Through NPS (Net Promoter Score) data and interviewing a mix of 6 new and seasoned users, we found a 3 key insights.

1. Users have trouble getting started making Lucidchart stressful and hindered creativity

"I really wanted to draw this nice shape, but I can't figure it out. Are we done?"
‍-Student (New User)

According to data, users used 'feature find' feature for the first 5 weeks suggesting they had trouble getting started. Additionally, during our interviews, we found 3 users abandoned their first diagram. They had trouble searching and using tools making it frustrating to diagram.

2. Users tend to skip the tutorial because it hinders the diagramming experience

Lucidchart provides a modal tutorial during their onboarding which cannot be accessed again. 6 out 8 of our users skipped these tutorials. They thought these were either a hindrance or could be figured out later while diagramming.

"Let's skip this. I can figure it out later."
‍-Engineer (New User)

"I just want to diagram already. I have used softwares like this. Should be easy."
-Student (Seasoned User)

3. Users have trouble with basic tools long after getting started

According to data, users utilized feature find tool 3-6 months after getting started to search basic tools and function. This suggests users have trouble using basic diagraming tools.

4. Progress in learning increases user retention

The graph below shows that users who made progress while learning retained with Lucidchart. This shows that learning the tool and increasing familiarity is an important success metric from business perspective.

To make onboarding a learning-supportive environment.

Through our research insights, we narrowed down our problem space to the learning process of user’s onboarding. To understand this further, we honed in on painpoints specific to this space

Narrowing Problem Space

Painpoints

Through our research, we found painpoints specific to the learning process during onboarding.

1. Interruptive tips

Frequency of verbal contribution often leads to someone taking credit of someone else’s work.

2. Limited tips that are displayed once

Interviews with managers revealed when conversation is hijacked by only a few participants, it decreases team motivation

How might we make a need-based long-term learning supportive onboarding experience?

Product Goals

Using our insights and painpoints, we were able to distill down to these design principles to guide us.

Learnability

Enable an easy learning curve irrespective of a user's experience level

Discoverability

Empowering the user to learn by doing

Efficiency

Reduce the amount of time to complete a task uninterrupted

Ideation

We didn't let feasibility and viability constrain us. We challenged ourselves to think about new user types, markets, and devices

To think creatively and beyond the existing system, we conducted a series of 'what if' exercises.

To pick one idea, we took a step back to review and balance user and business goals.
Among all concepts we finally landed on real time tutorials.

Design Rationale

Showing relevant tips only when user active the tool
Playing tutorial video automatically without interrupting user’s flow
User can review the tips as many times as they want
Increases familiarity as user diagrams

Testing

We tested the concept using a Minimum Viable Prototype (MVP)

Sticky notes worked as the modal window, and a team member acted as the prompting system. Participants were requires to recreate a premade diagram using basic tools. A control group drew it with the original tutorial and the others drew it with real-time tutorial.

Results

The real-time tutorial did help users perform better

Worked more quickly

Users took 36s less (average) to complete the diagram

Thought more creatively

Users with tutorials, drew after the pre-made diagram as they enjoyed it

Made fewer errors

They made fewer errors trying to find tools and using them

Low fidelity wireframes and testing

We found that users found it intuitive to use however, would like to minimize it or disable it when needed.

Following our test, we built a low fidelity wireframe and tested it.

Final Design

After validating our design, we built a cleaner UI and made changes according to user feedback.

Tutorials based on current diagramming activity

A modal window appears with a list of tips based on the current tool being used by a user. While the user is not using any tools, the modal recommends tutorials based on common searches.

GIF based tutorials on select to encourage learning by doing

As a user selects a tutorial, a gif play to show the functionality of the tool. This visual way is more intuitive than reading thus allowing the user to diagram uninterrupted.

Disable when required

Once the user is well acquainted with the tools, they can disable it. The user has the option to enable it while encountering a new tool.

Reflection