Improving User Experience through onboarding copy

Loko
Introduction
Betty Gardiner

In this personal project, I collaborated with a friend on their university coursework to polish up the written content on their mobile app concept. It was a great opportunity for me to learn about different UX design principles and refine my skills in transforming technical topics into digestible content.
‍
The app idea is called Loko and uses artificial intelligence and augmented reality to improve home interior decorating. I’ve attached a promotional video below to provide more context.

Loko Promotional Video

Analysing the onboarding

My friend tested their app with potential users and received some feedback on the onboarding process being overly confusing. During my research on the topic, I found that around 50-75% of users will abandon an app during the signup flow. As this section is so important, I decided to focus my efforts on improving the content here to hopefully improve clarity.

As I walked through the prototype’s onboarding screens, I noticed that the large amount of text was distracting. It drew the audience’s attention away from the interesting visuals and made it harder for them to grasp the vision of the app and how to use it.
Initial Improvements

My first task here was to make the content more digestible. I wanted to prevent users from skipping the information or abandoning the app altogether. To achieve this I added an eye-catching title to better communicate each screen's purpose.

Next, I reduced the amount of body text in each screen whilst keeping any instructive elements and holding onto some creative flair in the language. This allowed for the critical information to be immediately readable and yet entertaining enough that users don’t become uninterested.

I then suggested we move the continue button further down to a more comfortable area for users to touch based on a typical phone holding position.

In a more contentious move, I also proposed the removal of the skip button. That way users must read through the explanation of the app before moving forward.
Error states
My next improvement idea was to include some error states as this hasn’t been considered initially. As shown here, I added helper text informing the user when they've not added a password.

Adding character
I felt this app excelled in it’s visual style and playfulness, but this wasn’t reflected in the language. As we moved further into the onboarding process, I continued to reduce the body text and increase personality. I made the content friendly so that adding details into the app feels more like a conversation than a cold input field.

Tooltips
Artificial intelligence and augmented reality are tough concepts for the ordinary user to fully understand, so a focus on UX was necessary. To ease the audience into these technological ideas, I suggested we add help buttons throughout so that users have access to more information. Here I focused on content that was descriptive yet concise to ensure the ideas were fully understood.

Building on this, I also recommended that introductory pages were added when the user first opens a feature. This helps contextualise the app's idea and is a helping hand when it comes to using the AR functions.

Conclusion

The changes I made did have a positive impact. My friend was able to re-test the app in its new state with some of the original participants, and many of them reported feeling more confident with the onboarding information and felt the changes were beneficial.

Working on this live brief helped me hone my skills and develop my understanding of a lot of UX principles. I feel I achieved success on this project by not only helping a friend improve their university coursework, but also by building upon my own knowledge.