[Usability] Shorten onboarding steps by combining content - Githubissues

guardianproject / haven

Haven is for people who need a way to protect their personal spaces and possessions without compromising their own privacy, through an Android app and on-device sensors

https://guardianproject.github.io/haven/

GNU General Public License v3.0

6.63k stars 727 forks source link

[Usability] Shorten onboarding steps by combining content #226

Open glenn-sorrentino opened 6 years ago

glenn-sorrentino commented 6 years ago

Onboarding and configuration presents a lot of steps for a user to get through, and the content of some screens can be merged to reduce the total number of screens.

A byproduct of shortening the flow is that it creates an opportunity for stronger typographic hierarchy by using the home page for the only H1, and the following pages using paragraph styles with a secondary font-size.

Flow

The current flow is: Home > Message > Configure > Message > Phone > Done > App

The proposed flow: Home > Configure > Phone > App

UI

Home Screen

The designs below combines the UI text from the third page with the home screen.

Current Home Screen: home current

Proposed Home Screen: home after

Phone Number Form

The designs below combine the content from the fourth page with the phone number form.

Current Page 4 of Tour: tour - page 4

Current Phone Number Form: tour - current phone number

Proposed Phone Number Form: tour - proposed phone number

Style/CSS

Updated font sizes: H1: "Welcome to Have" heading is larger font size for stronger typographic hierarchy. Was 96pt, now is 120pt/7.5rem

Paragraph: 80pt/5rem Color: #BBDEFB

Pages from the Design Audit:

Current Flow:

Proposed Flow: propsed flow

audit page 11

n8fr8 commented 6 years ago

This all makes sense to me.