Pixels don't make experiences

I’m going to be speaking today about how pixels don’t make experiences. There’s much more to things. Much more than just pixels go into making the products and services that we provide.

So, products and services, generally, either help us spend or save time. We spend time on things like games, social media, and the news, or we look to save time using things to help with productivity, such as apps, like Evernote and Slack. So those are the two kinds of products that we go and try and sell to the world.

The role of UX and UI

But where do UX and UI come in when we’re trying to build these things? How are they different? And, are they even different?

What is UX?

Well, if you have a look at UX – or user experience – this is all about understanding people and trying to solve their problems. That’s what we’re trying to do; we’re trying to get to know the audience that we’re trying to communicate with.

What is UI?

And then we’ve also got UI – user interface – which is all about how a system displays its information and how it’s interacted with. So, we can see how UX is about the person, and UI is about the machine. How are we communicating with this machine?

Why we need to stop confusing the two

Now, I would say we’ve started to confuse UX and UI, and we’ve started to think that pixels are experiences, and we’re getting a bit muddled. We’ve got a little bit stuck, to say the least. We’re starting to solve emotional issues around functionality with pixels, and we’re trying to make processes easier and less frustrating by just making them pretty, and producing wonderful screens that just showcase flawed functionality.

So how can we say that staying behind a screen for as long as possible is best? Were your most memorable moments when you were going through a five-step form? No, not at all. This is the problem we need to solve. Users want to save time, so let’s help them do that. We need to be smart about the way that we work, and the way we’re communicating our message to users. And, in doing that, we can craft great experiences, and we can genuinely solve the problems that users have, and help them complete their objective, all while saving time. And, as we all know, great experiences lead to returning customers.

Case study: Trainline

So, let’s have a look at an example that’s out there right now in the wild. Trainline. Fantastic website – use it all the time – and I mainly access it through my mobile on the app. So, my goal with this is to get things done quickly, as I’ve already mentioned, but it’s also to get to my destination at a time that I’ve chosen. As we know, trains are annoying – there are busy stations, everyone’s always in a rush – but Trainline does a really great job at trying to solve those problems, and trying to make the process as easy as possible.

So, I was getting the train the other day, and this screen popped up as I came out the office. I was like: “Awesome, great. Give me a notification telling me my booking reference.” It knew that I hadn’t collected it yet, so it delivered that information to me, and as soon as the platform was announced, it delivered that to me as well. So now, I don’t need to juggle my bags, I don’t need to try and get my PIN right, I don’t need to try and get my fingerprint recognised. The information I need is presented straight on the screen.

And they were also useful on my journey home, because they told me, as you would expect, that the train was delayed. This is the Trainline pre-empting the information that I need to know, and it’s being useful. It is helping me save time, and they are trying to work to solve the problem that I have.

So, what I’m saying is, we can create these magic moments of wonder where you go: “That’s cool. I didn’t know the apps were going to work this way, just one day it did, and I appreciated it. And now I’m telling you guys about it, which means it was a great experience. I’m going to use the brand again, and I’m now an advocate.” That is a great user experience.

Now, but that does not mean that screens are not necessary. Screens are still important. We can enhance experiences by adding a great interface to these problems that we’re solving. So, the Trainline worked within the constraints it had, and it used my phone system to present the information. Awesome, that’s smart thinking, but in our day to day, we’re using websites to do that, so how can we use these principles on the sites that we’re using to create a better service with a little sprinkling of UI in there as well?

Case study: Skycanner

Skyscanner is a really useful site that’s very similar in nature to Trainline. It tries to help you find the cheapest flights for the journey that you want to make. So, I start here, and I start typing my destination…

“Oh, thanks, this is handy. Cool, I’ll select my airport now. Ah, now this is a button that I haven’t seen before.” So, it’s a little pop-up, and being able to search the whole world is actually really difficult to do online. You usually have to select a region or a continent. It’s really difficult to just say: “Take me to the cheapest place. I just don’t want to be here. I want to be somewhere hot and sunny.” This button allows me to do it.

So, what Skyscanner have done is they’ve gone and they’ve addressed their functionality to solve the problem I have, and then they’ve incorporated it into the UI to make this accessible to the user, and it’s making the website work for me. It means that I don’t have to manually compare different continents and different regions, and get lost in 30 tabs that I’ve had open for five days. I’ve now got that experience all within a button.

Becoming less dependent on pixels

With this, we need to consider if the screens we’re creating are truly necessary. Are we just creating more screens for the sake of creating them? So, did Trainline need to create their own screen for the notifications they gave me, in the hope that, oh, I might visit their app? No, just give me the information that I want. And that’s exactly what Skyscanner have done. They’ve gone: “Okay, you’re here, you’re enjoying the experience. Let’s give you the best experience we can.”

Are we just adding polish to something that’s fundamentally flawed, or are we being useful and helping users progress in what they want to get done?

And with this, by planning for the necessary, we stop wasting time and money on the unnecessary. If we can simplify processes and sort out the functionality, we don’t need to design a five-step form. We can help users get through it quicker, and we can stop having to spend our own time and money on things that aren’t actually helping.

We can solve genuine problems for users, delivering great experience with the help of pixels, rather than depending on them. Thank you.