{{ searchResult.published_at | date:'d MMMM yyyy' }}

Loading ...
Loading ...

Enter a search term such as “mobile analytics” or browse our content using the filters above.

No_results

That’s not only a poor Scrabble score but we also couldn’t find any results matching “”.
Check your spelling or try broadening your search.

Logo_distressed

Sorry about this, there is a problem with our search at the moment.
Please try again later.

Small details can make a big difference to the user experience, saving users' time, making it easier for them to spend money, or just generally making it more enjoyable. 

Some of these things are so widespread and expected now that you don't even notice them, such as postcode lookup tools on sites. They were not always there, and save you a lot of hassle. 

So, inspired by sites like littlebigdetails, I've rounded up 15 examples of little UX touches I've come across myself, or have found via sites like Pinterest. 

Some are obvious, some less so, and there is a general ecommerce slant to this list. Please suggest any examples you've seen lately...

Flickr

When leaving a comment, if people get all shouty, or leave the caps lock on, it will convert the message into more civilised lower case. 

If only all sites used this. 

Lilly Pulitzer

Hovering over products in category and search results pages on Lilly Pulitzer reveals a rear view of the dresses. 

Land's End

in the same vein, you can quickly view items on Land's End in different colours by moving the cursor over the one you want to see. 

 

Gmail

This is an incredibly handy piece of UX which has saved me loads of time over the past year or so. 

Hotels.com

A blend of urgency and social proof from Hotels.com. When viewing a hotel, various messages appear at the bottom right of the page to tell you that people are booking it right now. 

This suggests it must be an decent hotel, as well as the fact that you'd better hurry up and book before it's too late. 

Santander

Here, the Santander app recognises that I'm about to enter a numerical code, and gives me the phone-style keyboard, which makes life much easier. 

AirBnB

The 'search when I move the map' option is great, allowing people to find an area, then pan out to find suitable accommodation without having to search from scratch. 

Threadless

The shopping cart icon is not only fun, but also gently nudges customers to add more things. 

As I explored here in this article about the 'basket add', it provides confirmation that the customer has successfully added an item, while ensuring they make a conscious choice between heading to checkout or continuing to shop.  

Simply Hike

Simply Hike has a delivery countdown near the call to action which serves as a useful piece of persuasion. 

Podio

This is great. It saves that extra step of heading to click the link that's emailed to you, and neatly guards against robot registrations. 

(example from Pete Bernado via UIdetails)

Tablet

I like this. Most people may have a destination in mind, but other travellers may just have a week or two off that they want to use for a break. 

This 'I just want to get away' button provides a useful method of navigation, though I think tablet should have this on the homepage. 

Here's what the link leads to. A nice way to filter searches, and showing the number of matching results is a big help: 

Twitter

Twitter handily highlights the section of the text which exceeds the 140 character limit when you tweet. 

Barnes & Noble

Autocomplete in site search is nothing new, though more sites could use it.

Here, it helps those who may not know the exact spelling of authors' names, and just generally saves times and ensures that results are more accurate, good for user and retailer alike. 

Amazon

Showing the most helpful positive and negative reviews helps the shopper make their mind up and saves them time going through all the reviews. 

Active 

This skate shop has a threshold of $99 for free shipping, and advises customers on the cart page when they are close to this. Useful for increasing order values. 

Graham Charlton

Published 5 December, 2013 by Graham Charlton

Graham Charlton is the former Editor-in-Chief at Econsultancy. Follow him on Twitter or connect via Linkedin or Google+

2565 more posts from this author

Comments (21)

Comment
No-profile-pic
Save or Cancel
Stuart McMillan

Stuart McMillan, Deputy Head of Ecommerce at Schuh

Great post Graham! I'm stealing all these and adding them to our project plan... :)

about 3 years ago

Avatar-blank-50x50

Caroline Oliver, Communications Manager at Ve Interactive

Great post, although I don't understand the Podio one? You still have to go to your email and click a link to double-opt in?

about 3 years ago

Avatar-blank-50x50

Carlos Giraldo

Great post, little things can improve usability and increase conversion, congrats

about 3 years ago

Avatar-blank-50x50

Vaine Loera

Timer under Buy Now button is my favorite. I need to learn how to implement that.

about 3 years ago

Guy Redmond

Guy Redmond, Digital Marketing Engineer at Nestle

@Graham, I like the alternative on-hover view, but I prefer a close up of the fabric/pattern. (TM Lewin do this)
The Santander feature could be improved, by giving me (just me) the option for a calculator style keypad, which is on normal keyboards, so I don't transpose the numbers (which is what I always do).
Why are they different?

@Stuart; and I thought all your ideas were original?!

about 3 years ago

Avatar-blank-50x50

Maryrose Lyons

Great post. I'm sure it took a good deal of time to put together. Thanks.

about 3 years ago

Avatar-blank-50x50

Roshat Adnani

Great post Graham. Interesting to see so many small innovations which are actually defining great user experience.

Another amazing innovation I have seen in India is the website of a realty site called housing.com where they use Google maps to show ares and then use color code to show variation on different parameters like child friendly, etc.

about 3 years ago

Avatar-blank-50x50

Danny Jack

Yeah great post. I don't agree with the Twitter one though. When I exceed the character limit the app I use gives me option for the message to be shortened or to post it as multiple tweets. I much prefer that.

about 3 years ago

Avatar-blank-50x50

Grant Thomas

A couple of these are relatively useful; a few others are really way too specific to industry and can only be used as inspiration for new ideas unless within the relevant industry.

The raping of user input is a huge UX no-no, though. Make it clear that caps lock is on, by all means (we've all typed a meaningful message before only to realise it would be taken not as intended due to an accidental caps lock incident), but by no means should an application actively change user input. It ends up Orwellian, policed to the point that people *can't* shout even when they desire to and feel it perfectly appropriate.

If one doesn't find an all-caps message ever to be appropriate, then it is the site owners responsibility to moderate the input or make a decision to block such input, but to take what someone has said and change it to what you would like it to be - or how you think it should be formated, or to make any change that isn't their own - is at best plagiarism.

about 3 years ago

Avatar-blank-50x50

Nikki Laker

Awesome post, I'm going to recycle some of these ideas! The Gmail one wins...

about 3 years ago

Avatar-blank-50x50

Andrew Areoff

I think the gmail one is perhaps the most useful of all the UX examples mentioned here. I find it helps me on a daily basis when I'm firing off an email at breakneck speed and forgot to upload the attachment I've referred to in my text.

In constrast, I think the Flickr example of changing a users capitalised wording to lowercase is just social engineering - if someone wants to use caps then let them do that, EVEN THOUGH IT'S NOT ONLINE ETIQUETTE. It's not good UX but instead a "we know best" philosophy.

And while we're on the subject of good/bad UX. If I get the CAPTCHA code wrong on the comments for this site, the page is reloaded and I lose my comment that I've poured blood, sweat and tears into writing and crafting.

Now, that's BAD UX!

about 3 years ago

Avatar-blank-50x50

Andrew Areoff

@SEO Strategist' - good SEO is text, and good UX is using text unless it's absolutely impossible.

about 3 years ago

Graham Charlton

Graham Charlton, Editor in Chief at ClickZ Global

@Andrew - personally, i don't see a problem with the Flickr example, as comments all in CAPS are just horrible.

It does allow you to add parts of the text in CAPs, as you did in your comment: http://i.imgur.com/93C2qbB.png

Apologies for the captcha - there's a new blog design coming very soon which will solve this issue.

about 3 years ago

Avatar-blank-50x50

PluginPro

Many tnx's Graham!
Good ideas for plugins :)

about 3 years ago

Josh Gill

Josh Gill, Digital Marketing Executive at Mediademon

Ace article! Can't tell you how many times that gmail one has helped me out.

For the exact opposite, a post on website 'pet peeves' that make have a negative effect on user experience - http://www.mediademon.com/our-top-10-web-design-pet-peeves/

about 3 years ago

Avatar-blank-50x50

Nicole

Great list, some lovely touches here.

It's a shame in a way that the Santander passcode is alphanumeric - could save a click or two ;)

about 3 years ago

Guy Redmond

Guy Redmond, Digital Marketing Engineer at Nestle

@Nicole, good point about the passcode!

about 3 years ago

Avatar-blank-50x50

Theresa Putkey

It's great to collect these examples so we can refer back to them when we need inspiration. I think the Hotels.com example is actually quite distracting. I use the site a lot and the popups show all the time. It tries to create a sense of urgency so you buy faster. I find the popups irritating...

Thanks for the post!

about 3 years ago

Avatar-blank-50x50

Louis Rix

Some great tips - particularly like the "Auto-complete" function on Barnes & Noble. This will work well for our Q&A as we get multiple questions from users that have already been answered.

Regarding the form fill there's also some clever technology (other than postcode look-up) where as you start typing your address an Auto-complete box comes up which again saves time.

This product / hotel booked in the last 2-3 hours is also a great conversion tool. It gives a website a feel that it is used at great lengths by other users across the globe. Brilliant idea!

A good read overall.

almost 3 years ago

Steven Grech

Steven Grech, Principal Consultant - Head of Media & Services at Maxymiser

Great list of little ideas to add to one's testing plan.

almost 3 years ago

Avatar-blank-50x50

Gemma Wisdom

Great examples Graham, Topshop also have a similar feature to Lilly Pulitzer where you can see a different view when hovering, extremely useful.

almost 3 years ago

Comment
No-profile-pic
Save or Cancel
Daily_pulse_signup_wide

Enjoying this article?

Get more just like this, delivered to your inbox.

Keep up to date with the latest analysis, inspiration and learning from the Econsultancy blog with our free Daily Pulse newsletter. Each weekday, you ll receive a hand-picked digest of the latest and greatest articles, as well as snippets of new market data, best practice guides and trends research.