Skip links

CHALLENGE

Derive has a new hardware device called ‘VQ’ which plugs into a vehicle’s OBDII port. This allows parents to monitor their teen’s driving habits, location and mobile phone usage (which is not allowed while driving). We’re developing a native mobile app for the teen driver that will need to be paired with the VQ device before they can start driving. The challenge is to design an onboarding experience for this app and a home screen the teen will see once they are ready to drive.

SOLUTION

The onboarding experience for Derive’s new mobile app for teenage drivers was designed specifically to meet their needs. The onboarding process ensures that each feature in Derive’s ‘VQ’ is clearly explained by simplifying the statements and including interactive images. In addition, it’s important for new users to learn about the advantages of VQ so they must go through the onboarding pages before they can register. By demonstrating the benefits of VQ, it will help teens take advantage of its features and empower them to drive safely.

MY ROLE

UX/UI Designer

TOOLS

Procreate
Adobe Illustrator
Sketch
Principle

PROCESS
01 RESEARCH

Product Research

Target User Research

Competitor Usability Research

02 USER PERSONA

New Teen Driver

Experienced Teen Driver

03 USERFLOW
04 SKETCHES

Selecting Profile

Onboarding Pages

Homepage

05 STYLE TILE

Colors

Typography

06 UI MOBILE DESIGN

Mobile Landing

Onboarding Pages

Profile

Invitation Page

Initiate Driving

DESIGN OUTCOME

Positive and Empowering

A positive and engaging onboarding experience that help teens take advantage of VQ’s features and empower them to drive safely.

RESEARCH

Learn the Audience

It was important to understand the product, the users, and the usability of similar products to help provide the best solutions.

Product Research

Goal:
Understanding the product by learning its goals and capabilities.

 

Product Capabilities

• Mobile and vehicle pairing
• Device can lock and unlock the vehicle
• Seatbelt must be fastened to start the vehicle
• Locked phone during driving
• Real-time speed control
• Geotracking and geofencing
• Driver feedback results

Target User Research

Goal
Learn about teenage usability and their behaviors.

 

Key Findings

• Constantly multi-tasking with their device
•  Lower reading levels
•  Impatient on dull content, easily lose interest
• Moves too quickly if: too much words, tiny fonts, confusing
• Minimizing distractions is a constant challenge
• They don’t like to read a lot on the web
• They don’t blame themselves, they blame us

Competitor Usability Research

Goal:
Learn about competitor’s onboarding usability.

 

Key Findings

• Landing page directs the user to an onboarding tour
•  Swipe left or right to navigate
•  “Skip” options
•  Fixed login on pages
•  Link to the store to learn more
•  Animation/Interactive pages

CONTENT STRATEGY

Designing with a Purpose

Each process was organized based on the underlying facts about teenagers usability habits combined with VQ’s goals to generate ideas. Having a deeper understanding of the users, I was able to provide four solutions:

1. Clearly explain the product’s capabilities by simplifying the statements.

2. Design for teens to learn by designing interactive (non-boring)  elements.

3. Reassure the teen that the product is a positive experience.

4. Keep teens focus by disabling skipping pages.

User Personas

Two personas were created to identify how Derive’s VQ fit in their lives and how we can meet their needs.

User Flow

Organizing the user flow first before designing anything helped visualize the pages that needed to be designed.

Wireframe Sketches

Sketching the wireframes helped identify which elements were necessary to incorporate and which ones could be disposed or adjusted.

USER INTERFACE

Positive Engagement

I designed the pages with the intention of providing a positive experience to learn. I recognize that VQ will be an adjustment for a teen driver, therefore the featured visual elements ensure to communicate that VQ exists to empower them to drive safely.

Style Tiles

Recognizing Derive’s brand elements and incorporating it to the app provided cohesiveness and helped reflect Derive’s values and mission.

UI Mobile Screens

By understanding the product’s goals and the users’ needs, I was able to design the onboarding experience that meets both.