The 5 Biggest Interface Screw ups of 2010

by on 12/30/10 at 3:08 pm

Over the past several months, I’ve been funneling my keen eye for awful interface design into a blog, User Interfucked. Interestingly to readers of UX Movement, it should come as no surprise, a vast wealth of terrible interfaces are not just door handles and kitchen cabinets – they’re right here on the web. For my guest post, I thought I’d write about this year’s worst interface screw ups.

1. Splash Screens

In case you forgot (and needed to know) the name of the application you’re using seconds after its execution, there is the utterly pointless splash screen.

A true splash screen has a fine, albeit mostly aesthetic purpose. While the application is loading, a resource-light branded image is shown as a kind of virtual waiting room. Some companies, such as Adobe, will use the splash screen to run a small ticker of the resources being loaded for your viewing pleasure.

A splash screen becomes pointless when either the application has already loaded or, worse, before the application begins loading. We all remember old school websites whose home page came after a splash page informing us we had successfully arrived there: “Welcome to Bob’s World!!1! [Enter]”

View while app is loading

View after app has loaded

Take this gem from a fitness app I use almost every day. The splash screen begins in a useful way. However, once the app loads, you have to navigate away from it to get to your data. It’s also very confusing because the user might not even understand the app has already loaded if they’re still staring at the logo.

2. “Click here” links

“Click here to continue” is probably the worst practice in the entire span of internet history when it comes to interfaces. We all know exactly what to do when we see colored underlined text. Yet for some reason, website developers insist on instructing us on how to use a hyperlink…with every hyperlink using the phrasing “Click here to…”

This mistake is so pervasive because anyone who knows basic HTML is vulnerable to make it. Instead of typing “Click here to go to the main page,” all a designer has to do is write “Main Page” or “Home” and make it a link. If your users can figure out how to navigate to your website, they can figure out how to click a link. “Click here to” adds unnecessary junk to the user interface and slows down the user’s experience.

3. Unclear dialogue boxes

This mistake is especially prevalent with dialogue boxes, for some reason. A user is given a prompt with a simple yes or no question. The problem is, the developer failed to make it clear what “yes” or “no” means.

In this case, the “Okay” means “Okay, don’t.” This is probably an action in the game where the user has pressed the close button right away. A better prompt would just say “Do you want to save? (Yes/No)”. If the user’s first action was to click an option that says “Exit without saving,” I wouldn’t have a dialogue at all. However, if you insist, it would be less ambiguous to say “Are you sure? (Yes/No).”

4. Fanciness over usefulness

I feel like I was the only one rolling my eyes when the BumpTop team debuted their OpenGL desktop replacement that solved their perceived problem with the traditional computer desktop. The team believed a flat surface did not reflect the 3D environment into which we organize an office in real life. The solution, for the team, was to create a 3D desktop with stacks as the unit of organization. This made for a very pretty “oh” and “ah” interface, but it essentially created an extra cognitive step in nearly everything you do on the desktop.

The reason it’s easier to make stacks and use a 3D environment in real life is because the input of real life is 3D. By making a 3D desktop, the user essentially has to constantly face the hurdle of transforming a 2D input into 3D. It’s pretty, but it quickly becomes annoying to use.

Worse, is this phone from Samsung. You can see why developers might be drawn to using this 3D cube interface. It looks so damn pretty and futuristic. But how does it improve upon the classic grid layout of icons? Now, the user is called upon to use a 2D input to navigate around a 3D surface to find their icon of choice. The design also means only three icons can be fully visible at a time.

If designers want to create the new desktop or startup page, I suggest they look to logarithmic scaling as a concept. This uses linear perspective as a method of increasing virtual geographic space without confusing three dimensions of movement with two dimensions of input.

5. Bad button placement

The rapidly increasing use of touch interfaces has conceived a new category of design flaws which fail to accommodate our big fat American fingers. This is even true in mobile sites such as Google Talk. The send button (“Envoyer,” sorry, I use french) could be placed in that space already available to the right of the textbox; saving real estate in the process. Instead, it is placed so close to the browser’s back button, the user is apt to write an entire message and have it erased by going back to the previous page.

Make 2011 a year of good interface design. Avoid these common interface mistakes at all costs. In the end, your users will thank you for it.

About Adam Kochanowicz:
Adam Kochanowicz is a Ph.D. student in I/O Psychology. He writes as the National Psychology Examiner for Examiner.com and maintains the Tumblr blogs User Interfucked and Papyrus Crimes

34 Responses to “The 5 Biggest Interface Screw ups of 2010”

  1. Andrew

    Dec 30th, 2010

    Interface Screw Ups of 2010? These are more like Interface Screw Ups of the last decade.

  2. Mariusz

    Dec 30th, 2010

    Bad UX happens also in real life http://b0i.de/uxatm ;)

    Anyway, i’d say that #3 would be the worst. Imagine you have a more critical application. Oh, dear..

    • Clay McIlrath

      Jan 4th, 2011

      I agree that #3 has to be the worst.. bad UX is one thing.. error caused by UX can be detrimental depending on the application

  3. Alvin Tan

    Dec 31st, 2010

    “Click here” is definitely not bad design. Links that double as calls to action have always been represented in that format. Doing otherwise goes against common user model and is bad design.

    • cherry win

      Dec 31st, 2010

      “click here” must die. calls to action are awesome, when they mean something. click here is not a call to action. buy now, hire me, download, etc. those are calls to action. to get someone to click somewhere, all you need to do is make your text look like a link, or a button – style adds emphasis. click here also has no SEO value – you know who ranks for “click here”? Acrobat reader… ack.

    • Stomme poes

      Jan 1st, 2011

      Alvin:
      the example in the image posted for #2 should have been
      (underlined link): Unsubscribe from all SparkPeople mailings

      That IS the call to action. “Unsubscribe”.
      Worse, when you have a list of all links on the page, “click here” “click here” “click here” and “click here” are a list of worthless nothings.

    • JohnnyUX

      Jan 1st, 2011

      For most “Click Here” calls to actions, you can generally just make the actual call to action the link. Clicking “Unsubscribe” is the call to action.

      Having far too many “Click Here”s could also be a bit confusing to the user.

    • Amit

      Jan 2nd, 2011

      When I was running an email marketing campaign for a non-profit this year, I saw a significant increase in clicks when the sentence included the “Click here’ verbiage. While I have always heralded against the use of “click here’, I’ll continue to use it if it drives more clicks.

      • Chris Edwards

        Jan 3rd, 2011

        I agree with Amit. Although I despise the use of “click here” it does generate a higher click through ratio. Don’t know why, but maybe, just maybe, not everyone has figured out what the colorful text with an underline under it really is.

      • Dare

        Jan 3rd, 2011

        Agreed. It may seem noobish to the savvy internet geek, but for the mass majority #2 has (in my experience) been essential in directing them towards the next course of action. Yes, there are users who need explicit instructions on how to get to the next link.

      • Clay McIlrath

        Jan 4th, 2011

        I think it depends on the demographic you’re targeting. Click here works well for older generation users (just like large fonts and minimal design), but not for gen-y.

      • Allen

        Feb 2nd, 2011

        I too agree with adding click here… as long as you are qualifying it with a specific action/word… Just having “click here”‘s all through out your copy is ugly.

        I too have done experimenting with this. I’ll send out emails with the same call to action in the copy of email campaigns. I consistently see see more click through rates with “click here to view our stuff” rather than “view our stuff” and not directing the user to click.

        But I agree with Clay, some of it play with the demo’s of your audience. We’re all not 20-30 y/o UX/Web designers who know what a link looks like :)

      • Adam Kochanowicz

        Mar 23rd, 2012

        My opinion on this is that, if you must use it, make sure the action word is also a link. So,

        this item.

        is preferrable to

        to purchase this item.

        Otherwise, the actionable area is separate from the action word

        (“click here” is not the action word because the thing I’m essentially doing is not “clicking,” it’s “purchasing.”)

    • Avangelist

      Jan 5th, 2011

      Click here is not a call to action it is the action required.

    • anthony

      Jan 5th, 2011

      It’s important not to confuse click through rate with conversion. Conversion rate is the one that matters. “Click here” may get you high click through rates, but the bounce rate is usually higher, especially if the page you take users to is not what they expect.

      There’s also the issue of trustworthiness. If you tell a user to click here, and they can’t see the URL name or where the link takes them, they could get cautious and suspicious, unless it’s from a website they already trust.

      Describing your links makes it clear and tells users what they can expect before they click on it. That way you have the right users clicking on your link, instead of users who didn’t really mean to click there in the first place.

  4. Sietse

    Jan 2nd, 2011

    hehe nice :) cool reference to those old school websites.. I can remember it was so awesome to have a wicked sound-enabled flash intropage, before entering the rest of the site… god that became annoying… Good thing people stopped doing that.

    And yes.. those 3d navigation apps look cool, but in the end I always revert to easier browsing and navigation.

  5. Petr Stedry

    Jan 3rd, 2011

    Ad 3) A better prompt would say: ‘Want save the game?’ (Save / Don’t Save / Cancel).

  6. Marcello

    Jan 3rd, 2011

    For what it’s worth, in the English version of #5, the “Send” button is on the same line and to the right. So that just looks like a localization bug.

    But the Mobile Safari version of Google Talk has plenty of other usability problems.

  7. @clemenyeung

    Jan 3rd, 2011

    Thank you for the time you’ve taken to highlight these UI problems. Lots of gems to learn from here – great blog!

  8. Pablo Cuadrado

    Jan 4th, 2011

    About the 4th point, just wanted to share a post I wrote, also mentioning BumpTop, as I think that this kind of literal digitalizations of a material environment are a terrible mistake.

    http://silicoholic.com/2010/12/28/the-use-of-metaphors-in-interaction-design/langswitch_lang/en/

  9. Christophe Maximin

    Jan 4th, 2011

    I can tell you for a fact that the reason the button “Envoyer” is misplaced is *because* you use the French version.

    Proof: http://imgur.com/o51z1

    You should know that designers can’t really position buttons of this kind with a variable text length, you run the risk of having a input field too small, which is worse.

    • Avangelist

      Jan 5th, 2011

      This is true, but could be the result of not considering enough localisation when building an app with multiple language support.

      Now that is a big mistake of the last year! A lot of apps came out claiming multi-lingual support but were really straight up translations which didn’t use the correct linguistics of the people they were targeting.

    • Adam Kochanowicz

      Mar 23rd, 2012

      Probably, but surely you aren’t implying that it is the user’s mistake for speaking french :)

      To complement @Avangelist, a lot of the times, the other languages are inserted from a simple copy document and put into the interface via a kind of script file to which the html files refer.

      Good interface design should consider how the interface changes from replacing the copy.

  10. Chris Hart

    Jan 4th, 2011

    “Your users will thank you for it.”

    Are you sure about that? Users expect perfection and only mention something if its less than.

  11. Adrian Roselli

    Jan 4th, 2011

    The kind folks at UX Booth pointed out that I am being a passive-aggressive wimp by not making any comments here, specifically because I disagree with the premise of this post and cited it on my own blog (http://blog.adrianroselli.com/2011/01/year-end-cliche.html#5).

    My issue with this post is that none of these are unique to 2010. They may still be pervasive in 2010 but they are old, dating back to the 90s (or even older). I liken it to saying that the biggest screw-up with cars in 2010 is the internal combustion engine. The issue goes back far further, it’s just that now some of us are in a position (ie, educated enough) to realize it.

    I’d like to see a screw-up *introduced* in 2010, like some of the things we are seeing in touch interfaces (not just poorly-conceived hit-states, that’s old news) or the rampant attempt at duplicating touch interfaces in non-touch UIs. There is a whole new consumer UX model out there being made up, and screwed up, as we go.

    • dude

      Mar 3rd, 2011

      Oh unbunch your panties, would you? *yawn*

    • Adam Kochanowicz

      Dec 2nd, 2013

      Thanks for stepping up!

      I’m finding these days every post on every blog is a “Top x” like “5 reasons why you should never blah blah blah”. Not inherently a flawed format, just kind of getting old.

      When I get some free time, I may ask the site’s owner if I can refresh this article and I’ll take your considerations in mind.

  12. Julie

    Jan 4th, 2011

    There are some issues with the “click here” links for vision-impaired people using screen readers, as well.

    http://stackoverflow.com/questions/2384493/click-here-to-read-this-article-read-more-why-these-are-bad-for-screen-reader

  13. Amy

    Jan 5th, 2011

    I actually have that Samsung phone, and the problem with that cube is WAY more significant and different than what this article states. If you look at the physical buttons at the bottom of the phone, there is a button whose SOLE purpose is to launch that freaking cube. It’s right next to the essential back and end call buttons, so I accidentally launch that cube more often than I’d like.

    Like many Android apps, it has no way to KILL the program FROM the program, so it sits there hogging memory until you use a THIRD PARTY app to kill it.

    When I WANT it open (rarely), it’s actually a cool toy. You can rotate the cube by shaking the phone. I don’t think it was intended as anything more than a toy, which makes the dedicated button puzzling.

  14. johnny griswold

    Feb 10th, 2011

    For item #2 (click here), you can’t always blame the designer.

    My company does work for a client who is INSISTENT that we use “click here for…” “click here to…” and/or “click here”. No matter how many times we try to get them to see the light, they won’t have it. So they get their way because they pay the bills. We do what we can to get them to change, but until we convince them 100%, they have their “click here”.

    So, don’t be so quick to blame a designer for bad design.

    • Adam

      Jul 8th, 2011

      As a designer myself, I definitely agree, Johnny.

    • Adam Kochanowicz

      Mar 23rd, 2012

      Indeed, that’s an important consideration when judging any interface. The designer is not always king of the operation.

      I know many of my designs have suffered due to insistence from the client that it look a certain way.

Leave a Comment