CX•UI•UX

A Beginner’s Guide to All Things Design – UI, UX, CX & SD (2022)

Aanchal Bhutani

December 6, 2021

Okay, let’s dive in. You’re overwhelmed because Harry from the Design team won’t shut up about his new UI designs and how it affects UX, which in turn affects the CX, ultimately leading to an efficient SD – wait, hold on, what?

Not long ago, I was in a similar position and understand how confusing it can get. So whether you’re keen on understanding these different terms to use them correctly or just want to sound cool at the Christmas party🤷‍♀️- this is the ultimate guide to help you gain a clear understanding of what exactly are UI, UX, CX & SD.

Before we begin, remember that the four terms we are discussing today are NOT independent of each other. In fact, they are intertwined, and one affects the other.

Ready, set, go!

What is UI?

Short for User Interface Design, UI is the digital practice that overlooks the aesthetics, design, visuals, feel and sound elements of interaction with a product. Let’s break that down further with an example:

When you started using an iPhone, or any smartphone for that matter? Did you go to a class that taught you how to download apps, take a picture or send a message? I’m hoping the answer’s no👀 With a few introduction nudges, you were using that phone like you were born for it! The icons, the gestures, the colours, and the font- every design element, including the phone vibration, is consciously-designed UI.

User Interface Design looks after the typography, the visuals, the sounds and the feel of a digital product, keeping the users in mind. UI Design makes the product intuitive and ‘user-friendly’ (I’m sure you’ve heard that term too); the lesser they need to think, the better!

Learn how Google Maps Evolved their Colour-Picking Methodology to present more accessible visuals to depict places.

The UI of a product also ensures that it encompasses the brand’s aesthetics, perception and intention into the product, making it coherent and identifiable. For example, let’s say I show you a banking app, like HSBC, that uses a casual, handwritten font. Are you going to believe that it’s the app for HSBC or yet another scam? If you chose the latter, you already have a subconscious understanding of UI, my friend. But if you chose the prior, please be careful; it’s a dangerous world out there.

That’s the impact of UI – it can make or break the deal.

Prepare yourself and level up your UI; here are the top 30 fonts that will be popular with designers in 2022.

What is UX?

If you read our last blog on What is UX and Why Is It Important For Your Business, I have faith that you don’t need further explanation on what User Experience (UX) Design is. However, if you haven’t, I insist you check it out for an in-depth understanding of what UX is, but because I know you’re too lazy to follow the link, I’m going to give you a quick rundown right here – you’re welcome.

UX refers to the experience or satisfaction (or dissatisfaction) felt while interacting with a product. Generally, UX can be described as each touchpoint a user has with a product, and “it may not even be near the product” – Don Norman.

Essentially, when Don Norman, a cognitive scientist at Apple, coined the term ‘User Experience’ in the 90s, he referred to every interaction a user had with the product or the brand in general. However, over the years, the term UX was popularised by the digital wave. Hence, now, we generally refer to UX as interactions with a digital product, not physical. For a fancier term, remember Human-Computer Interactions (HCI)

To summarise, UX Design oversees a user’s experience while using a digital product and whether they can achieve their desired outcome.

What is CX?

Just continuing off of UX Design, which overlooks the experience with a product, Customer Experience (CX) Design refers to ALL the experiences a customer has with a brand from multiple touchpoints, resulting in what they think, see, expect, do, tell & perceive with regards to the brand.

Between all the terms discussed in this post, UX and CX are most likely to sound similar and can get confusing, so think of it as this way:

• A brand has a Customer – covers all touchpoints between the brand & client (CX)
• A product has a User – covers the experience of using a digital product (UX)

Let’s delve deeper into CX with an example:

We’re all guilty of skipping Spanish/French/any 2nd language lessons back in school or just never having the opportunity to learn a new language, and Google Translate doesn’t cut it. But, you want to learn a new language, and if you haven’t guessed already, I’m thinking of a green owl mascot that pushes you to go the extra mile on your Mandarin lesson – it’s none other than the iconic Duolingo. If you haven’t had the chance already, I would highly recommend giving it a shot.

Apart from being a practical, engaging and interactive app (RE: UI & UX design), Duolingo uses gamification to keep customers loyal, and in fact, go the extra mile. Gamifying processes and tasks have been an emergent & steady trend. Here are 5 Ways You Can Use Gamification in Your Design.

To complement their seamless UI & UX Design, Duolingo harnessed the power of social media virality to build a stronger brand image & perception. If you haven’t been living under a rock, you may have come across an unforgiving, massive green owl on your TikTok feed. Did Duolingo understand the assignment? They sure did. With a strong following of only 1.8 million followers, Duolingo positioned their branding as fun, goofy and trendy, without ever ‘selling’ their product. (PS they have had 500 million downloads of their app)

To prove their case: they managed to leave a lasting impression on me, and I’m here recommending them to you, and this is NOT an ad.

“You’ve got to start with customer experience & work backwards to the technology.” – Steve Jobs

To summarise CX, think of any brand – how do they communicate? Would you use their product? Did their efforts get you to use/buy the product? Would you recommend them? Did they meet your expectations?

The sum of all the answers is the Customer Experience designed for you. A company will use a Customer Journey Map to identify the pain points and to develop the CX.

What is SD?

Okay, if you’ve made it this far, I respect your enthusiasm to learn. However, it can be overwhelming to digest this information, so I will make this easy.

Service Design (SD), in all its glory, is the backstage of everything discussed above. Essentially, SD is the process of planning & organising the company’s resources to enhance the communication & harmony between the brand, the employees & the customers. All the different departments in the business work in synergy to bring forth a seamless Customer Experience (CX) based on engaging User Experience (UX) that is built on User Interfaces (UI) – Woah, did you just see what I did there? Genius. To understand the extent of SD, check out this case study that talks about Redesigning the Future of Public Transport using Service Design.

I want to emphasise the keyword for SD here – synergy. All different service components and departments must sync and put on a show that wows the customer. ‘Selling’ a product isn’t enough today. We have grown out of the era of product-oriented processes. With the kind courtesy of COVID-19, we have been promoted to user experience-oriented methods – elevating the customer’s experience with something (now) as familiar as contactless click&collect is now the bare minimum.

A common household name: Coca Cola, they’re out here selling the experience of enjoying a Coke with your meal, and not just talking about the actual product.

Experience > Product

In fact, Coca Cola’s current slogan ‘Taste the Feeling’, is the perfect example of marketing the experience over the product. This perception has been in the making for years, behind the scenes, with tons of user research, competitor analysis, market research and design workshops.

Similarly, Meta (erstwhile Facebook Company) depends on its technical teams, developers, designers, community and media managers to keep everything up and running, uphold the brand values, and communicate between the brand and the customers.

A successful SD will look after the 3P’s of Service

• People👩‍💼
  • Customers
  • Employees
  • Industry Partners
• Physical Evidence📸
  • Digital Products
  • Physical Products
  • Service Delivery Props
• Processes🔀
  • Infrastructure
  • Technology
  • Information Architecture
  • Systems

TL;DR

Here’s a short version if you’re in information overdrive or just lazy.

User Interface (UI) Design covers the design aspects of an interface like the colours, buttons, typography, spacing, images, and more. They bring aesthetic value to a digital product and must be reflective of the brand. Imagine the HSBC logo in a handwriting font. Enough said.

User Experience (UX) Design is a user’s (dis)satisfaction level while using the brand’s digital product. UX Design focuses on the functionality of the product. For example, UI Design decides what a button will look like, UX Design decides what happens after the button is clicked.

Customer Experience (CX) Design is the sum of what a customer thinks, feels, sees, hears, and does regarding your brand. From the first touchpoint of scrolling on your brand’s ad on social media to being a loyal customer. Tailored CX Design will ensure that your brand is customer-oriented, elevating the experience. We think Duolingo is a great example.

Service Design (SD) is the backstage of every product/service. The synergic collaboration between the brand, the employees and the customers focuses on the 3P’s of Services – People, Physical Evidence and Processes. SD arranges the policies, technology, systems and infrastructure to present the front stage to the audience, i.e., products, interfaces, and touchpoints.

If you feel like you’re struggling with any of these components, score a FREE 30-min Strategy Session with us, and let’s get you sorted.