Dgraph Cloud onboarding flow

Revisiting the onboarding process for developers that drive Dgraph's success.

Platforms
Web and mobile

Scope
Product Design
User Experience Design
User Interface Design

Project overviewDgraph Cloud is the only native GraphQL graph database built for the cloud. The product targets two main user groups: app developers who need flexibility working with GraphQL, and C-suite executives striving for scalability.

Current metrics showed that drop-off rate and time to first value is below industry standards. A strategy that considers true user goals – focusing on outcomes instead of features, is of utmost importance.

My role
As a Design Lead, I contributed to the company's growth in a variety of ways:

  • Developed a brand presence from scratch
  • Created the product's UX/UI
  • Built up the design system

Outcome overview

dgraph cloud login screen

Reduced Dgraph Cloud's onboarding drop-off rate by 8%.

Increased free trial to paid conversion rate by 23%.

Increased user retention (eight-week average) by 55%.

Initial Problem Discovery

More than just getting users into the door

There was no problem getting new users in the door. Dgraph Cloud sign up was growing at an average of 63% per week. Yet at least half of those new users were not launching a backend (next step down the funnel).

At the outset of the project, the team decided to rethink the onboarding process in attempt to bridge the significant drop-off between the two steps.

dgraph cloud login and launch a backend screen

Dgraph Cloud's funnel including Login (top) and Launch a New Backend screen (bottom)

launch a backend screen showing the 1MB data transfer per day limit

Dgraph Cloud's free tier that limits user's usage to 1MB data transfer/day.

Research: Customer Calls

Identifying the blocker

Imagine only given one chance to launch a project to test out a tool. You'd probably take a step back and think it through before you act on it.

Through 11 customer calls with users who left their accounts empty, we discovered that developers were saving the 1MB data transfer per day limit to launch their "best project". There's an added burden on the users that the product failed to take into consideration.

Research: Competitive Analysis

Diving into the developer world

As a designer solving a problem in the developer space, competitive analysis helped me understand what workflows, concepts, and interaction paradigms my target audience are already using.

The goal here is not to re-invent the wheel but be purposeful in implementing elements and flows that would benefit our users the most.

4 logos inlcuding mongodb, neo4j, elastic search, and timescale

List of companies explored during competitive analysis.

Challenges

Challenge #1:

How might we instill confidence in developers to create their first backends

Users are in the door but they don't act.

Challenge #2:

How might create a familiar environment for app developers who are specific in their tooling

"Yet another tool to learn" is the last thing we want.

Planning

Finding the right place to instill confidence

Through user journey mapping, two things stood out to me:

  • The existing guided tour is great at providing instructions on what buttons to click but it doesn't actually help developers decide on what projects to create
  • We're asking before we're providing – at first launch, a user is prompted with a modal asking if they would like to upgrade to a paid plan. We are assuming that users are able to make a decision without getting to experience the value we provide.

Giving users more than just FAQs

Apart from giving users a series of how-tos, I implemented an App Store that provides a list of "one-click to deploy" sample apps to get the users started.

It was also communicated upfront that sample backends can be deleted anytime to free up the 1MB data transfer per day limit.

app store screen
mixpanel metrics

Developers typically want lots of control

Metrics measuring the success of our existing guided tour shows that users are actually not more likely to launch a backend having gone through the tour.

As a team, we decided to put less emphasis on the current guided tour yet keeping it available for any users who still finds it helpful. The redesign of the guided tour is in progress, but that's for another project.

Don't ask before you give

We can't expect a user to go from free trial to paid without having to experience the product. A more subtle nudge at the right time was critical for our conversion rate.

This means that we removed the upgrade modal right after account creation and incorporated incentives like greyed out features to drive conversion.

6 dgraph cloud screens

If I were to only share one thing I've learned

Developers often have somewhat different requirements and expectations compared to business users and everyday consumers. To design a successful developer product, understanding the dev world is crucial. There are no shortcuts.