Using WhatUsersDo we asked users to shop for a present for a five year old boy and an eight year old girl and to go through the purchase process stopping before payment.

Users were asked to think aloud as they went through the task and their voices and screens were recorded.

First impressions: online vs offline toy stores

When it comes to designing for online it is most often recommended that the user experience should reflect the offline equivalent as closely as possible. Not so in this instance.

Walking into a large toy store is more than an assault on the senses. The very nature of the products themselves means that there are many colours, noises and shapes competing for our attention and inevitably so. It will never be like walking into The White Company.

This may be initially overwhelming but we soon see the sense of order created by well organised shelves and aisles where items are grouped by age and category.  

Online however we are relying on more comprehension than is necessary in an offline store. Users must understand the path available, make a decision and click on something to proceed so if you bombard people’s senses from the off then they will struggle.

Home pages

Thus users’ first impressions of the ToysRUs site were understandably quite negative.

The navigation structure and home page design have many competing elements to them making it extremely busy to look at.

There are a lot of options to look through before knowing where is the best next step. There are three levels of navigation options with secondary type links such as store finder and recruitment taking prime position at the top.

Each of these has an icon which makes it even heavier on the eye. Furthermore the page features a banner ad for external products or services which users rightly found rather strange on a retail site.

On occasion these adverts do not even display correctly, showing a ‘Server Error’ message. This can seriously erode trust in a site.

Into the page the user is assailed by an automated scrolling banner and bombarded with further offers of free items. There is also a persistent newsletter pop up to further aggravate users.

By contrast, users’ first impressions of the Smyths site were positive.

The home page was far more appealing with a good clean layout of navigation options and an offer banner which is user initiated.

This calmer page gives users better opportunity to choose their next steps.

 

Browsing: navigation and product categorisation

Once into their shopping, users found the main navigation options initially simpler on Smyths than on Toys R Us.

Smyths has five main headings in its navigation bar compared to a whopping eleven in ToysRUs which one user described as ‘daunting’.

Both have rollover menus with sub-categories with a third level menu of toy types and brands. ToysRUs has the better toy categorisation of the two – the second level menu on Smyths is possibly too brief and its third level categories are an unhelpful mishmash of brands and categories.

ToysRUs makes a clearer distinction between the two but it actively promotes certain brands so users struggled if what they were looking for was not one of those e.g. Minecraft as this clip depicts.

Whilst users initially appreciated the simplicity of the Smyths menus they did welcome the ability to be able to start browsing by an age category on ToysRUs.

Narrowing down choices

Filters

Once into the results pages users had difficulty on ToysRUs narrowing down their choices using the filters.

Despite having selected the filter for the 5-7 age category this user is understandably frustrated at still seeing toys for other ages in her results.

This is a basic flaw which should have been picked up in testing before making it anywhere near the customer’s interface.

The filters on Smyths were more accurate but did not include a gender filter which users would have preferred.

Images

Smyths makes the most of product images, opting for large thumbnails with a three column layout.

This can make all the difference for someone who does not know the products well. Also, users should be able to read the text descriptions, but some found this difficult on Toys R Us.

Both these issues are portrayed in this clip:

Gift ideas

Whilst the sites strongly promote certain items both could do better to provide suggestions for customers who don’t know what to buy.

Smyths has a gift finder tool which enables users to choose gifts by gender or not which is good if you want to avoid gender stereotyping. The results however are rather hit and miss with gifts for a boy between six and eight ranging from an ultimate spider man figure to a purple doll’s pram and a play kitchen.

These items don’t even seem age appropriate for that category before never mind the gender.

Purchase process

The purchase process on Toys R Us is an unintuitive two step procedure. The user is first required to go through a registration process and instead of proceeding through to payment details the system dumps you back in the shopping pages where you have to go to the checkout again.

I’d be very interested to know how many people abandoned their purchases at this point.

Conclusion

The two sites sell a similar range of products to a similar market and while Smyths is not a perfect experience, I’m curious as to why the ToysRUs site seems so unloved to have allowed it to lag this far behind its competitors.

 Perhaps next Christmas I’ll have the pleasure of reviewing a brand new shiny site. If so I hope it will be user tested first.