Skip to main content
process

Performance Cards: Designing with Meaning and Empathy

November 2022

Article

Article credits
Oskar Westerberg

When we design a new feature at Spotify, it will be used by people all over the globe, from North America to Sub-Saharan Africa, to Japan. Our markets have significant technological differences, and so, to design for them in a meaningful way, we have to infuse our design process with empathy.

Designing with empathy can be challenging because most of us at Spotify use the latest iPhones on speedy Wi-Fi or unlimited data plans, so our view of how our products perform varies greatly from those of our users in other parts of the world, who might be using older devices on spotty networks and expensive data plans. These are what we call “access-constrained users”, and to design features that work well for them, we have to gain a deeper understanding of their reality and perspective. It’s also important that we don’t fall into common performance pitfalls, such as designing a UI that doesn’t handle “no-connection” states gracefully, or fails to include options to disable moving content.

What are access-constrained users?

Access-constrained users generally fall into three categories: device, data, and network. As previously mentioned, they commonly live in disparate markets such as Sub-Saharan Africa, South-East Asia, and Latin America, with plenty of cultural and technological dissimilarities. For example, Malaysia scores highly on the Mobile Connectivity Index, whilst Sudan has a much lower score, and the average price of data in Pakistan is relatively cheap, while in Kenya it’s expensive. 

Despite their differences, however, there are several threads that connect users in these markets: 

  • Device-constrained users will experience stuttering, freezing, and crashes much more frequently than users who are not device constrained. They’ll also spend more time waiting for things to load and may be more averse to exploring a service to find what they need. They’ll usually have smaller screens with low contrast, and are more likely to have their screen dimmed to conserve battery.

  • Data-constrained users will be sensitive to content they perceive as data-intensive, such as moving images. They also tend to have reduced storage because their mobile is often their primary device and, therefore, has to store everything they care about.

  • Network-constrained users spend more time waiting for things to load. They experience lots of network interruptions so if a feature cannot function properly under these conditions, they won’t be able to use it. 

If you want to learn more about access constraints, you can dive deeper in this post. 

If we only design for speedy devices, we also risk finding out late in the development process that our feature performs poorly on devices used in emerging markets — and at this point, it can be costly and painful to make significant changes. When designing for a global audience, we have to do better, which is why we developed Performance Context Cards and Performance Action Cards: tools for our teams (and yours) to use during certain stages of the product design process. 

Introducing Performance Context Cards

When designing for people who live across the globe from you, it’s important to understand how their context might be different, or similar, to your own. Performance Context Cards will help you connect with access-constrained users and give valuable insights into the device, data, and network constraints they’re facing, as well as help you ask questions that challenge your own perspective.

We recommend using these cards early in a sprint, when you’re writing your brief or hosting a workshop to align on the opportunity space with your team. Post them at the beginning of your FigJam file to help all participants get a mutual understanding of the user context.

Time for (Performance) Action!

Later in the sprint, as you build your prototype, the Performance Action Cards come into play. These will help you tweak your design concepts with the realities of access-constrained users in mind. They’ll enable you to craft great experiences for slow devices, design for informative loading states, and build for an offline state of mind.

We recommend pasting them in your artboard and ticking the boxes one by one. Never hesitate to share them with your entire team either — it’s in different interpretations that the most interesting discussions will occur.

A final word

Building an app that works better for access-constrained users won’t be a one-time solution, it will need to be an integrated part of your design process – the same way that you may already work with accessibility or localization. The earlier in the process that you get in the habit of thinking about access-constrained users, the easier these adjustments will be. 

We hope that our cards challenge the way you think and help you serve access-constrained users. Good luck!

Special shout-out to Tajha Myer and Shannon Rosenberg for contributing to this work, and to Filippas Kotsis for setting the ball rolling.

Credits

Oskar Westerberg

Product Designer II

Oskar is a designer on the Freemium team. He is also an animator, wine-lover, and is probably goofing around with his kids right now.

Read More

Next up

Our latest in Process

Want Spotify Design updates
sent straight to your inbox?

By clicking send you'll receive occasional emails from Spotify Design. You always have the choice to unsubscribe within every email you receive.