APPROACH

To address the challenges of creating an onboarding process for FitLoop, I followed a specific UX structure that aligned with the project's goals. I began by making a teardown on the current onboarding process. This included taking screenshots of each section and adding in annotations that were both good and bad qualities of the current version. This helped to understand the current design elements and what could be improved or removed completely. Next, I looked at multiple fitness trackers onboarding processes and compared what elements they had in common. This was completed in a similar process of taking screenshots and grouping different sections together. This step was important since it helped see what information is important to include in the personalization. I then created a proto persona to get a better understanding as to why someone might use this fitness app and what personalization would be the most helpful for creating a routine for them. Afterwards, I created a flowchart with how I wanted my redesign to look. This included how the user interacted with the app, how the app responds, and the options on the screen. This was to have a structure to follow when creating the hacked prototype and to see what screens I had to mash screenshots and what elements I needed to add in.

Once I was finished with the flowchart, I added all my screenshots into a Figma design file and started creating the prototype. I added in the existing onboarding pages that were included in my flowchart into the order I wanted them to be in, then added in the new screens. The existing screens included the goals selection, existing workout training, accessible equipment, the personalized plans, and creating an account login page. Other design elements were added into most of these screens so that the personalization could be improved and provide good outcomes. The newer screens include a basic information screen, limitations, and creating an account right away inside of going into the profile settings to do it. Once all the screens were mashed together with any other design elements added into them, I started to connect them with the prototype function in Figma. This was so that it could become a clickable prototype and simulate how a user would use the app by tapping on the button instead of looking at each screen side by side. Throughout this structured process, I created a user-friendly onboarding process that achieved the project's goals of providing a way to collect personalization to create a workout routine specifically designed for the user.