Mobile Coach Marks

Role:

I lead the research, design, and development for this feature.

Setup:

The goal of this project was to come up with a light coaching system for first time users. We also considered how we could build a visual language for adding additional coach marks to our mobile app as new features were added.

Process

Understand:

We had gathered a sufficient amount of feedback from existing users about confusing or unclear interactions in the mobile app. For this project I worked closely with our Construction and Operations team to identify key screens where coach marks would improve the user's experience. To build on the feedback we had from customers,  I shared a master flow of the mobile app I had made with the team to also get their feedback.

Ideate:

After identifying some key sticking points across the app, I researched different ways other apps used coach marks for first time users. I also referenced some examples on GitHub and worked with our engineers early on to figure out how this feature could be implemented within our existing mobile app.

As a team we agreed that we wanted the coach marks to be accessible, but also minimal because ideally a user would be able to use the app without added coaching. After mocking up coach marks for screens across the app, we honed in on a short list of interactions to move forward with: assigning workers to crews, adding cost codes, and adjusting hours.

REFINE:

The lo-fi screens helped us to quickly identify which coach marks would make the most impact for users. With a narrowed scope, I moved into high fidelity screens and shared both directions with the team for their feedback. Ultimately we decided to use an overlay with cutouts to highlight key actions for each screen.

Implement:

With the visual style established, I mocked up a rough prototype to share with the Product and Engineering Teams along with the final specs. The coach marks are triggered when a new user first opens the app, and are available for future reference in the top of respective screens by tapping the '?'.

Summary & Lessons Learned 

In the end the 'Notes Screen' design needed to be cut for time and resources. I wish we could have kept it because users don't quickly realize where they can add notes and photos, and I was curious if this would have helped. 

I enjoyed working on this project because I was able to both look at the app as a whole and also think about implementing a coach mark system that we could use as the app grew. At the time I worked on this project, I was still relatively new to Rhumbix so I think this was a great chance to really dive into the flow of the app and also empathize with first time users.