Archive for the ‘UX’ Category

Why I uninstalled Facebook – and your app might be next

January 14, 2014

For all it’s pretentious narcissism Facebook provides a level of utility. It also needs to build a business to pay for those servers, engineers and lavish parties. But there comes a point when building an empire that is minting billionaires on the back of a business model that’s predicated on crossing the line into creepy just becomes wrong.

If I use the web experience it gets what I explicitly chose to tell it – what I add to my profile, and post to my wall or message my friends. And I’m comfortable with that. It’s a trade-off – I give them some information, they serve me some ads and I get some value.

On my phone though it’s a different story: (more…)

Lazy developers make for bad user experiences

March 18, 2013

As a developer I can appreciate that dealing with user input is a pain. Dealing with anything messy humans do is always more annoying than handling nice clean inputs from an API. Developers and designers are human too, and they should think about the experiences they are creating, and how a little bit of consideration for the user can turn a frustrating process into a moment of delight.

  • Required fields: Indicate visually when a field is required, and ask yourself if the field is actually required for what the user is trying to do (delight them and they’ll come back and share more information incrementally). Especially in a world of security leaks I like to minimize what I share and you should help with that.
  • Formatting (phone and credit card numbers) is irrelevant: Should I enter my cell as (425)-555-5555, 4255555555, 425 555 5555 or something else? Actually all of those should be valid as it doesn’t take much effort to strip out spaces, dashes and brackets when you’re validating a credit card or phone number. If you need a particular format for your database or display then re-format it… but don’t force the user to comply with a rigid structure to make your life easier.
  • Don’t be redundant: Don’t make me tell you what type of credit card I’ve entered the number for. Using a simple issuer lookup you can tell me if I just entered an Amex or a Mastercard. If you need me to write an look-up API for you I will, just leave a note in the comments.
  • Passwords are a pain to remember: Just because you think the password rules on your site are obvious (at least one capital, one digit, only special character is an underscore and it must start with a different letter than your username) users have lots of passwords. Give them a reminder next to a where they have to enter it what those arbitrary rules are, ideally on initial entry and as an absolute must if validation fails.
  • Don’t ask me the same thing twice: In the US a ZIP code can tell me the City and State. Same in Australia or New Zealand or the UK and pretty much anywhere else. Can anyone explain to me why I have to enter both 90210 and Beverly Hills, California on a million forms? By all means display the City/State for me to confirm but don’t waste my time asking me to do a computers job. That thing I said about look-up APIs earlier, still true
  • Don’t be forgetful: Computers are good at remembering stuff, if developers are not being lazy. If I fill in a field or check a box on a form and something goes wrong with validation the only field I should reasonably be expected to re-enter is the password (and if you validate that and it passes assume I know my password and don’t make me rekey those asterisks again). If I checked “accept Ts&Cs” or “Don’t email me crap” the first time… I probably meant it so don’t forget it because I didn’t get my phone number in exactly the format you like.
  • On-the-fly, context sensitive validation is awesome: Make use of onchange and onblur events and Ajax to check each field as I go to save the user scrolling up and down a page to find what failed. Basic validation, like credit card checksums, for fields that are easy to miskey should not require a full form submission
  • When things go wrong, show me: When you finally get to a full round trip validation and have to show the user some errors you need correcting don’t just bundle some obscure messages at the top of the page – use visual cues and clear explanations to guide them to get it right

By making the process simple and eliminating points where the user can stumble your helping ensure that your form is not a roadblock where the user might get frustrated and abandon the process. When you go to the supermarket you look for the shortest line, or the easiest way to checkout, and you get frustrated if the process isn’t smooth. It’s just the same on the Web.

Even if you think you’ve gone beyond the things I mention above have you gone far enough? Are you watching your logs and other telemetry to see what fields users are stumbling on? Could you streamline the process further?

Your challenge: As designers and developers you should embrace the opportunity to streamline your users experience, and use every tool at your disposal to deliver a great user experience.

Edge Case Design: Door Handles

March 18, 2011

I was looking for more examples to support my earlier post on Edge Case Design and walking out of the car park this evening this occurred to me:

How do you design a door handle that works equally well for a child or a basketball player?

Image001

The typical horizontal bar that works for the average height person doesn’t work for either of those extremes particularly well (and actually is awkward for a lot of sort-of-average height folks), but imagine if you were to rotate the bar so it was mounted vertically and you can easily cater for the edge cases… and in doing so have a great solution that fits all of the 80% median part of the curve as well. No matter how tall you are simply push against the part of the bar that falls most comfortably to hand to open the door.

I am starting to think that there’s something in this Edge Case Design philosophy… can you think of other examples?

Facebook is wrong. The social graph isn’t flat

March 17, 2011

Many years ago when I was starting out in the workforce the brother of a good friend passed away as a consequence of a big disease with a little name and afterwards I did some fund-raising work for the hospice where he had been cared for. I mentioned it to a co-worker who didn’t think about the consequences and, thinking he was doing the right thing, tried to get others to support an event I was involved in. Short term the upshot was pretty bad with people assuming I was either gay, or unwell myself and reacting accordingly. Luckily in this instance we were able to clear up the misunderstanding and in fact raised both support and awareness.

But that’s not always the case when groups overlap and an innocent comment from one world crosses into another.

(more…)

Optimize UX by Designing for Edge Cases

March 17, 2011

One thing I have learnt over the years working on sites like Big Brother and rushTV with hundreds of thousands of active users is that no matter how much time you spend fine-tuning the basics it’s the edge cases that cause you most problems.

So… why not turn it around and make sure you define the problem and then focus on optimizing the user experience and workflow around the edge case and maybe you’ll end up with a pretty good solution for everyone?

For web design a lot of the outliers are going to be around usability – optimizing colors and contrast, ease of navigation and captions for audio content etc. For the real world the challenge gets a little more interesting.

At the moment I’m dealing with two examples of processes where rather than keep usable workflow front of mind they have accreted layers of complexity over time and no-one wants to touch it for fear of unearthing a monster.

The first is the US immigration process to go from an E-3 to H-1B and then Green Card. Rather than try and explain that particular problem I’d simply point you to this flowchart (just for the Green Card application) and ask if it’s rational or even fair for people stuck in the process (some steps can take years even if all the paperwork is in order)

Image002

The immigration process is, by necessity, a complex one but when you look at how the system functions today – with a lot of uncertainty for those stuck in it – you have to wonder just what inefficiencies and loopholes exist that are costing the country money and not protecting its borders in any meaningful way.

The other process that’s familiar to people almost everywhere, but particularly topical here in the US at the moment – Taxes.

(more…)

Passwords

December 13, 2010

Following a recent scare about password security folks have been asking what they should do to keep their information safer on-line.

Well, the obvious this is not to use the same password for every site, but it’s really hard to think up and remember new passwords for each site.

A couple of quick and easy ideas are to pick a word you can remember (but not something easily identifiable with you) and add some letters from the site you are visiting to make it unique.

For instance if your chosen phrase is “cheese” and you are creating a password for Twitter you could take the first two consonants from the site name (tw) and combine them “twcheese”. You could make it more complex by adding a special character and adding mixed case “tw$Cheese” or substituting numbers for letters “tw$Chee5e”. In the same way your password for Facebook would become “fb#Chee5e” – easy to remember, because of your rule, but hard for someone else to guess. If you’re feeling like making it even harder you could take those two consonants and shift them on the keyboard… up a row or across a character so the password becomes “gn$Chee5e” (f becomes g, b becomes n. The p, l or m would wrap to q, a or z for instance)

Of course this still means remembering the passwords, and sometimes a site may have specific rules that break your usual pattern (minimum or maximum length, complexity, use of special characters etc) so it’s nice to have a tool to help with that…

Image001

I use KeePass to keep track of those passwords for me (both ones I create and also for some sites I get it to generate random ones for me). It’s especially handy because for a lot of sites I simply have to navigate to the site and hit the hot-key and it will auto-complete username and password fields for me, so I don’t have to leave any information in my browser. KeePass secures your password collection against a master password (so you only have to remember one thing) or uses a physical key (so as long as you keep them separate it’s very secure).

Because I use a couple of machines I also use the KeePassSync plugin which lets you sync between Amazon S3 storage or DigitalBucket (a free online file storage platform). The only thing I wish I could do is carry the passwords around on my phone and use Bluetooth pairing or a USB connection to make sure I always had them to hand.