Onitsuka Tiger traffic up

The Onitsuka Tiger web site has been refreshed a couple of weeks ago. Our web agency CloudRaker and our technology partner The Plant implemented a raft of relatively small changes that had sharp impact on the site’s usage patterns: page views up by 135%, bounce rate down from 30% to 12%.

So how did we achieve such results?

Since the launch of the site, we’ve been planning and implementing changes:

• new content, which requires production and management efforts–still ongoing with exciting new stuff coming up in the fall
• interface tweaks, to ensure more convenient, intuitive and comfortable navigation
• technical changes to improve our ability to maintain the site, and to increase the quality of the delivery to visitors

The site has been designed, since the start, to work across several countries and languages, a fairly reasonable expectation surely, for a global web site, but which does have costly consequences. Indeed, because we wanted to enjoy a unique layout and interaction method reminiscent of a shoe store’s wall, we went for a full-Flash interface. A manageable and scalable Flash web site: easy to say, but a bit harder to actually build.

Aside from the fascinating technical and organizational challenges, we ran into the obvious trap of download volumes. With the initial screen clocking in (from the top of my head) at nearly 2 MB, users with anything less than an ideal connection to our server were in for a very very long wait before being able to see anything on the home page.

Also, in order to enhance the browsing experience, we pre-loaded the thumbnails used to display the navigation walls. That way, when the user clicked on the “collection” section, the products were all available and interaction was unambiguous. I was pretty happy with the loading animation: the section title’s box would act as a progress bar.

However, we found that our hosting, while very well connected to central Europe, was poorly equipped for trans-oceanic links. For people with a less-than-ideal connection, the usability of the section box as a loading indicator became dreadful: since the percentage bar was moving so slowly, people did not identify it as such, and clicked around on inactive links, to no avail, until it “magically” started working (in many cases after several minutes!) and the section was displayed.

With this update, we’ve introduced loading bars that look like loading bars, and sit in the middle of the screen, blanking out the content area until the required elements are available — it’s not quite as visually elegant as the previous solution, and certainly seems to clutter the experience. But it also dramatically reduces user frustration: users know exactly what’s going on. On the balance, it’s a clear net gain.

We’ve also decided to reduce pre-loading to a minimum, so as to enhance the immediate reaction of the interface (it needn’t wait for the pre-load to respond to user interaction). This required developing a display system where thumbnails are displayed as they are loaded, which turned out looking rather nice. There are fewer dependencies in the interface. For example, in the collection, you can start interacting with the filters before all product images are loaded.

We moved the sites to Amazon’s cloud hosting platform, and added a CloudFront edge distribution service which ensures static files are served from a location near the user. This changed the experience quite radically: if you’re outside of Europe, try the UK site, I believe you’ll find it is served at a reasonable speed. The results were so good there that we were able to launch the site in Australia, without having to find local hosting, nor having to deal with content replication across platforms. (The US and Japan/Asia are still on distinct platforms.)

So, while we still have tons of improvements planned (especially under the first point above, new content), I am pretty happy with where we got with this release. In a way, it’s the site as it should always have been: there are no major impediments left, stemming from our choice of development technology.