GAAD: Usability Observations about Virgin, CarSales and National Rail

News & Events
#1

If you’ve been following our GAAD celebration project you’ll know that we’ve just completed Step 1 where we asked you to nominate websites.

You did a stellar job of that so now the fun starts!

@Lukcha @Dean and I have selected three candidates for review.
Those sites are Virgin Australia, CarSales.com.au and National Rail.


The plan now is to discuss usability issues, share our thinking, and get expert insights about possible solutions.

1437×780 516 KB


1438×781 470 KB



1440×782 505 KB



To get started, all you have to do is share 1 observation about poor usability. To give you some pointers, Luke has just written an amazing article on how to run an heuristic evaluation. If you want even more good reading, check out NN’s article 10 Usability Heuristics.

We’re really looking forward to hearing your thoughts – whether you’re a UX practitioner or completely new to the scene, when it comes to usability we all know what we like and what we don’t, and every opinion is valued.

2 Likes
#2
#3

Well this should be interesting. I spent about 5+ minutes each on the Railway and Car Buying site and I couldn’t find anything that I could say was a Heuristic issue - unless you count being somewhat bland and unsurprising. They both seemed to function as they should.

1 Like
#4

Hey Steve. Try use Car sales with only a keyboard - you can’t get to many of the fields. If you’re using voice over or JAWS you can only get to keyword and cannot filter your results. You also can’t learn much about a car, you can only “enquire”.

Sure, blind people might not be buying a car for themselves, but surely the website should be usable for them?

4 Likes
#5

@kayla_j_heffernan1 Going along with this, one of the things I first look for in a site is how it functions for colorblind users. It’s fairly easy to bring a screen cap into Photoshop and turn the image to grayscale to observe potential usability issues when color information is eliminated. It’s also a great reminder that while color cues are useful, they shouldn’t be relied upon to direct a workflow or process.

2 Likes
#6

I’m going to be writing on Virgin Australia’s US English website because it was on top of the list and I’m lazy. I’ll be using Ben Shneiderman’s The Eight Golden Rules of Interface Design as my heuristic set, and apply my analysis to one single rule:

Strive for Consistency

Typography

One of the first things I look for in a website is consistent use of fonts and sizing, as I consider them paramount to ease of use and navigation in a website. I use Fontface Ninja to evaluate different fonts and sizing as they display on my screen. A quick dash through the different fonts reveals that the following fonts and sizes are used on the site:

  • Droid Sans Regular 11pt
  • Droid Sans Regular 12pt
  • Droid Sans Regular 14pt
  • Droid Sans Bold 12pt
  • Arial Regular 11pt
  • Arial Regular 12pt
  • Arial Regular 13pt
  • Arial Bold 12pt
  • Arial Bold 13pt
  • Arial Bold 14pt
  • Proxima Nova Regular Old 11pt
  • Proxima Nova Regular Old 12pt
  • Proxima Nova Regular Old 15pt
  • Proxima Nova Regular Old Bold 17pt
  • Proxima Nova Regular Old Bold 18pt
  • Proxima Nova Regular Old Light 14pt
  • Proxima Nova Regular Old Light 16pt

…and possibly a couple of other sizes and varieties that I may have missed.

The three individual font faces are not an unreasonable number, but the variety of sizes is downright maddening, leading to subtle inconsistencies that make it difficult for the eye to properly track changes and interpret contextual meaning of elements.

Navigation

Virgin has chosen to use their “Virgin Red” color to denote interactive sections (buttons, links, etc.), except for when it hasn’t. Its “Holidays” page, for instance, has several different red-colored text pieces that are not interactive, compared to similar layouts on its homepage that are interactive (see the pricing for each potential trip).

Additionally, the designers have decided to use Virgin Red as the color for different infoboxes and boards, making it more difficult to differentiate between interactive and non-interactive elements.

To add fuel to the fire, some interactive links and elements are dark gray, for some reason. This color is also used for general typography throughout the site, making it downright impossible to find all interactive elements on the page.

I can appreciate that Virgin is working with a limited color scheme due to its corporate identity (red/white/gray), but the lack of consistency in applying those colors has made navigation more difficult than it needs to be.

I’m having to cut my analysis short to get along to a couple of pieces that need my attention this morning, but I’m glad I could provide what I did. I may come back and add more later on as time allows.

6 Likes
#7

Great job Doug!

1 Like
#8

That’s a good point. At SEEK we make sure not to say things like"Click the pink button" because not everyone can see that it’s pink (or see the button they’re clicking). We also use colours with at least AA contrast accessibility. I’ve been using www.accessible-colors.com to check combinations

1 Like
#9

I’ll go through nationalrail.co.uk on my tablet tonight. It’ll be user journey focused mostly but with some issues about cognitive load and reassurance.

I use the site frequently but never feel very confident about buying tickets.

#10

Another important point is not only the colour, but the input method.

“Click the pink button” - implies that the person visiting your site is using a mouse as their input device. I think the mobile boom has had a great impact on accessibility, as it has forced people to think beyond mouse, keyboard, and screen. Am I tapping? Am I pressing? Am I clicking? These things are solved by focusing on the action being performed.

#11

Great post @dougcollins! - I mentioned something on the Slack channel which may also be of interest. Vision changes, and as we get older our eyesight deteriorates. 12px doesn’t really fly! It’s interesting that the default system font size (1em) equates to 16px. Designers were guilty of immediately changing the font to 0.75 without thinking about the consequences. Fortunately we seem to be seeing the end of those days. Big text doesn’t just help people who have low vision either, even with 20/20 vision I’ve seen people bump up font sizes to improve their reading experience.

http://www.aoa.org/patients-and-public/good-vision-throughout-life/adult-vision-19-to-40-years-of-age/adult-vision-41-to-60-years-of-age?sso=y

1 Like
#13

I’ve had a very brief look at the Virgin site. At first glance I’m struggling with both the text/background contrast and the small font size (ironic given the same issues exist on this site).

We have an idea and need your feedback please
#14

I’ve created some shared Google spreadsheets that collate the findings so far:

For everyone who hasn’t chipped in yet but would like to, these spreadsheets break things down so that you’re prompted with specific heuristics, and it is easy to share a single finding or two.

Have a go! =)

1 Like
#15

Great idea @Lukcha – thanks!

I have cool news. Derek Featherstone is going to join this project to give us some expert direction!

I’d love to hear your thoughts on these sites @kacheekmonstar

#16

Derek is hands-down the expert to talk to about accessibility!

#17

And one of the nicest guys in the world!

#19

Next up we’re going to be conducting an heuristic walkthrough in our Slack channel. We’ll pick one heuristic and work through each of the sites together.

You can find out more information about that session here.

In the week or so following the session we’ll be inviting Derek Featherstone to weigh in with his expert opinion. I’m excited!

1 Like
#20

Sorry for dropping the ball with keeping you all in the loop here – things got a bit crazy! Thanks to those of you that joined us for the analysis, it was an amazingly productive and insightful session.

Quick update on the current state of play: @feather is reviewing our spreadsheets and he’ll give us his expert insight when he gets a spare second. I’m looking forward to it – Derek is one of my favourite people.