JM
All projects

Letras apps redesign

Full redesign of the native iOS and Android Letras apps, keeping the lyric one tap away while adding recommendations, playlists and search.

Lead designer (iOS), product designer (Android) · 2018 · iOS / Android

Context

Letras is the largest lyrics platform in Latin America. By 2018 the apps no longer reflected the brand’s identity, nor kept up with what people had come to expect from a music app. We rethought the iOS and Android apps from scratch, holding on to the philosophy that always guided the product: simplicity and efficiency.

Challenge

The core tension was growing without bloating. The product needed personalized recommendations, playlists and a better search, and each of those features pushed the app toward feeling generic, like any other player. The design question was how to gain depth without taking away the thing people came for: reading a song’s lyric with as little friction as possible.

There was also the fact that these were two apps. We chose native development on each platform so we wouldn’t compromise on performance, which meant treating iOS and Android as sibling products, each true to its own system.

Process & decisions

The lyric one tap away. In most flows, people reach the lyric in at most one tap. The reading screen was designed so that everything that isn’t the lyric is demoted enough not to steal focus. We studied contrast, size and typography for comfortable reading, and every flow, even the most complex, was prototyped and tested before shipping.

Clean without erasing the brand. We went for a clean interface, in line with what Apple Music, Instagram and Airbnb were already doing. The risk of that choice is the experience turning generic. To avoid it, we kept content colorful and well structured, with headers that pull the dominant color from each album or playlist artwork. The restraint came from the layout, the identity came from the content.

Diverge where the difference is systemic, converge on identity. Since each app was native, I let decisions follow the platform whenever the difference was systemic or cultural. The clearest case: on iOS there is no culture of listening to music downloaded on the device, so the iOS app didn’t carry that side, while Android did. The reading hierarchy and visual identity were the same on both platforms; the behavior followed each platform’s habits.

When a technical limitation became a feature. We put real research into deciding how much to prioritize a connection with streaming services. In practice, we couldn’t get the stable connection we wanted. Instead of dropping the idea, we adapted: the app started detecting when someone was listening to a song and sending a push notification letting them know the lyric was available, opening straight to the lyric screen on tap. The constraint ended up pointing to a simpler solution, better aligned with the real moment of use, when someone is already listening and just wants the lyric in hand.

How I led it

This was my first leadership experience, still a technical one. On iOS I owned the project: I defined and drove the initiatives and worked directly with the PO. I worked with two interns and, since I wasn’t responsible for managing them as designers, I brought them along as participants in everything, on the belief that an internship is there to learn before it’s there to deliver.

Outcome

After the launches, the store rating, which used to swing a lot, settled at 4.9 on both iOS and Android. The Android app made the Google Excellence Apps 2018 list, Google’s curated selection of the highest-quality apps on the Play Store. Together, the apps passed, and still hold today, the mark of over one million monthly active users.

I wrote about the iOS redesign process in detail in this article (in Portuguese).