top of page
InStep for Life—Fitness Tracker

Mobile App & Admin Dashboard UX

I worked on creating a custom fitness tracking solution for a non-profit organization with 300,000+ employees worldwide. The process involved design of high fidelity wireframes and prototypes, as well as a detailed plan that outlined the project throughout its anticipated five-phase development. The application was intended to allow users to sync with modern step trackers, monitor activity data, read fitness content, and join workplace teams. It also provided gamification with leaderboard rankings, badges, and challenges.

 

In addition to the mobile app, I designed high fidelity wireframes and prototypes for a web-based platform that included six levels of admin access. This dashboard provided data feedback catered to the admin level, management of participants, reporting options for data analysis, creating and posting content, creating and promoting challenges, and a message center.

METHODS USED:

Creative Brief, Stakeholder Interviews, User Surveys, Competitive Research, Information Architecture, Wireframes, Prototypes, Feature Map, User Story Development, Phased Development

"Big visions are realized through small steps."

MIKE GLENN

MY ROLE

I was the Senior UX Designer on this project and took it from initial concept to high fidelity prototypes. Working with feedback from the Creative Director of R&D, as well as the principal stakeholder, I created a solution for the client’s goal to motivate their employees and users to maintain better health by encouraging movement, and provide administrators with an easy-to-use administrative platform that offered all the tools they needed.

DISCOVERY: MOBILE APP

Research before design.

Benchmarking research was completed before the initial stakeholder meeting. Several competitors in the market were highlighted that offered similar solutions for the client, but they wanted to proceed with a custom application that catered to their specific needs and organizational structure. A first draft of the UX wireframes for the mobile app was also created and presented to the stakeholder to allow for dialog and fast-track the project. With client approval, I proceeded with creating a full features list and completed the information architecture with the end product in mind. Considering the needs and requests of the client, I built detailed UX wireframes and prototypes in UXPin for the mobile application.

Participant App.png

DISCOVERY: DASHBOARD

Assigning roles.

With client approval for the intent of the companion admin dashboard, I proceeded with creating a full features list, building the information architecture with the end product in mind, and allowing for key development during multiple phases of the project. Knowing the duplicative nature of the admin structure, I completed UX wireframes and prototypes in UXPin for the first two levels of admin. 

Global Admin for InStep
InStep_App_Stories.png

CREATION: MOBILE APP

Uncovering additional features.

The main stakeholder for this project had a very busy schedule and was often unavailable. This caused the initial discovery process to be fast tracked in order to complete the UX wireframes and prototypes within the client’s desired timeline. By working through the information architecture and creating the UX in detail, however, I brought to light some additional features that the client was excited to add. After compiling results from a survey of past participants in an outdated web version of this project, we gained verification that the proposed app would meet the desired needs of the participants. To fully understand all the aspects of the project, and better estimate the time and cost needed to produce the app, over 160+ user stories were generated.

InStep_Web_App_Stories.png

CREATION: DASHBOARD

Defining the scope of the project.

While working through the information architecture and creating the UX in detail, the client continued to add features that increased the scope of the project. For example, the initial version of the project did not allow for an additional breakdown of teams within a group. This added level of administration for team leaders added complexity to permissions and created a ripple effect of changes as it continued up the chain of administrative access. The addition of an online message center was also a new feature, which ended up affecting the app view for the participant. To capture the needs and permissions for each level of administration I generated over 330+ User Stories to assist in estimating project effort and expense. 

InStep_Phases_Flow.png

When I left the project for a position with another company, it was in the initial phase of development. Rough UI had been created to fundraise for potential donors, and plans were underway to work on all five phases of development. 

bottom of page