Industry Design Project
Simple but Needed, Inc.
Summary: This is an industry design project for a product onboarding experience.
My role: I alone completed the research, design and testing for the project.
Problem
There is a need to improve the flow of Simple but Needed (SBN) onboarding so that users can begin using the app without needing assistance.
Solution
The updated SBN onboarding process seeks to create a better experience for clients by providing a well organized process for users to be guided through the introduction of the software and be able to quickly learn how to do critical tasks. The process used is a modified Google Ventures design sprint created to rapidly map, plan and test ideas.
Map the problem
Insights
Half of the new clients to the SBN software are not tech savvy and thus have a difficult time getting familiar with the program. New users are sent an email with instructions for creating an account and logging in, but a large percentage of them are dropping off during this process and many require extra time for training and are needing to be walked through the software.
User Journey
To learn the needs of the users and gauge a deeper understanding of where exactly most of them were dropping off, I went through the onboarding process myself as well as performed stakeholder interviews. With the input of the stakeholders, I created a journey map that illustrated the pain points.
Sketches
Preliminary Sketches
I came up with a few preliminary sketches to help decide which direction to go to build an onboarding flow. The stakeholders decided that the most important screen would be the homepage, which should allow users to see a description of the app and see if that app was configured for their account. They also prefered the idea of combining this home screen with options to have tutorial help.
From there I created a set of sketches that focused on the homepage and the options that would flow from the homepage. I came up with two options. Option “A” combined the app name, possible tutorial options, and configuration details all on a modal located on the homepage. Option “B” separated the tutorial options onto a seperate “Getting Started” tutorial window on the landing page.
Decide and Storyboard
The stakeholders and I agreed that we would focus on the first option, option “A”, that would allow users to always have the option to have tutorial help if they needed it in the future.
From there, I created a storyboard of all the screens, particularly the route that users would take if they were to use the tour option.
Prototype
Based on the approved sketches, I created a Sketch prototype of the new SBN onboarding screens. The goals for testing the prototype were to discover any usability problems in design and to make sure that users understood every step of the process. I also hope to learn what else people believe should be included in the onboarding process.
For the prototype, I added more screens to the homepage to simulate having the option of choosing each individual app. I was not given a style guide and had the freedom to change up the style for the onboarding process but I decided to keep a similar color scheme to the one that was already available on the website since we decided that the new screens were to always remain a part of the process and not just as a one time event.
User Testing
I performed usability testing for the recipe app using in-person moderated testing. The main goals of the test was to uncover any usability problems in the red route design of the app, to make sure that users understood the process, and to fill in any holes pertaining to what may be expected in a recipe app. Participants were all ages and included people that cooked at least once a week, regularly followed new recipes and were comfortable using smartphones. Five people were tested and were recruited from among friends and family.
Results from testing
What worked:
- 1. Content on the modal after clicking an app. The content on the modal was clear and understandable to people. They had various options to choose from in order to learn the product.
- 2. Clearly designed tour. Participants could easily determine where they were on the tour. The numbered steps as well as the “previous”, “next” and “X” buttons gave users indication of which options they could employ when it came time to either continue, go back, or exit the tour.
- 3. Greyed out app icons. Users reported that they appreciated having some of the icons greyed out as it served as a visual indication to help them determine what they could and couldn’t do.
Findings and Recommendations
- 1. Size of the modal. Given the large size of the modal, some testers suggested that the whole page could be used to display information after a product is selected.
- Recommendation: The current modal can be redesigned to blend more seamlessly with the homepage and tested against the current design.
- 2. Labels. Some users expressed the desire to know the name of a product before having to click it.
- Recommendation: Persistent name labels for the apps on the homepage can serve as a constant and non-intrusive reminder for the name of each product.
- 3. Success message / next steps. Feedback included the idea of having some type of success message at the end of the tour. This would be helpful to signal to the person that the tour was finished and could also include next steps that can be taken.
- Recommendation: Include a final success message that can also serve to give users suggestions as to possible next steps.
