Increasing developer user adoption with Social Sign-On

The Challenge

Users could only sign in either with their email address and password or by using Single Sign-On (SSO).

Pain Points 💢

  • Having to create a new account

The Solution

Provided the user with the ability to sign in/up to Capella without needing to create a separate account with email address and password credentials, thereby leveraging their existing social account instead.

So, how would the feature work?

Users would be able to sign in/up to Capella with the additional options of either their Google or Github account.

What design changes were needed?

  • Modifying the layout of the log in/sign up page to accommodate the addition of two social account buttons
  • Extending the existing button component in our Figma design component library to include use case where a logo was accompanied by some text

The Outcome

First-time users could create an account and sign in using their Google or Github accounts. This halved the number of steps that had to be taken to get started with Capella.

Key features of the solution:

  • Reducing friction for first-time users by allowing them to use existing accounts rather than having to create a new Capella one
  • Leverage Google and Github authentication for users
  • Speeding up time-to-value for developers
  • Improved parity with competitors in the NoSQL database space

Role
Lead UX Designer

Work Completed

  • UX review of log in/sign up page
  • Research of log in/sign up pages of competitors in the same space (MongoDB Atlas, CockcroachDB etc.), as well as companies within the same sector (Github, Jira, Slack, CircleCI etc.)
  • Research into proposed social accounts to include
  • Collating best practice information for styling of social account icons to meet their respective guidelines
  • Identified that Apple ID could be omitted for the first iteration as it is often used more by consumers as opposed to developers which was the main target audience
  • Proposed design changes to layout of log in/sign up page to accommodate additional social sign on/in options
  • User Flow Diagrams
  • Low Fidelity Wireframes
  • High Fidelity Prototypes
  • Presentation of designs to multiple stakeholders including VP of engineering, director of product management, product manager, engineering manager, and engineers