About the app

Drops is a mobile app which is designed to help users learn words and phrases in their target language in an intuitive, efficient and fun way.

- The app map -

map

Analysis

  • Usability

    • Their platform is organized and easy to navigate. Users can intuitively tap an image or button to transition to another page. However, if that's what they're aiming for, eliminating buttons and increasing the range of taps could provide users with a more intuitive and easier-to-use platform. Additionally, reducing the number and increasing the size of navigation buttons for users who operate with one hand will increase overall satisfaction level.

  • Accessibility

    • On this app, all content is accessible and easy to navigate, however there is no sorting option, even though all the categories are divided into levels. Adding a sort option will allow users to start their learning process efficiently.

  • Iconography & Imagery

    • This app is rich in images to support user learning. However, images with inconsistent designs may be used in some places.

  • Affordance & Signifier

    • Using images can certainly help user remember words and phrases. However, in some cases, using such images can actually confuse users. The image below shows "I cough" and "flu." Similar images are used on the practice screen, so user will need to memorize not only the words but also the images. Drops is an app that encourages users to practice words iteratively, so if users don't look at certain images at regular intervals, what should be an intuitively enjoyable exercise can become frustrating.
signifier

My goal

To preserve the app's excellent features, such as game-like exercises and extensive categories, enhance user understanding and interaction, I redesign its interface, aiming to elevate overall user experience with a beautiful, contemporary design.

User persona

persona 1 persona 2 persona 3

Redesigning

  • Typography

    • Quicksand was designed in 2008 as a display font for mobile devices, but has since become popular in many other use cases as well. Its clear spacing and geometric forms make Quicksand legible even as small sizes.
    • Arial is the standard font for many word processors, such as Microsoft Word and Google Docs. It's a clean, contemporary, sans-serif typeface that works extremely well for body text. Due to its popularity and familiarity, Arial easily adapts to just about any style.

  • Color palette

    • For the color scheme, I use the base colors of this app, but add gradations and raise the color tone to create a pop and modern look.
typography color palette

Final screen

I reduced the navigation's icons from five to four and moved the profile icon to the top. Added sorting options to make it easier to see categories by level. I expanded the range that can be tapped so that users can operate it intuitively and sensually with their fingers. For word memorization practice, I added a flashcard element and made it easier to use with one hand by swiping left and right instead of up and down. I also utilised images that are more relevant to the words themselves. Finally, on the pause screen, I changed the ◽️ symbol (means stop practice) to the home icon to clearly indicate navigating back to the home screen.