A little over a year ago I reported on Andy Budd’s talk at Web Directions UX08 and his ideas on assessing and measuring the user experience.
He also talked about adding value to some of the empty, mundane but necessary web site processes (that is, load screens, error messages, user instructions) by injecting some fun, soul, and even humanity into them.
Examples we talked about included:
- Picnik‘s loader screen, which is accompanied by progress commentary: “spreading out the blanket … picking blueberries … floating kites … making sandwiches … “
Innocent Smoothie’s packaging, which includes the simple
sentence "Stop looking at my
bottom!" printed on the base of the box.
Both are copybook examples of better user experiences because they flatly refuse to follow the standard charmless convention and instead dare to inject a touch of warmth.
But what happens if “warm fuzzies” is ALL you deliver to the user? Is it still a win?
I’ve been thinking about exactly that question after a friend sent me a "Hey, you gotta see THIS!" link to the HEMA web site. For those unfamiliar with the brand name, HEMA is a large Dutch department store chain.
Check the site out for yourself if you like (assuming you’ve yet to come across it before — it’s been online for at least 18 months).
Otherwise, here’s the executive summary: the site renders as what appears to be a garden-variety, IKEA-like online store: navigation tabs along the top and popular products displayed in a grid. Yawn. yawn.
That’s when reality seems to break, and strange and wonderful stuff start to happen.
It all begins when a plastic cup tumbles over, bumps the sticky tape, and a domino effect is set in motion. The tape then crashes onto the stapler before squishing the cake, noisily sliding down the xylophone, and knocking over the fluorescent pens like skittles.
This chain of slapstick events continues, drawing ironing boards, blenders, yo-yos, coat hangers, and kettles into the growing maelstrom before eventually breaking out into parts of the site navigation and text.
By the time this sequence of events has all played out, the tabs are torn and frayed, the navigation text has collapsed into a puddle, and confetti flutters about from above. Very, very cute.
Now, let me say straight up, this is a wonderful idea beautifully executed. It breaks boundaries, delights, shakes you out of your surfing stupor, and triumphantly shouts "HEY YOU! Y’know what? We are different!"
The only problem is, that’s where I believe the relationship stops for most users. This is no easter egg or practical joke overlaying a standard online store. Though HEMA has a rather extensive web site, there’s no obvious link between it and this popular online practical joke. The logo is unclickable. The site navigation and text links appear to be clickable, but, in fact, aren’t.
Whatever warm and fuzzy feelings you might be left with after the show, outside of forwarding to a friend, there are few ways to show your love.
Andy Budd talked about plotting the user experience as a graph along a time line. We might assume that users begins their HEMA site experience in a relatively neutral emotional state. As the experience continues they’re perhaps first surprised, then delighted and entertained.
But, what if you wanted to:
- tell HEMA how awesome their site is?
visit HEMA’s About page to find out what sort of
firebrand, thinking-outside-the-box company would do such a crazy thing?
locate the nearest store to purchase one of their charming and zany
investigate the opportunities for employment at what appears to be a
Well, you’d probably be out of luck. Short of editing the address bar, when the gag finishes, the show is over.
And the greatest irony? The HEMA joke web site has been so wildy popular with bloggers and on social networks that it outranks the genuine HEMA site in almost any general web search. In Googles eyes, HEMA is a purveyor of fine jokes.
Now, no doubt web dev types like us have been sharing this link and "oohing and ahhing" forever. In truth, most of us would love to be offered this kind of fun work.
But as sublimely clever as the animation is, I have to wonder if this project, and the buzz it created, has translated into anything particularly useful for the HEMA business.
What’s more, I wonder how many users have ended up feeling disappointed, frustrated, or confused by being unable to find some of the "bread and butter" basics like locating a store, giving feedback, or asking a question. They may feel like they’re at the right place, but no-one wants to talk to them.
What do you think? Is this marketing brilliance or a wasted opportunity?
From SitePoint Design View #63.
SitePoint WordPress Restaurant Theme
SitePoint WordPress Ecommerce Theme
SitePoint WordPress Portfolio Theme
User Interface Design with Sketch 4
Photoshop for Web Design
Introduction to Photoshop
Designing UX: Prototyping
Researching UX: Analytics
Designing UX: Forms
- 1 How Writing Our Book Taught Us About Killer Prototyping
- 2 Introducing Portfolio WordPress Theme – and the Design Decisions Behind it
- 3 How to Turn Your Sketch Files into Working Prototypes with Origami
- 4 How to Handoff Designs with Sketch and InVision
- 5 Killer GIFs: How Can an Animated GIF Become a Weapon?