UI & UX
Our team was tasked with designing, developing, and deploying a desktop oriented onboarding process that allows users to have an easier experience onboarding for the PORTIERO platform.
To better understand the needs and expectations of the target audience, the design team conducted both quantitative and qualitative research. A survey was distributed to existing customers of the current user base to gain insights on the current pain points.
Our Role on the project
Designing and building a new platform based around new technologies such as augmented reality removes all forms of familiarity with common applications. Our hypothesis is that AR is new and confusing to the majority of users.
“We believe that as we push the boundaries of what the technology is capable of as well as the UI simple enough that anyone can open the app and get started”
We know from previous studies and experience that the onboarding process has a direct effect on retention rate. Popular team collaboration application Twine reduced their drop-off rate to 30% from a whopping 65% by rewiring their onboarding experience. According to a study by Business Insider, it takes just three seconds for someone to determine whether they like you or not. All sorts of things, including intelligence and trustworthiness, are decided within this short period, says UX Booth.
We set up multiple personas based on the user research we refer to several times throughout the case study.
Personas are built with scenarios that identify a realistic goal or problem while using the application. Personas focus on 3 common characteristics:
These characteristics will drastically affect the design decisions we develop.
Spending some time looking through the persona’s and diagnosing the pain points and motivations from each helped us to understand, empathize, and adapt design decisions. This process helped influence the important development of crucial needs and functionality that may have been missed.
User research and person creation brought up the users main needs, goals, and behaviors. Therefore, we found that the main issues in our design decisions needed to solve were:
Based on this information, we were able to create user stories and define the MVP
We have created several user flow diagrams from every step of what the user can do in the app. From signing in to the app for the first time to checking other users' artwork. These flow charts help map out exactly what a user will go through.
We sketched several paper wireframes that allow us to draw out as many ideas as possible with the knowledge of the required elements to the applications design based on users goals, needs, and frustrations. We took these paper wireframes and built digital versions in Figma to build interactive wireframes for test groups to well…test.
We took our original wireframes and turned them into a black and white prototype in Figma where we iterated on feedback and defined design themes, and visual hierarchy
After a few iterations and multiple tests we designed the final screens with Figma We conducted a final A/B test on some elements we were still unsure about during that process we finalized, defined, and implemented the final design patterns, elements, and colors.
Our goal was to make a simple, cohesive, and unique onboarding experience. We know that onboarding can be boring, tedious, and unoriginal. We believe we were able to build something that is none of those things.
Test, Test, Test. We tested with users in person, online, users who haven't used PORTEIRO, users that were the first to use PORTEIRO, and anybody in between. We tested this onboarding process so many times and we walked away learning more and more on how to make the product better every single time.
Boring can be fun! When you first hear about designing a new onboarding process most wouldn’t be too excited. Talking with the founder about his original onboarding problems allowed us to start in a direction that was creative and unique rather than settling for the same old sign up form. The mundane can be different.