On the Usability of Codecademy

I asked a friend of mine (who isn’t a coder) if she could try out the amazing Codecademy for me.

She is a smart person, but again, she isn’t a programmer. I thought Codecademy would be a great way to introduce her to programming for the web. As a programmer, I thought it was extremely well made and assumed it would work for anyone.

She landed on the homepage and read the instructions.

She wrote her name (“Elizabeth”), then decided however to change it to the shortened form of her name, “Liz”. To do so she highlighted the whole string she had just typed and tried to press the backspace key to delete it. The whole page disappeared and the browser redirected her to the new tab.

Liz: “Why did it do that?”

Me: “You can’t highlight a word like you’d do in Microsoft Word. You’re in a browser, so the backspace button tells the browser to go back to the previous page you visited in that particular tab. You need to delete the string one letter at the time.”

She reopened the page and tried again, this time things were successful.

Next, she had to measure the length of her name. But she forgot the quotes, so she got this:

Liz: “What happened?”

Me: “What do you think happened?”

Liz: “Some kind of error, but what does ‘Liz is not defined’ mean?”

Me: “You accidentally forgot the quotes.”

Liz: “Oh, OK, let me try again.”

She wrote the first quote but pressed enter before immediately realizing she had forgotten the closing one. As such she encountered the following scenario:

Liz: “I messed it, let me try again.”

Liz: “I typed it right this time, why didn’t it work?”

Me: “Since you didn’t close the first string, it thinks that the second line is still part of the first command. Do you know how to get out of this?”

Liz: “No, but let me try.”

No, she didn’t close the string and pressed enter twice or deleted a bunch of characters (this web REPL allows it, kudos to Codecademy). She simply reloaded the page. Thankfully the same exercise (#1) was reloaded. After completing it successfully though, instead of exercise #2, exercise #0 reappeared, asking her to enter her first name again.

After raising an eyebrow at that point, she went along with it. Next she was asked to try some math.

She can’t be faulted for thinking that “for instance” meant she could try something else. Yet, she got an “Oops, try again.” message.

At that point I suspended this tiny hallway test and I asked her what she thought of this system. She found the site to be a bit unintuitive, but above all felt like she didn’t know how to get unstuck when she made an error.

Now, before you all jump in and tell me that my friend is dumb, that she’ll never be a programmer, or that you can’t idiot-proof a design, keep in mind the very point of this post.

Usability is hard because real users use our UIs and software in different and unexpected ways. Codecamedy did a very good job, but even they left plenty of room for improvement. As web developers it’s our duty to give usability and user experience a significant amount of attention. The UI is the software to the end user.

Get more stuff like this

Subscribe to my mailing list to receive similar updates about programming.

Thank you for subscribing. Please check your email to confirm your subscription.

Something went wrong.

51 Comments

  1. Mike January 16, 2012
    • john January 16, 2012
      • Mike January 16, 2012
      • none January 16, 2012
        • MikeTheInfidel January 17, 2012
    • Zach, Codecademy Co-Founder January 16, 2012
      • Mike January 16, 2012
    • Harry Pachty January 16, 2012
      • nnn January 17, 2012
  2. hod January 16, 2012
  3. Jeffrey January 16, 2012
    • Jonathan Jaeger January 16, 2012
    • Mike McGee January 21, 2012
  4. karatedog January 16, 2012
    • Antonio Cangiano January 16, 2012
  5. Ryan S January 16, 2012
    • Nick January 17, 2012
    • Mark January 17, 2012
  6. Jay January 16, 2012
    • Joey January 17, 2012
  7. Zach, Codecademy Co-Founder January 16, 2012
  8. blick black January 16, 2012
  9. Sigh January 16, 2012
  10. matt harrison January 16, 2012
  11. Doug January 16, 2012
  12. Marc January 16, 2012
  13. Stephanie January 16, 2012
  14. Ronny Karam January 16, 2012
  15. David January 16, 2012
  16. Connie B. Dowell January 16, 2012
    • Eric January 16, 2012
  17. Dan Davidson January 16, 2012
  18. Dave Herman January 16, 2012
    • Amjad Masad January 17, 2012
  19. matthias January 16, 2012
  20. grant hutchison January 16, 2012
  21. Liz Hannaford January 17, 2012
  22. Nico Schweinzer January 17, 2012
  23. Bevan January 17, 2012
  24. Becca January 17, 2012
  25. Sichun Xu January 19, 2012
  26. steven January 19, 2012
  27. Pingback: Rounded Corners 322 – Wat /by @assaf January 21, 2012
  28. Edwin February 12, 2012
  29. Mark McConachie March 4, 2012
  30. Mack March 23, 2012
  31. Kim April 9, 2012
  32. Braco November 6, 2012
  33. Furiant November 15, 2012
    • Tim December 14, 2013
  34. Michael Walmsley March 28, 2013
  35. Tim December 14, 2013

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.