The Challenge

To solve the problem of users accidentally signing up for the wrong type of account.

My Role

I was a Product Designer on a team of designers and was involved in all phases of the project. I conducted user interviews and user testing throughout the project. I executed the website prototype in the lo-fi phase and both mobile iOS and Android prototypes in the hi-fi phase.

Timeline

12 Weeks

Platform

Mobile (iOS and Android) + Web

Take a peek at the final prototype for the HOVER iOS app.

Understanding the Users

My team and I wanted to understand both of HOVER’s target users: contractors and homeowners. We conducted interviews with existing users of HOVER to find out how they use the service. Our goals were to find out if they knew what account type they had and if they understood the benefits of HOVER.

Key Findings:

• Both Homeowners and Contractors are unclear which account type and pricing plan they were on.

• Contractors use the HOVER app to take photos of a client's home.

• Contractors make estimates and view measurements on HOVER's website.

• Contractors use the 3D model to show customers what materials choices will look like on their house.

• Homeowners are not sure of the benefit of the 3D model and were not familiar with the customization tools.

We concluded that and homeowners have very different needs and goals and created two personas to inform our design decisions.

Comprehension Testing with New Users

After talking to existing users, we wanted to learn how the current onboarding process experience was for new users. The goals of our comprehension testing was to see if new users knew what account type they were signing up for, if they understood the benefits of the service and if they knew how to add a new property. We conducted testing on both the app and the web onboarding flow to understand the pain points that users encounter on each platform and to ensure consistency of design between these platforms.

We grouped our insights in an affinity map to see where users were having the most issues.

We identified 4 pain points from our comprehension tests:

1. Users didn’t know what the HOVER Pro option was (or would overlook the pre-selected option for HOVER Pro).

2. Users didn’t understand if HOVER was meant for them after going through the app/web tutorial due to mixed messaging.

3. Users were unsure about how to start the process of getting their own 3D model and/or measurements.

4. Users were confused by the properties that were already populated in the app/web welcome screen.

Generating Hypotheses

Our team made hypotheses about improvements we could make to target the pain points we found from our research phase. These hypotheses fueled our design ideas as we moved on to the lo-fi stage. 

Our 3 hypotheses are as follows:

If we;

1.  show the different account types upfront, the user will be able to identify which account type they have correctly.
2.  educate users based on their identity, they will understand how they can benefit from HOVER.
3.  have an in-app tutorial, people will understand the features, how to add their own property and understand the example properties.

then we will meet our goals of users users signing up for the correct account type and increase metrics of users to moving on to the photo-capture process.

Mapping Task Flow

After making our hypotheses, we split up into groups and mapped task flows to explore how our hypothesized solutions could work together to accomplish our goals. Our final task flow highlights our decision to split the onboarding flow to serve each type of user directly so that they have a clear idea of the benefits that the app has for them.

Design Studio, Wireframe, Iterate

We began our ideation stage with a design studio to explore possible ideas for the UI of the Hover app. We voted as a group on what we thought were our best ideas and diverged to produce lo-fi wireframes for the app and web onboarding flows.

We converged and iterated on our wireframes based on group feedback and made sure to have consistent styles across all screens for our app and web lo-fi prototypes.

lofi ios prototype

We performed usability tests on our mobile and web lo-fi prototypes with both target users and measured them up against the existing onboarding process.

Overall, we found found that our prototypes had fewer issues when compared with the existing website and app.

Successes:

• Ability for user to self identify correctly improved (Homeowner vs. Professional account).

• Understanding of how Hover can benefit the user improved.

• Ability of user to identify what they can access (3D model, measurements) in the app/website improved.

• Understanding of how to begin the photo capture process increased.

Areas of improvement:

• Some users were still confused about the different account type (Professional vs. Homeowner).

• Some users were still not clear about the example properties and what they were.

• Most users missed the option to download the app directly in the web onboarding flow.

• Ability for users to change which account type they are signing up for, in case they began with the wrong account type.

• A way to encourage users to add their first property if they didn’t do it the first time they signed into the app.

For our hi-fi prototype we made changes based on our lo-fi validation findings and fine-tuned our visual design to stay in line with HOVER's current branding.

We used Marvel for our iOS and Android prototypes.

Sign-up flow:

The sign-up flow begins with the user self-identifying to ensure that they enter the correct flow so that the relevant information can be collected by the app.

Education flow:

Professional and Homeowner users are educated through a series of screens on the benefits of HOVER.

In-App Tour:

Users engage in a short tour upon the first time entering the app. Professional users and Homeowners have a slightly different messaging to meet their specific needs as we learned from our research.

We approached the onboarding for our website design a little differently since users can't upload any new properties via the website. We focused on translating our app design decisions to mirror the web onboarding flow, as well as clearly indicating to users that the app is the only way to add their own property. In terms of user education, the current marketing site serves as the education flow that we included in the app, so we didn't include this in our web design.

Hi-Fi Validation

For the final step in our process, we needed to put our designs in front of users to find out if our changes made a difference. We had users perform certain tasks and compiled them to yield the results below.

Hi fi mobile validation results

Success!

We validated the mobile prototype with 5 homeowner personas and 5 professional personas and our web prototype with 4 users. Overall, we succeeded in meeting our project goal for correct self-identification with 9/10 users identifying correctly during the on-boarding process for mobile and 4/4 users for web . The other areas that we worked on to improve the on boarding experience also yielded positive results, with room to improve on communicating the direct benefits to the user based on their persona.

Conclusion

In this project I learned how to work with a large team, converge all our ideas, iterate on our designs and test ideas frequently and rapidly. One of the most important things I learned was the value of splitting up work and constant communication. Having a good relationship with my team members ensured that we were making the correct updates and that our designs would align when we converged.

One major frustration early on in this project was that the scope was hard to nail down a since the team had a lot of ideas on how to improve the app. During the research phase we uncovered many pain points beyond our scope, so we initially had trouble understanding where the onboarding process ended. As a team, we were able to hone in on the major pain points and found our way again after much discussion and debate.

In the end, our hard work paid off as the client was impressed with the solutions for their web and app onboarding experience! They liked that each solution was well thought out, backed by research and tested with users to validate our design choices.