playing with my hairso what?

You finish a new design, launch a new site and it always come to your mind, “I should have asked more people to test”, get more feedback. At least to me, I always feel like I would like more criticism then only “the client” who hired me as a Designer.  It’s amazing to actually be able to hear from a “real” user, what exactly he thinks about that design? How was his experience while navigating? What could be improved?

This information is invaluable and I never had much of experience with UX testing before I worked 3 years with a software company.

So, I had been researching a lot about tools that could easily help me “learn” and “test” at the same time. And I’m positive that Usabilla is one of the great ones I found.

Usabilla is an online Usability Testing Tool that combines “power with simplicity” – mentioned by Mashable Social Magazine. You can easily create tests with default or custom questions, upload a screenshot of your design or type the site url, and finally publish your test on facebook, twitter, send the link to friends or specific list of test users. Participants will be able to “click and point” and add comments to the areas they like and the ones that need improvements, based on your test questions.

The only one feature I would suggest Usabilla to offer is the option of showing one or multiple comments on the screen before saving the png file. This could be very useful for me at least, so I could send my clients the most important comments right there on the screen, since users are pointing to the screen, they are not actually writing what exactly they are talking about it, they assume we know by the “point / mark”.

Anyways, the tool is definitely powerful but not cheap. You can run the first test for free, but after that you need to sign up to one of their yearly plans ($49 for 10 pages / $950 for 250 pages).

So, I decided to test it out this new tool with one of the sites I had designed this year  – VipaSolutions.com. And here are some general results and comments:

General Results:

• 9 graphics (based on 9 different questions)
• 15 tests (different users)
• 43 comments (the best part of the results)
• 379 points (different areas pointed by users)

1)  Click on the things that draw your attention the most

User Comments:

• Font, upper right draws attention (related to vision + passion)
• Who are these people? (related to the logo)
• This draws my attention negatively; font’s too small, hard to read. (related to “Empower your Agency button”)
• “Best practices” is, to me, a bullshit buzzword
• So is “solutions”. Don’t sell me a solution until you understand my problem.
• MarComm — why abbreviate? (Also, this note window appears UNDER item 4, which is a bug in the survey software.)
• This attracts my attention, but for no informative purpose. (related to the main image of vipasuite backend)
• Holy cow–teeny tiny fonts on a 1650×1024 screen. (related to industries text – below each image)
• What’s this doing here? (related to “Industries” title top of social media image).

2)  Click on the most appealing images

User Comments:

• No images really appeal. My eye went to the Healthcare image first.

3)  Click on the elements you like on this page

User Comments:

• Frankly, meh. (related to the blue gradient on the background)
• Great typeface (related to font used for “Vipa = {vision + passion }”)What are these going to play?
• They are a little small (related to the main image controls – 1, 2, 3…)

4)  Click on the elements you would remove from this page

User Comments:

• Move it, right justified (related to agency login alignment)
• Maybe create some icons instead of stock photos
• Have a live stream down here (related to twitter feed)
• Who is MarComm Agencies?
• Is this not a complete sentence? Why is there an ellipse? (related to the main image text)

5)  Mark your most important features

User Comments:

• Good, but offer them something for their address (related to the newsletter signup field value).

6)  Where do you click for contact information?

No User Comments.

7)  Where do you click if you want to buy this product?

User Comments:

• I’m not sure the question “Where do you click if you want to buy this product?” applies here. “Use this service?”

8)  Where would you click next?

User Comments:

• The back button. It’s not a service that appeals to me.

9)  Mark the things that you think we should improve?

User Comments:

• Blah blah blah. It reads like something from the Dilbert Mission Statement Generator. (related to the main image text)
• font and size (related to the main navigation)
• Icons, not pictures (related to industries pictures)
• Font (related to the content body text)
• Offer this option before entering the site then delivers a customized site. (related to the two main butons)
• These pictures are all too cliché. (related to industries pictures)
• Drop out the background on the logo…it looks awkward. (related to the logo)
• This area looks a little congested. (related to the right top area)
• The flash menu seems out of place.
• The first place I looked for a contact link was at the bottom of the page, and I just guessed how to purchase this product. Perhaps a “purchase” here instead?
• I know this was just for improvements, but what the hay, the colors are pleasant. (related to the blue gradient background)
• I like this menu. (related to the main navigation)
• I don’t get what this word is for. (related to the industries title on top of social media image)
• I didn’t even know the page went down here….the edge of the top section looked finished and didn’t make me suspect there was more. (middle of the page below industries pictures)
• This bottom section seems disjointed…remember the color balance rule? 60% of a dominant color 30% of a secondary color 10% of an accent color
• Who is MarComm Agencies?
• Remove the ellipse. Make it a complete sentence.
• Make this fit on one line (social icons)
• Redesign to fit on one line (sign up newsletter button)
• I hope this isn’t important, because I wouldn’t expect content like this in the footer. (latest news)
• Why is this here in the header? (vipasuite login)
• I can (sort of) guess that Vipa Suite is a product of Vipa Solutions. So i clicked on this link to find out more information about the product. But it is just a login screen. I couldn’t find anything out about the product so i left.

Conclusions:

This was a great and simple usability test. As a designer I can learn and improve the design on several sections of the site based on the feedback of only 15 people. Developers, copywriters and content strategists can also improve their work after analyzing results like this.

Improving your website based on usability tests can benefit the most valuable part of the website process – the user experience!

If you know of any other great usability tool out there, please leave your comment and share it! Thanks!

Tags: usability, ux

This entry was posted on Thursday, July 22nd, 2010 at 1:32 pm and is filed under User Experience. You can follow any comments to this entry through the RSS 2.0 feed. You can leave a comment, or trackback from your own site.