Developing voice and tone guidelines | UX content design

Over the years, Klarna had developed a very distinct brand, extending to its voice. However, this hadn't been documented. As a small team of content designers supporting over a hundred product teams with limited capacity, it was a priority of ours to create resources to empower all teams to produce high quality content even without our support.

I lead a group of content designers to define and document our voice and tone to accomplish this.

Our goals included:
(a) Document our voice and tone as a resource for all teams and non-writers to access and make use of.
(b) Align with brand to ensure our recommended in-product tone and voice match our overall brand voice.
(c) Educate the broader product org about what voice and tone are, and how they impact the user experience.

Company
Klarna
Date
July 2023
Based in
London, UK
Scroll Down

Who does Klarna sound like?

Now, any content design folk reading this will be familiar with that glossy look non-writers get when we try to explain voice and tone and what the difference is. We wanted to find a way to give non-writers a chance to give input, involving them in the process, while using it as a chance to educate them and build some anticipation for our documentation.

We often compare voice to personality, and tone to mood, but we took this one step further. We asked people across product and design: If Klarna were a person, who would they sound like? Below, you can see our most common responses. (I particularly think that Phoebe from Friends and Ziwe are excellent comparisons.)

This allowed us to explain that these people's voice is how they speak, and doesn't change. Tone could be dependent on their mood. For example, think Ellen on her talk show, vs Ellen (allegedly) backstage.

To help with this, we gathered a selection of copy from all sorts of Klarna contexts, including social media posts and in-app copy.

We keep it real

Based on our selection of celebrities and characters, the content design team then workshopped definitions for our voice. We started by listing adjectives to describe the different characters, and then used these to draft a bio for Klarna.

Our final description of our voice is shown below, but most important to us was to include elements alluding to Klarna being straightforward, a little quirky, and approachable.

Below, you can see how our description for UX content compares with the refreshed description from the Brand team for marketing content that followed our documentation project, showing clear synergy between the two.

(Ironically, "synergy" isn't a very Klarna word.)

Building our tone spectrum

Now we had our voice set, we looked at style guides from a range of companies including Intuit and Meta to decide on how best to document tone.

We created a tone spectrum, going from trendy and playful on one extreme, to educational and reassuring on the other. We added each point on the spectrum incrementally by reviewing our corpus of content, and mapping it against the different tone descriptors. This means that alongside this spectrum, we have a fully mapped-out matrix of which tone we recommend for every microcopy and content context across our products.

To help ensure our tone spectrum was easy for non-writers to understand, we assigned a character for each tone, for example, "inspirational" is like "your hype person", whereas "educational" is like "your favourite teacher". We've also built a bank of phrases re-written for each of these tones to provide examples and tips on how to achieve each.

Influencing the way we speak

Since we released our tone spectrum, we've noticed designers and PMs using more accurate terminology to give useful feedback directly from our documentation, which has hugely helped us mature the way we discuss content.

Additionally, my colourful Figma-hacked spectrum has made the rounds, being used and adapted more specifically for contexts including for certain markets and for marketing emails.

Finally, as part of my work adding Content Design to our Design System, I've made a version of the tone spectrum to assess approrpiate icons and illustrations at different points across our user experience. This is currently being used in a project to rebrand our product imagery and provide guidance on appropriate useage of certain icons and illustrations.