Exploring The Existing Application

The team first started by diving into the application identifying features the user interacts with when using Invokes application. To start, we identified the primary functions of ErGo. After identifying those, we went through the application and found which interactions were key in enabling those primary functions.

Key Features Identified

Injury Detection

Utilizes gyroscopic and data collection technologies found in smart watches.
Detects injuries and tracks "micro injuries" that may not be immediately noticeable but can lead to significant injury over time.
Tracks "near misses" which are events, actions, or behaviors that may lead to an injury.

Claim Filing

By using the “Report Injury” function in the application, users can use ErGo to streamline the process of filing a workman’s compensation form, rather than the more time-consuming analog process currently in place

Track Activity Data

Users will be able to look at the biometric data collected throughout the day on ErGo.
These can include “Calories Burned”, “Steps Walked”, and even ErGo-Exclusive metrics, such as “Safety Score”.

Safety Score

Based on calculations made from data collected from the Apple Watch, ErGo outputs a composite “Safety Score” for the user.
This is processed daily, and the user will be able to look at past safety scores to find trends in the data.

What are the steps needed for the onboarding process?

The team decided that to provide the best onboarding experience for the user, onboarding for ErGo should happen in two phases.

Introduction Slideshow

Upon logging into ErGo for the first time, the user will be presented with a short, functionality oriented, slide-deck to explain the key features of ErGo.
This is processed daily, and the user will be able to look at past safety scores to find trends in the data.

Guided Walkthrough

After agreeing and continuing from the introduction, the user will participate in a guided walkthrough of the application. This will go into the specific interactions the user will have to utilize the key functions outlined in the introductory slideshow.

Onboarding Design

Our team looked at multiple applications evaluating their onboarding as well as articles that focus on the best practices of onboarding. We each added our own insights to our Miro board, evaluated those insights as a team, and then took note of our “Star Points” which are things we wanted to consider for our own onboarding design.

Onboarding Workflow

Once we had an idea of what we liked in onboarding and a flow to work with we wanted to immediately start sketching to get our ideas on paper and as a visual. Each team member sketched out their own idea and at the end, we came back together and gathered key ideas from each of our own sketches, and combined them to create screens that we all desired.

Wireframe Design

Once our team evaluated each other’s sketches we divided it into Miro to do some wireframe design to see the screens even more visualized out. This allowed us to focus a lot on the layout of features and base UI for the onboarding.

Seeing the design in a digital space helped us to more critically evaluate how our design will look in practice. We mostly liked the layout and structure of these designs, but we wanted to make adjustments to the size and spacing of the text, as well as the final screen. Going into our final design, we wanted the “Know your Activity” screen to be more similar to the other screens in our design.

Final Design

Once we decided what changes we would make to the wireframe designs, our team designed our final proposals in Figma. Then we were able to use the wider range of tools to design our screens, implementing a more precise layout, graphics, and color scheme. Below are the final designs that cover onboarding for the app's features, safety scores, and recent reports.

The other half of the onboarding includes more detailed information specifically about the features in the app and more about navigating the features rather than a mental model of the app in general.
‍
We chose to walk users through the actual screens they would go through with annotations on top while occasionally blurring out irrelevant parts of the screen. Users can access these tutorials by pressing the “?” icon at the top of the dashboard. The three areas of the app that have tutorials are Safety Score, Recent Reports, and Report Accident.

Invoke Innovations