VoNo - App Redesign

VoNo is a memo app with 4 functionalities that allow users to easily save their ideas, or send them to their or others' emails with just one click. VoNo is most often used by busy people in the 20-45 age group, who like to keep their ideas organized and want to quickly take notes while performing other tasks. The core ‘memo’ functionalities include the following type of memos:

Voice-to-Text

Voice

Text

Photo

Improve the UX/UI of the app by:

Completely change the visual style

Provide an updated version of the home screen

Present an improved memo sending flow

In its original version, the app has a settings icon that opens a big list of options, from settings to information about the PRO version of VoNo. I decided to turn this section into a drawer menu, reorganizing the information and grouping then under dropdown lists.

The original version of the app doesn’t have a home screen that works as a starting point for the navigation. The app opens directly in one of the functionalities.

In this improved version, I created a new home screen that welcomes the user and let they choose how to start.

The Voice-to-text is highlighted as it’s the most used function

The user can access the last memos

There is a CTA inviting the user to subscribe to VoNo PRO

What has changed for Ana?

She can now choose when to start recording her voice noite

She is now able to create e-mail groups, that she can use later

She can add all the recipients and send the voice note to all of them at once, instead of sending it individually

What has changed for Ben?

Ben opens the app and goes to the text memo section without being interrupted by the voice memo automatically recording.

He is now able to create e-mail groups, that he can use later

He can add all the recipients and send the voice note to all of them at once, instead of sending it individually

And this is how the new sending flow looks like:

From the homepage or from the bottom nav bar, the user arrives at the functionality screen (1).

After tapping the icon on the screen, the user can start recording their voice memo.

The icon is now green (2) and indicates the recording is active as the sound elements are animated.

The user can pause the recording by tapping on the main green icon, and it resumes when tapping again.

After clicking on the NEXT button (2), the user arrives at the sending screen (3).

From this screen, the user can preview the voice memo, share, download, discard, or save it.

The user has the following options:

Defining a design system was key to establishing a consistent visual language across the app. It not only benefits the internal team by saving time and improving efficiency with the pre-established components, but the consistency leads to a more cohesive user experience, making it easier for users to understand and navigate the product.

Having a little bit of information on the target was important to having a reference on behavior, lifestyle, and more. The first version of my redesign was actually different and had more illustrations and a more ludic interface. After a first round of feedback, I adjusted it and came up with a more relevant version.

Although the app idea is simple and seems easy to understand, the user may not be aware of what they can do on each screen and how to make the best use of each functionality. Adding context on the screens was something I added later in my design process, and it was key to arriving in a better result.

It would be important to have an interview session with real users to validate the information provided and to find out more about them to have new insights. Also, running usability tests with these users would definitely help in finding areas to improve with the next iterations.