Brand UX: The Power of Experience
Introduction
Michal and Lucila welcome the audience to their talk about brand UX. They outline the three parts of their presentation: defining brand user experience, reviewing the designs of two banking apps, and providing actionable insights for ensuring coherence across different channels in digital products.
What is Brand and Brand UX?
This section clarifies the misconception that brand is just a logo. It emphasizes that brand encompasses all interactions with a company, shaping customer perception. Brand UX is defined as the consistency between a brand's promise and the actual customer experience.
The Power of Personality
Using relatable examples of individuals with distinct personalities, the speakers introduce the concept of brand personality. They explain how human personality traits can be applied to brands, influencing customer relationships and perceptions.
Brand Archetypes
The presentation delves into the 12 brand archetypes as a framework for shaping brand perception. These archetypes provide a common language for teams to align and ensure consistent brand experience.
The Importance of Brand Coherence
This segment highlights the negative consequences of inconsistent brand communication. Using examples like encountering someone with inconsistent behavior or receiving confusing bank communications, it emphasizes the risk of losing trust and confusing customers.
Mobile Apps as People
The speakers propose an intriguing analogy: considering mobile apps as individuals. They explore how human characteristics, such as physical appearance (UI) and communication style (UX), can be translated into the design and user experience of mobile apps.
Case Study: U Bank vs. Up Bank
This section provides a detailed design review of two banking apps, U Bank and Up Bank. It showcases how these apps embody different brand archetypes (Sage and Jester) through contrasting iconography, color palettes, menu positioning, scrolling patterns, and micro-interactions.
The Role of the Product Team
The presentation emphasizes the product team's responsibility in mediating between the company's brand message and the customer's experience. It stresses the importance of fulfilling brand promises, consistent messaging, and leveraging user feedback.
Ensuring Consistent Brand UX
This segment provides actionable insights for teams to ensure a coherent brand experience. It highlights the significance of collaboration, establishing a collaborative environment, defining a live strategy, and incorporating user research and feedback loops.
The Business Value of Brand UX
The presentation concludes by addressing the business value of investing in brand UX. It presents compelling statistics demonstrating how shared values and brand consistency lead to increased customer loyalty, purchase decisions, and brand advocacy.
So welcome everyone.
Thanks for coming to our little talk.
We did this, before at Google a few times, also at a conference last year.
So really thanks for having you and we will look forward to also getting your feedback afterwards.
And we'll be talking about brand UX, today.
Our chart is, our representation is divided into these three parts.
First, what is actually brand user experience, and anyone heard this term before, actually?
Brand UX?
Second part will be a quick design review of two apps, from the same industry.
Just to showcase how can you communicate with different brands across products that are basically very, similar.
And, then we'll try to give you some actionable insights and things you can do within your team, your organization.
How to ensure a coherence, across, different channels, across the digital, in your digital products.
We usually start with question, who is actually a designer here?
Quite a lot of designers, who is a developer.
Yeah.
Nice.
Two more questions.
Who is developing a mobile app currently or building?
Building mobile app.
Nice.
And last question.
Who is a founder?
Who's who, have you are designing and building an app?
Oh, nice.
Yeah.
Yeah.
So nice.
It's it's a, yeah, we have a mix.
It's, a marathon, not, a sprint.
Great.
I think each of you will, we hope that everyone, every each of you will take something, get something out of this, presentation, just different parts.
So let's start off with what is actually a brand?
Some, people, mostly designers don't, already know that brand is not a logo, but still there are many people thinking, oh brand, oh, is the logo, right?
That's, my brand.
That's, that's, what I consider to be a brand.
And, but brand is something completely different because logo is just the visual representation of your brand.
Something that, It will help you identify your brand.
In fact, brand is your company, meaning every single interaction with your company, events, customer service, your leadership team, all the employees, products, obviously, but also visual identity.
So as you can see, the logo is just there.
Just, little, thing up there across all these, these touch points.
So brand is in fact, something that exists in the mind of your customers, because it's the sum of entirety of interactions with your company.
And so if that's the brand, or as Jeff Bezos say, brand is something … it's what people say about you while you're not in the room, and I think it's a pretty good definition, because it's not biased, it's just your emotion, what you think, what you feel when you think about the brand.
And what is brand UX?
Brand UX is something that happens in between your brand, so the promise, so the why you exist, and then the experience.
A good brand user experience occurs when there is consistency between the promise and the delivery.
If there is no consistency, obviously it's a poorer brand user experience.
But it's interesting because If you under deliver, that obviously affects the brand user experience in a negative way.
But in fact, if you over deliver too much, it's also not always great.
Because it might create some anxiety within your customers.
Because imagine you're paying for a hostel and you're expecting this quality, and that's fine because you're paying a lower price.
That's your expectation.
And then if they put you into, presidential suite, you're like Damn, I think there was a mistake and I've put my credit cards, I don't know how they even charge me.
Again, surprisingly, it might not be the best brand user experience because you got heavily over delivered, today we'll be talking about digital products.
We'll be talking mostly about mobile apps and the brand touchpoint of, in digital products.
So let's start with a small exercise.
Let's imagine a person, a friend of you, a colleague from work.
Let's call him John and let's imagine that he is like really timid.
He's like a calm guy.
When you need something in the office, or if you need advice, you go to him, you know that he has that knowledge, he can, give you some support.
And then, let's think in a different person.
Let's think in Joanna, for example, and imagine that she's completely different.
She's like really creative, really fun, she comes with a lot of energy, she's all the time bringing new ideas, really open minded.
So what do you think is the difference between these two people?
Any idea of what makes them different?
They are different, John is the DJ in the office, while Joan is, the guy who, if you've got a problem, you want to talk to Joan because he calms you down and helps you.
What's the difference between your two friends?
Yes.
Yeah.
Yeah, definitely.
Yeah.
Yeah.
Energy levels?
Go in there.
Yeah.
Oh, yeah, definitely.
Yeah.
Yeah.
Something else?
Something else?
Yeah, because you're perfectly right.
I'm just thinking, what else?
What is the difference?
What are the areas of them that are different?
Yeah.
Oh, for sure.
And why do you think it's that?
Yeah.
Yeah.
It's because of the characteristics that we attribute to them.
So that's it.
So that's, yeah, that's personality.
So if we ask Google, because we always ask everything to Google, this is what Google told us about personality.
And if we focus on the first definition, we can basically say that all these, characteristics that we attribute to a person, or that a person has, is what forms, their character.
And that is personality.
So if we take this psychological concept, and we want to talk about brand personality, that is, a framework that different organizations use to shape the way the customers perceive what they, like how they are, we can almost think about brand personality as the personality of a person.
Like we can use the same attribute to describe a brand that we use to describe a person.
So there is a really interesting tool that is the 12 Archetypes.
That we can use, to identify the brands, within these, standardized and universal archetypes.
So let's have a look at them.
Yeah.
Also to align everyone within teams, with the marketing team, or with, at a company.
Also these brand archetypes are derived from Carl Jung's, one of the founder of psychology, to maybe pigeonhole someone.
Yes.
Within businesses, you want to, have frameworks, you want to have tools, that aligns the teams, right?
So that's one of the ways to then provide a coherent, brand experience.
An example?
Who've seen this before?
Yeah.
Yeah.
It's, designers would, yeah, would be familiar for designers.
Yeah.
So just an example.
Yeah.
So something that we want to start talking about is what happened when a brand lacks of vitality and coherence.
And let me guide you through a couple of examples so we can talk about this in an easy way.
And imagine that you meet someone today here at the conference.
And that person is like really formal, really elegant, and then you saw them tomorrow and they're like really casual, like funny, and then you saw them next week and they are like eccentric and completely different, What will happen?
You will think, oh, what's happening with this person?
He's really different each time I saw them.
You will feel confused.
That would be you.
Yeah, exactly.
And now I imagine that everyone is using here like a bank app or you have a bank.
So sometimes you go to a bank branch, sometimes you use your app to find something, make a transfer or, you receive like some letters at home and imagine what happens if you start seeing that all those communications are different.
You will feel the same way, like you will feel confused, you won't understand what is happening with the bank.
You will start like, doubting, is this my bank or is this a scam?
So all these problems are the ones that can happen when a brand lacks of coherence and consistency.
Yeah, it's funny that you used the bank example because banking services are an example of services where trust is just paramount.
So you imagine getting a letter with, a logo that is unproportionally scaled.
Yeah.
Or spelling mistake.
That's weird.
It might be a scam and they're asking for some information.
So that's an example of this, someone being different in another interaction.
So as a summary of this, if a brand lacks all these characteristics that we were saying before, you will be losing market position, you will be confusing your customers, and you will, lose the trust that they have in you.
So now, because we are designers, we want to talk about how we as designers can help organisations to shape the way people think about that brand and imagine that brand in their minds.
Through, the experience and through these digital products.
Yeah, so let's get back to John and Joanna.
We know they are different.
They are both great people.
They are just different, in, their, with their personalities or their personalities are different.
So what if, we considered, mobile apps to be people, to be humans, persons?
How human traits and human characteristics would translate into mobile apps?
We all build relationships with products, with brands, and these relationships are in fact very similar to relationships we build with, with humans.
As a side note, there was an interesting, research done, comparing Apple and Android, with MRI.
So they were putting people in MRI scan and they were putting two groups of people, Apple fans and Android fans.
And so the result was very interesting.
So for example, when, when, Apple fans were put into MRI and, someone was mentioning Apple, brand to some, in some way to them.
So the part of the brain that is responsible for, family relationships, were activated, which was interesting.
And then when.
And when, Android fans, were, were being, exposed to the same information, the same part was activated just in the negative, in a negative way.
And when they did exactly the opposite with the Android brand, there was no emotional, reaction, which was interesting because I can imagine that most Android users, like the customization, they like, data and just usability, whereas Apple users, they trust the brand in terms of, okay, they think this is good, so I'll be using it.
I don't know, I just find it, we just find it interesting.
Yes.
Circling back to this, John and Joanna, let's assume John is a Sage archetype and Joanna is the Jester archetype.
So what we're going to do now is we're getting into this little review of two apps from the same industry and providing very similar services in a vastly different way.
So the first one will be, the U Bank.
Anyone is using U Bank?
Yeah.
Yeah.
Great app.
Yeah.
Really great.
And it's beautiful, beautiful product.
And the second one will be, Up Bank.
Anyone's using Up Bank and two bank apps, two banking apps, very different, even with their brand messaging, the slogans, you can see they are based on different emotions.
U Bank is about the control, take control of your money, whereas Up Bank is about feeling good about the money, which already communicates the difference.
So let's get into it.
Yeah.
So if we want to talk about the UI.
What do you think is the equivalent in a mobile app, like in a person, of the UI?
Not in a mobile app, sorry.
UI app.
That make sense?
Which would be the equivalent in the, in a person characteristics of the UI?
Yeah, if we consider mobile apps to be, a mobile app to be a person.
So what's the equivalent of the UI of the app?
In ideas?
Yeah, exactly.
Yeah.
Appearance, yeah.
Physical appearance.
Yeah, the physical appearance.
Exactly.
Okay.
To start with this small case study, we had a look at the iconography that these two different bank apps present, and we, when we look at, U Bank, we can see that they have, really regular icons, linear icons, they are used to help the user identify quick actions in the bottom try, they also help the user to identify little bits of information, they are quite stable, so they work well, they, yeah, they're okay.
And then they're great.
They're valuable and yeah, exactly.
When we have a look at, app Bank, they also have these linear icons that are used for the most common, actions that you can do in the app.
But they also introduce a second style that are these small, like illustrations for a different, purpose.
So they use those ones, for example, to celebrate with you your first year with them or to introduce you to some, benefits and promotions that they have, and we will never have these kind of icons on, U Bank.
And that makes sense because they are talking to different, segments.
Exactly.
And there, there was a design decision, made in the process following some guidelines and brand messaging, right?
So in order to achieve this jester or a sage archetype, and that's an example, yeah, the icons.
Exactly.
Same with the colors.
We can see here how they continue following, their messages or the style of messages that they want to communicate to their users.
And it's really interesting that we were, when we were start, when we start working on this, we saw that the colors, of, U Bank and Up Bank are exactly on the opposite side of the color wheel.
So what they're trying to say with this is they are targeting this different, segment and also they are, trying to evoke different emotions.
U Bank is talking about trust, honesty, loyalty, security, and on the other side, Up Bank is talking about optimism, happiness, enthusiasm.
So yeah, like they use their colors to communicate these emotions.
Exactly.
Because colors have meaning and they always, ignite some emotions, yeah?
Yeah.
Just different.
Emotions.
Yeah.
So what is the counter?
If we know that UI is the counter equivalent of physical appearance, what could be UX, like UX designers work?
What do you think?
Maybe it's Yeah, sorry?
Yeah.
Yeah.
Yeah.
Let's see.
We find this, to be honest, we find this a tricky question.
Because it's Yeah.
Because UX is everything.
But Yeah.
How about what people say and how they say it?
There will be a third part, but let's, dive into, this one.
UX, information architecture, the wireframes quite often are made by UX, UX architect or UX designer, if there is a distinction, depending on the maturity of the design team.
However, just an example of UX in U Bank, the menu positioning behavior, standard five, five icons in the bottom bar, that's something you would expect from, banking app.
And it's great.
There's no surprises.
It brings trust, a sense of stability and predictability, which is something you need in most of the banking apps.
Yeah, and even different examples.
This is a well known pattern that you will find in other apps.
It's easy for someone that interacts with U Bank for the first time to realize how to navigate this app.
Exactly.
What about Up Bank?
It's quite different.
The menu is positioned in the very top.
You can swipe by swiping wherever in the screen.
It's almost deriving from other apps that you swipe left or right.
I'm sure we can all think of an app where you swipe left or right.
So clearly there is a different customer segment and potentially user base of this app is either younger audience or much more tech savvy.
So there is less of a learning curve to learn about the product.
And it's also just more, it's funnier, right?
It's more scalable, by the way.
Which.
Potentially gives, more opportunities to put more items in the, top navigation because, potentially this, user base, is happy to ingest a bit more information and process more information.
So that's an example of a difference, between these apps.
Yeah.
The last piece is micro interactions.
So again, same question.
What do you think is the human equivalent of the micro interactions?
Any ideas?
And communication, they say it's, yeah, yes, that's it.
Exactly.
It's body language.
Yeah, body language.
They say it's 70 percent of any communication, so I think that explains why you meet someone from other country, don't speak the same language, but after four or five, you communicate perfectly.
So for this piece, we have a look at the scrolling patterns that they are using.
And we can see that in U Bank, as Michal was mentioning before, they have a regular scrolling pattern.
Then if you tap on the different items on the bottom tray, you're going to go to different screens, and you will have the same scrolling pattern in all of them, which is great.
It's a really good experience and a stable, experience.
But if we have a look at, Up Bank, they are doing something a little bit different.
So they have this bumpy movement each time you go until the end of the scrolling.
And they also have this cute illustration that we really like, or animation, where you can, press the screen, pull down, and then release, and you will save one dollar each time.
So of course, it's not like a feature that you're going to be using to save, but it's something funny.
It's like an extra touch that they want to put there to make this engage with the user.
Yeah.
And I think it's a great example of delivering what's been promised.
So if you want to feel good about your money, that's a feature that just delivering that perfectly.
Again, a small design decision.
Maybe a larger dev effort, but a design decision that really serves a purpose, which is great.
Cool, so to start wrapping up the presentation, in the entire brand communication process within digital products, obviously we have the company that is the brand.
A company has a mission, has a vision.
We, as a company, we want to know.
Why do we exist and how do we want to change the world?
And so we compose the brand, right?
Because if this is our mission, all right, so that's what we want to communicate and that's what we want to to be in the market and that's what we want to be recognized by in the market.
Yeah.
On the other side of this relation, we have the customer.
So the customer, like we are customers all the time, they are the ones that interpretate everything that the brand is communicating them.
And create in their own minds the idea of that brand and each time they, experience something from that brand, they will be forming like new ideas or changing the previous ones about that brand.
Exactly.
But we have someone that is being like a mediator in this relationship.
Yes, that's, I would say, all of us here, the product team, developers, designers, product owners, product managers, marketers, oh, are we getting claps already?
So we as product team, we use the brief from the leadership team, from the client to really reinforce the message and to make sure that this messaging is just consistent.
It's also our job to make sure that we are not over promising that we really craft the products in a way and that will, fulfill the, brand, communication needs.
And funny Jane was mentioning NN group and that's exactly, the, the content from NN group, which is a great resource, and really nicely put together, information and practices.
Lastly, how to ensure brands, a consistent brand, user experience.
From the experience, we've divided this into three points.
Collaboration, very important, cross, cross functional collaboration, meaning over the last 10 to 15 years, marketing and products, or on development of product have become one, yet still, it's not really reflected in many companies and on organization, organizational structure.
On or in ways of working.
So one of the ideas we have for, to make it really easier is making the brand guidelines and product, sorry, design system, one document, one, one single source of truth to really help teams from, let's say, marketing and product to, to have the same source of truth and just make this communication happening.
And maybe, increase the number of, touch points where these teams talk.
So it's not only another meeting on Tuesday, another standup that you just don't have time for, but to embed into ways of working, this, these conversations that, hap would happen more naturally.
Also, collaborative environment.
Speaking about implementing ways, proper ways of working, it requires leadership support.
A great example is Airbnb, the CEO and founder of Airbnb is actually a designer.
So, so I'll, risk a statement that probably that's why this product looks so great and works so great.
They really listen to the users.
Strategy.
Yeah, we have the strategy that we have to think about the strategy, not as a, a document that we have somewhere in our drive is something that is all the time being like having to be revisiting and something that is live.
So we have to think about the strategy all the time, define our goals, define the objectives, everything that we want for the different teams and also in a collaborative way.
It's a process.
It's not a document.
The strategy is a process and should be co created by any, team member and should be, or every team member should be able to contribute somehow to this strategy.
Finally, research, feedback loop, again, listening to the customers.
And in the previous presentation, there was, 50 features at Airbnb.
Based on user feedback, again, product team's job is mostly listening to the users after the MVP is released, right?
So feedback loop, is, very important, user research and analysis, again, based on the strategy, the, touch data points should be, consistent with that.
And finally, incorporating operational and experience data.
So by operational, we mean.
Standard thing like click through rates, usage, screen usage, all the hard numbers, conversions, etc.
But also experience data, meaning emotional part of it.
How do you feel about this?
Yeah, what happens when you accept your user using your product?
Exactly.
Yeah.
So combining this gives you the full picture of how the product works, but also how users feel about it and what's their brand perception.
And it's very important to understand that, also features, should be aligned with the brand messaging.
That's why sometimes you lay out, elements on the screen in a different way, just to help deliver the, brand, values, like what, like the saving thing in, in Up Bank.
Last slide, we're done.
Is it worthwhile?
Because it seems like it's just additional work and, I just want to design, I just want to develop, what is it really worth from a business perspective?
Design and how to measure that those things work and add value to the company.
Yeah.
So yeah, we have different numbers here that express and help us inform those decisions and say, hey, this is adding value to our organisation.
And if you have a look at some of these numbers and the things that they are talking about.
So for example, 77 percent of the consumers buy brand who they share the same values as them.
It's the same thing that we were talking at the very beginning.
You like to spend time with a friend because you share some values.
You trust this person.
You like to be with him or her.
So it's the same with a brand.
You buy a product from a brand that you trust.
Because you know that the quality is going to be good, you probably share the same values or some of the values of that brand.
That's why you consume that brand.
So yeah, everything is connected.
Yeah, very much Thank you.
Any, thanks for, listening.
Happy to elaborate more if you're interested.
Happy to share the deck.
If you're interested, just reach out to us.
And we look forward to chatting more.