Sometimes, the best way to learn about UX design is to see examples of UX design done right.
I know that I studied and absorbed UX examples as much as I could when I started UX design 5 odd years ago.
Even today, I consider it important to be continuously studying examples and learning.
That’s why in this post, we explore 7 examples of UX design that demonstrate what UX is all about.
1. Amazon’s “Buy now with 1-Click” Button
Amazon’s “Buy now with 1-Click” button is a well-known example of UX design gone right.
You’re purpose as a UX designer is to serve both the business and the customer, and that’s exactly what this button does.
Once Amazon’s users are done looking around Amazon’s website for the things they want, they try to buy and checkout as quickly as possible.
If the user is an existing customer and has already saved their address on your website, then you shouldn’t force them to type it in again and again.
Amazon found a way to remove that friction for existing customers by removing unnecessary steps through this button.
And by removing friction to get users to buy, Amazon just increased their number of buyers and revenue, which in turn serves the business.
Takeaway: If you see unnecessary steps for a user in their journey with your product, you should also take a look at removing these steps to provide a better experience.
2. LinkedIn’s Six Degrees of Separation
Six degrees of separation refers to the idea that all people are six or fewer social connections away from each other.
In other words, your friend’s friend’s friend’s friend likely knows Elon Musk.
LinkedIn uses this network theory to help you connect to practically anyone (that is on LinkedIn).
As you can see in the screenshot above, you will find a number associated with other people’s profiles.
LinkedIn uses that number to show users how far of a connection they are in terms of the six degrees of separation.
If you see “1st,” that means you are connected with them directly on LinkedIn.
If you see “2nd,” that means you have a connection that is connected to them.
And if you see a “3rd,” that means a connection of a connection is connected to them…
…and so on and so forth.
As a professional social media network, LinkedIn wants to help you connect to as many people as possible.
And by providing you with this knowledge along with who your mutual connection(s) are, they help you do just that.
Takeaway: If there is a social aspect to your product, use the six degrees of separation theory to your advantage to help your users connect.
3. Facebook’s “Like”
It hardly feels groundbreaking now, but giving users the ability to “like” something was incredibly innovative when Facebook featured it.
Why? Because we are incredibly social creatures by nature.
I mean, why else would we have so many popular social media sites that are valued at billions of dollars?
We like to show others that we care or approve of things, and Facebook used that fact of human psychology to help people very easily show it.
While typing out a comment can take a minute to do, giving a “like” only takes a second.
That’s 60x faster (in terms of seconds).
On top of that, people can process visuals images faster than words, so the like’s meaning is understood more quickly too.
Because of the speed to which people can socialize using likes, it has become addicting for many (for better or for worse).
This ties back to Facebook’s goal to “give people the power to build community and bring the world closer together.”
Takeaway: Find multiple ways to help your users connect to each other such as through “liking,” video chat, or commenting features. Some ways, like video chat, provide different affordances than others, like “liking.” Some help users connect quickly while others help users connect deeply.
4. Instagram’s Double-Tap “Heart”
Ignoring my Instagram picture above…Instagram took Facebook’s like feature further by making it even easier on a mobile device.
On mobile, Facebook’s “like” button is a small target for a user’s finger.
This means it takes longer for a user to show that they like something.
One extra second, or even a longer finger reach, make a big difference for mobile users.
By making the pictures themselves the “heart” button through a double-tap gesture, Instagram made it even easier for users to engage with the platform and with each other.
This becomes an even more powerful feature when combined with endless vertical scrolling.
Takeaway: Use the affordances available to each device. For example, you can use swiping and tapping gestures to trigger important features on mobile.
5. Tinder’s Swipe to “Like” and “Nope”
Just like with Instagram, Tinder found a way to use a mobile device’s swiping affordance to their advantage.
By swiping right on a picture, a user can show that they’re interested in dating a person.
By swiping left, the user can show that they’re not interested.
The speed at which this can be done is key to Tinder’s value as a dating app.
Users want to choose and find dates as quickly as they can, and swiping on potential candidates takes only seconds to do.
Plus, it makes users feel powerful, swiping away people they aren’t interested in.
Takeaway: Provide gestures that make the user feel in control and powerful when using your application.
6. Chrome’s No Internet Game
Anyone who mainly uses Chrome (which is the majority of people) knows this dinosaur.
For those of you who don’t know, this is a dinosaur game that appears on your Chrome tabs when your computer can’t find an internet connection.
You use the simple up and down keys on your keyboard to make your dinosaur character jump or duck as it dodges cacti and birds while running through the desert.
Is it random?
Is it fun during a frustrating time when you can’t connect to the internet?
This is an example of how Chrome designers created a delightful experience during a not-so-delightful experience.
They created something simple and cute to distract the user while the user is frustrated.
In turn, it makes users want to use the product more.
This is the power of a great user experience.
UX designers that can turn the most frustrating of experiences to the most delightful of experiences are such powerful assets to businesses.
That’s why there is such a high demand for UX designers.
Takeaway: Find ways to create delightful experiences when the user is at their most frustrated. Your solution doesn’t have to be complex. It just has to be effective.
7. Gmail’s Email Undo
This is a feature users have been asking Google and other email platforms for, for many years.
Gmail lets its users about ten seconds to un-send an email after it has been sent.
As UX designers, it’s our job to try to prevent user errors before they even happen.
However, user errors are sometimes unavoidable and we must find ways to help users deal with the errors.
In this case, users might send a message that they soon regret sending after pressing “Send.”
All it takes is for a user to hover their mouse over the “Send” button and accidentally click down on it.
Jakob Nielson’s ninth usability heuristic is to “Help users recognize, diagnose, and recover from errors,” and that’s exactly what Google has done with the undo button.
Takeaway: Find ways to prevent users from making errors. If errors cannot be prevented, provide a way for users to recover from their mistakes.