My First Usability Test
Published on
Okay, I didn't actually conduct my first usability test. However, that made things even more interesting because I realized once you grasp the ideas in the book Rocket Surgery Made Easy by Steve Krug, you can't help but notice usability problems!
How It Happened
I was building a simple app to practice motion animations, which you can check out here. As I was building it, I kept showing it to my wife—not for usability testing, just to see what she thought. I'll refer to my wife as the user in the post so its feel more like a usability test 😁. Something she did piqued my interest and a few minutes later, I realized I had just detected a usability problem!
Problem 1: This Looked Fine—Until Someone Used It
During development, I used the app several times and never noticed this! See if you can spot the problem. Below is the mobile screen, what would you do to start the game?
If you guessed you would tap the "Start" card, you are right! However, maybe you were extra-conscious and actually read the text "Click Start to begin!". Now, guess what the user did?
She tapped on the "Click Start to begin!" banner (maybe you thought this too). It immediately occurred to me that the banner looks like a button! How did I not see it though I tested it a 100 time? Because I was tied into the design. Now I truly understand this quote from the book:
Many of the most serious problems are lying around in plain sight, and almost everyone will run into them.
I fixed it by removing the styles that made it look like a button and placed an info icon next to it:
We should test usability fixes such as these in the real-world but as this is a hobby app, I didn't do it.
Problem 2: I Knew What It Was—She Didn’t
The below screen appears when the About button is clicked:
Can you guess what the user did to get back to the game?
She clicked the back button of the browser! This doesn't look like a popup dialog and so the user thought hitting back would get her back to the game. I fixed it by making it look like a popup:
Again, such usability fixes must be tested in the real-world. We are unsure whether people refrain from hitting the back button to return from a popup dialog. Given that the ARIA guidelines don't mention the support for back button for closing a dialog, we can safely assume its not required.
Conclusion
Even though it’s been a few months since I read Rocket Surgery Made Easy, actually experiencing these usability problems firsthand really drove the point home. We definitely cannot replace professional usability testing, but sometimes all it takes is watching someone else use your app to spot problems you didn’t notice after a hundred tries. I’m definitely convinced now that simple usability testing is super worth it, even when you are not a professional!