Ironhack’s Prework: Challenge 2

Mario López Menés
2 min readOct 15, 2020

The challenge is to reverse-engineer an app. We are working with Duolingo, one of the main actors in the language-learning market. The app has been selected due to it being very different from the ones other members of the Ironhack bootcamp have already analyzed. Duolingo is a prime example of gamification and a reference for simple, friendly UI design aimed to an audience as broad and international as possible.

We are working over the main workflow in the app: going through a lesson. Duolingo keeps their flows streamlined and directs people to the lessons by minimizing the amount of non-related things they can do in the app. Taking a lesson is what most Duolingo users experiment on a daily basis.

The UI has fewer elements than most modern-day apps in the market, aiming for simplicity. An information bar on the top, that get replaced with a progress bar as soon as we start the lesson, and a navigation bar on the bottom with just four (previously five, as in the image below) clickable icons. In the middle, big buttons with one-word descriptions and little icons refleting our progress in the topic. That’s it: no hamburger menu, no dropdowns or other hidden contents. Everything is within reach and there is not much more to explore.

Image by AJ Noh for Duolingo (Dribbble)

Shapes and colors are simple and direct. The app looks very colorful but avoids tones that are far away from basic shades. Its icons are composed by basic shapes and have no details at all. Everything is conceived to look kind and approachable while directing you to their core product: the language lessons themselves.

The flow we chose is composed by the following tasks: entering the app, selecting the lesson, selecting the right answer(s) and confirming them (multiple times), navigating through 1–2 positive reinforcement screens and exiting the lesson.

We wireframed every screen involved in this process, creating multiple options to mimic a more realistic experience that could involve changing options in between the flow.

With these, we put together a prototype that recreates the workflow of taking a lesson in Duolingo. Want to try it? Click here!

--

--