Week 6: Reading week

UXD720

---

This post is about catching up on activities and using the research and techniques to inform my wireframe designs.

Onboarding research

My focus is to take the research and learnings from the activities last week to support my sketches for the prototype. One of my main developments with the existing app is to improve the onboarding journey. Onboarding is a crucial part of the user experience, so I researched existing apps’ onboarding models to see what other companies were doing.

I had a look at the My Fitness Pal onboarding process, which is shown in five frames. It starts with a splash screen that introduces the app, and then users answer a series of questions that personalise the app. The user has to create an account before viewing their results and using the app. This onboarding is much more efficient and faster than Nutricoach. However, the app doesn’t introduce the user to the app functionality, so they might feel lost and confused when they begin to use it.

Figure 1: My Fitness Pal onboarding process (‘My Fitness Pal’ 2022).

I also reviewed the Flo app, a health app for women managing their menstrual cycle. This app includes an interactive splash screen introducing the user to the app. The onboarding consists of approximately 26 frames, primarily questions the user has to answer before using the app. Some of the frames include educational content which informs the user about specific topics. The frames include a progress bar which is great to see how far the user is within the onboarding. The interface design is clean and minimal, but the process is too long. Error messages are also included to guide the user to help them avoid making mistakes.

Figure 2: Flo app onboarding process (‘Flo Health’ 2022)

The Mailchimp onboarding process is concise. Three frames show the app’s functionality with minimal text, enough for the user to skim and move on quickly. Users can see three frames in small circles to swipe left and right. A skip button can also allow users to move on from the onboarding to log in or sign up.

Figure 3: Mailchimp onboarding process (Cibin 2021)

Reflecting on the onboarding processes, I have found that there is a need to ask a series of questions to personalise the app for the user. It is important to give clarity and assurance to users of why their data is being used to create trust and credibility (Denkiewicz 2020). In most app designs like Nutricoach and Flow, the process is unnecessarily prolonged, as this can cause users to drop out.

Summary of onboarding

• I will be implementing a set of questions grouped according to their relevance per frame. For example, the ‘about us’ category will include gender and age. Avoiding one question per frame shortens the process and number of frames used.

• Using error messages to guide the user in the journey when they make mistakes.

• Include a skip feature to bypass the onboarding process but have the same information located in the tooltips of the app features.

• Including an animated splash screen to introduce the app.

• Presenting the app functionality in a maximum of three frames

• Designing a progress bar to show the user how far they are in the onboarding process

Low-fidelity wireframing

I designed low-fidelity wireframes in Balsamiq to test many solutions and ideas. I had not used Balsamiq before, so one of my SMART goals was to experiment with new tools to develop my learning and practice. It was recommended by the tutor, who said it was great to test quick designs. I have enjoyed using the tool because it is easy to learn, and there are pre-made elements that you can easily drag and drop. One of my struggles is spending too much time on one design and revisiting the work to improve it later. However, using Balsamiq has saved me time and made me work faster and efficiently as I could create as many ideas without committing to one design.

Figure 4: My sketches show different design solutions for my prototype. I have analysed the features and added elements to help the user feel in control of the app, such as a skip button.

Reflection

I have made good progress with working towards my SMART goal 1, experimenting with Balsamiq software to design quick low-fidelity designs to test solutions. Learning new tools can open up more opportunities in the UX industry and expand my knowledge of different software. Designing from scratch is difficult, so I have used competitor research to collate ideas and get inspiration to form my designs. This is what makes a great designer. I could test more design ideas and analyse them to develop a final solution to improve my learning.

In the webinar this week, I discovered Lottie, a tool that allows you to create, edit and test animations. I want to add animations to my prototype to make it more engaging and interactive. Lottie has a plugin that I can use in my Figma files. I would like to conduct usability testing to gather feedback on my designs because it is essential to continue to evolve the users throughout the process.

References

CIBIN, K. S. 2021. ‘11 Apps With The Best User Onboarding Flow’. Wow Makers [online]. Available at: https://www.wowmakers.com/blog/apps-with-the-best-user-onboarding-flow/ [accessed 27 Feb 2022].

DENKIEWICZ, Marta. 2020. ‘6 Rules for User Onboarding’. Panacea Digital [online]. Available at: https://www.panacea.digital/2020/02/11/6-rules-for-onboarding-users-to-your-health-app/ [accessed 27 Feb 2022].

‘Flo Health’. 2022. Flo Health [online]. Available at: https://flo.health/ [accessed 27 Feb 2022].

‘My Fitness Pal’. 2022. My Fitness Pal [online]. Available at: https://www.myfitnesspal.com/ [accessed 27 Feb 2022].