Simplifying the new user flow across a family of apps

Simplifying the new user flow across a family of apps

Simplifying the new user flow across a family of apps

Client

AssistiveWare

Platform

iOS

Role

UX Lead

Date

2015 – 2016

AssistiveWare develops assistive technology software for iOS and Mac OS, creating applications for people with physical, vision, communication and reading impairments.

Proloquo2Go and Proloquo4Text belong to the same family of apps, one is used by non-verbal people without literacy, and one by non-verbal people with literacy. The first task a new user would do after installation would be to create a new user, the current flow used jargon, had many steps and was a little uninspiring.

Visit AssistiveWare →

The old 'Select Region' screen

The new select region screen

The new 'Select Region' screen

The objective

The two apps were misaligned, they shared similar screens but used different terms. The main objective was to get the two apps aligned and to make it both simpler to understand and easier to complete.

The process was very dry and not very welcoming, so a secondary goal was to explore ways to make it friendlier.

The process

The first thing I needed to do was to go through the wizard and create accounts on both Proloquo2Go and Proloquo4Text.

I performed a heuristic analysis. Capturing what each step did well and what each step did poorly. I did this on both a micro level and a macro level.

What can be improved on this screen?
How does this affect the whole flow?

What can be improved on this screen?
How does this affect the whole flow?

What can be improved on this screen?
How does this affect the whole flow?

What can be improved on this screen?
How does this affect the whole flow?

What can be improved on this screen?
How does this affect the whole flow?

The flow for Proloquo4Text was very simple, it only required a name for the new user, and voices for the active languages found in the iOS settings.

Proloquo2Go, on the other hand, is a much more complex app with a wealth of settings. You would be asked to provide the user's name, vocabulary (a way of organising the language), primary language, region, voice, vocabulary level (from basic to advanced), grid size (how many buttons you will see on the screen at once), and options which enabled you to copy buttons from previously created users (if they existed).

User flow for the two apps

Understanding the use cases

To properly assess the areas that needed optimising, I needed to understand the users and the situations that they would find themselves in when going through the process of creating a new user.

I was new to the organisation and new to the complex arena of Augmentative and Alternative Communication, so I decided to do the following.

  • Stakeholder interviews – asking colleagues about their experiences with the users, what they know about them, what they don't know about them…
  • Defining users – liaising once more with colleagues to share proto-personas, to ensure that I had understood our chats.
  • User interviews – using social media to reach out to parents and professionals to chat about the apps that they use.

From speaking with users I was able to understand the actual problems that they were facing. At first glance the 'new user flow' was not causing too many issues, however, a few key insights would help to narrow the focus:

  • Clarity of decision – All of the parents, teachers, and speech-language pathologists I spoke with were unsure if they were choosing the 'correct option' on many of the screens. They weren't sure if they were going against clinical recommendations or not.
  • Technical know-how – Many of the users were not hugely tech-savvy, they may only use the iPad purely for Proloquo2Go. They may not use any other apps, and definitely, do not speak the language of developers.
  • Highly stressful – For some parents especially this is a highly stressful situation. You are pinning your hopes on this app to help your child communicate. 

With these insights, I wanted to look into ways to offer 'smart default' options, which should work for most users. I also wanted to look into ways to reduce steps, to try to lighten the mood (if possible), provide greater clarity and reassurance throughout the flow, and look at the language used throughout.

With Proloquo4Text using two of the same screens in the Proloquo2Go flow I decided to put my focus purely on Proloquo2Go and to ensure these two screens would map to both apps.

Assessing the flow

The original 'new user' flow had some screens that seemed really disconnected, for instance, the 'vocabulary' choice was made on the second screen of the flow, whereas the 'vocabulary level' did not come until the sixth screen.

'Language' and 'region' were used primarily to choose the language of the vocabulary and to ensure that local dialect was considered. Secondly, it would suggest the voice to use based on your locale.

There was no way to create a bilingual user from this initial setup, and the suggested grid size would ignore the screen orientation, thus promoting bad practices.

I sketched out an early flow for discussion.

Sketch of the new flow

Sketch of an early iteration of the new user flow

With Language and Region being so closely related, I wanted to explore ways in which this could be merged into one. I also wanted to bring Vocabulary and Vocabulary Level closer together, so they weren't as disjointed as in the current flow. Finally, I wanted to discuss gender. 

I knew that this may be a difficult area but it could open up gender-specific vocabulary rules, which may be beneficial for the end user.

As the users who I would eventually test these ideas with were not very tech-savvy I concluded the following:

Base screens on the familiar – for some users, Proloquo2Go is their only app on their only device. Familiarity could be beneficial here, it could make the app feel less daunting and more trusted.
Jump into high-fidelity – to test the above it would not work with sketches or low-fidelity prototypes.

I focussed on the familiar. Wiped an iPad, and started from scratch. This would be what I based the design on.

Screen from setting up a new iPad.

Familiarity was key to reduce stress

Early iterations of a high-fidelity mockup.

Early iteration of a high-fidelity mockup

As expected, the early iterations prompted some good discussion about 'Gender'. The interesting thing that I learned here was that gender was seemingly not important to a number of AAC users. My interpretation here was that the voice that they were drawn to had very little to do with the sex, and more to do with how the voice sounds to them.

I received a more positive reaction from the way I tackled the issue with the 'Grid Size' that was being selected not fitting the way that the user held the device.

I introduced a 'Choose a preferred orientation' step which would then show only grid sizes that matched the orientation you selected. I also explored ways to integrate this with the 'Select Grid Size' screen, but the information density was too great and it ran the risk of reducing clarity.

The new flow began to take shape:

Create a user → Select a Language and Region → Choose a Voice → Choose a Vocabulary → Choose Vocabulary Level → Choose a preferred orientation → Select Grid Size → Advanced Setup → Welcome

Create a user

With familiarity being key, I recreated the initial screen with a more familiar looking one to anybody who has set up an Apple device before. The tone of voice was warmer and more instructive. 'User Name' became 'Create a user', and the placeholder text 'User Name' became 'Name of person using Proloquo2Go'.

Old Create a new user screen.

Old 'User Name' screen

New Create a user screen.

New 'Create a user' screen

Select a Language and Region

There was an opportunity to merge these two screens, and to also look at smart defaults. 

Technically we could look at the device language and the geographic location to suggest the locale by default. In the new screen below this is what a user who has an iPad configured in English and based in North America would see. 

The text has also been refined and restyled to provide clarity to bilingual users.

Old version of Choose Language screen

Old 'Language' screen

Old Choose a Region screen

Old 'Region' screen

New Language and Region screen.

New 'Select a Language and Region' screen

Choose the right Vocabulary and Level

Other screens were less about reduction and more about helping the user to make smarter decisions. Across many screens these smart defaults were used to reassure the user that this setting would be fine for the majority.

It also allowed AssistiveWare to provide clinical guidance. 

Old choose a vocabulary screen.

Old 'Vocabulary Level' screen

New choose a vocabulary level screen.

New 'Choose a Vocabulary Level' screen

Choosing the right grid size

Proloquo2Go was primarily being used in one orientation, either portrait or (mainly) landscape. During setup, the user was given the opportunity to select grid sizes which were not suited to the orientation of the device. This would cause users to make poor decisions and select grid sizes that were best suited for the other orientation.

Another goal was to allow the user to see the full grid, so they could get an idea as to what words would be present when choosing this grid size. In the previous version, a large grid select list would take up the middle portion of the screen which severely limited the view. On the iPhone, this list took up an even larger area.

I introduced some friction to allow the user to consider how they would use the app. This also enabled me to use the 'communication area' of the app to place a stepper. As the user tapped the plus or minus buttons the grid would automatically refresh.

As with other screens, we wanted to promote a smart default. We found a number of users would immediately choose the smallest grid size. This made the buttons easier to tap but it also severely restricted the vocabulary available. Of course, some users with fine motor issues may need to have large buttons, but we wanted to give the opportunity for users to see how tappable these buttons were at a larger size.

Old version of the Choose a Grid Size screen

Old 'Language' screen

New choose orientation screen.

Old 'Region' screen

Alternative choose a grid level screen.

New 'Select a Language and Region' screen

A warmer welcome

There is nothing more daunting than a text-based welcome which directs the new user to a manual.

Proloquo2Go is a complex app and the onboarding experience needs a lot of refinement. This was out of scope for this project, so the goal here was to be warmer and get the user into the app quickly and easily.

In the previous version, the 'Finish' button was not clear, it became a 'Go to New User' button, which was not consistently placed with the rest of the journey. Greater clarity was provided here, but more importantly, the new user was welcomed by their users' name and a large welcoming symbol would greet them and entice them in. 

Old Welcome screen

Old 'Thank You' screen

New Welcome screen.

New 'Welcome' screen

Testing the design and flow

Using the screens created a prototype was created in Sketch and people who were new to Proloquo2Go were sourced for testing. I also wanted to include users who were not as familiar with Augmentative and Alternative Communication to ensure that text was clear and the flow felt natural to those with even less experience, but time and internal restrictions didn't allow for this. 

The results

Quantitatively it would be tricky to measure the success as smart defaults can't tell us whether or not the user would need to make a change. Although we could measure how many new users use the 7 x 11 grid (our recommendation), there could be a very good reason not to accept our recommendation.

Qualitatively, those in the Support department reported that they received no tickets which related to the new user flow. The simplicity and invisibility of the flow allowed us to deem this a great success.

Links of interest from the case study:

© 2018 Dean Birkett

Follow me on Twitter
Connect with me on LinkedIn