Tag Archives: ixd

Designing a new interaction pattern for online questionaries

Self-evaluation and 360° feedback surveys are important tools in the human resources toolbox. Sadly, most online self-tests have evolved little compared to other web apps. When Emagister asked me to design their new self-evaulation test, I introduced my own, admittedly small, innovation to one of the test’s key interaction. I’ll explain the story here.

Questionnaires are the opposite of fun

Fact: questionnaires are about answering questions. Fact: answering questions kind of sucks. One more fact: HR questionaries have an added handicap, they have lots and lots of similar questions. The questionnaire we used at Emagister was no exception. It’s called the Holland Vocational Preference Inventory (even the name is long!) and it boasts 60 multiple-choice questions that could bring a 3rd grader to tears. Thanks to the indomitable Alberto Almansa‘s HR wizardry, we were able to cut the questions down to 11 but that’s still way too long. I had to come up with a tiny interaction miracle by making 11 questions:

  • Easy (don’t make me click too much)
  • Fast (don’t make me read too much)
  • Fun (don’t bore me)

Ruling out existing patterns

I tried existing interaction patterns in the hopes they would be usable, intuitive and fast. I always start with the most common design solutions. I really despise forced innovation aka designing to impress my designer friends. Here are some early attempts:

Two part questions

Tag selecting

Standard exam questions

These solutions “worked” but none of them were good enough. They all either required two interactions on the same item: one click to select the item and a second click to rank it.

Dead end? Let’s play

We were pretty frustrated and may have even turned to a cold afterwork beer to ease the pain. That’s when Gustavo and I decided to play. Let’s talk about play for a moment. Play rocks because it distracts you from thinking consciously about the problem in front of you and lets your subconscious take the wheel. Your subconscious eats these kind of challenges for breakfast by repeatedly imagining seemingly illogical solutions to the problem until one sticks and floats up to the conscious brain. I’m a big fan of the subconscious (ask me to show you my Freud tattoo). Play is also great because it’s physical. This is ideal for testing out real world interactions quickly.

The breakthrough

It was while playing that we had our big breakthrough. We could get users to select and rank their selections in just one step. All we had to do was ask users to drag their selection from one side of the screen to the other and to drop it in order of priority. Dragging means just one click and the movement is kind of fun in a nerdy way. Its also fast, even when stretched out over 11 questions. Check out the the wireframes, mockups and final interaction below.

So there you have it. After a bunch of trial and error (and beer), we played our way to a cool new interaction pattern and, hopefully, made the world of online questionaries a tiny bit less tedious.

I originally wrote a draft of this article in January 2012 and have only gotten around to publishing it now. In the meantime I saw Monica Zapata‘s presentation on Elecciones.es at this year’s UXSpain. I was pleased to see they wrestled with many of the same issues and had even cooler results. Well done!

Tagged , , , , , ,
%d bloggers like this: