< Back to portfolio

Improving the CoderDojo sign-up process

CoderDojo is a charity that helps young people learn how to code. They have a website which lists all of the groups that people can attend, worldwide. I contacted them and offered to help with their design, since they don't have a full-time designer on staff.

They agreed, and I decided to focus on the sign-up process, since this is the first experience any parent or child will have when they want to join a group.

User Testing

After running through the sign-up flow myself to understand how it worked, I asked two people to complete a task while I recorded the screen and their voice (With their permission). They needed to sign up to a group and add their 11 year old child to their profile.

These testing sessions highlighted plenty of issues with the sign-up process.

Communicating the issues

I edited the long video from each testing session down to show just the times when participants were having the most trouble. I find this "trouble montage" to be effective. Here's the response I got from an engineer at CoderDojo after sending over the video:

This is great. It really highlights some key issues parents have getting started. At the end, she never got her child added and into the Dojo, and I can absolutely understand why.

Figuring out what to fix

I mapped out the flow a parent takes when signing their child up to a Dojo. Next I wrote all of the issues I had seen in the user testing on post-it notes. These went next to the point in the flow they affected.

The CoderDojo sign-up flow, with problems

This was helpful for showing where most problems were happening, and what should be prioritised.

Wireframing

I focused on low hanging fruit for the first round of wireframing. Quick fixes mean quick results, and because my relationship with CoderDojo is new I didn't want to start suggesting a huge restructuring of the sign-up process. If a solution can't be implemented, it's not a solution.

I picked five issues, and put together wireframes for solutions. I did some "guerrilla" user testing on these simple fixes, by running them by a colleague and asking him what he thought each feature did. I made some changes based on that feedback, and then sent all five wireframes over to CoderDojo in a PDF.

The wireframes I sent over to CoderDojo

CoderDojo seemed pleased:

Awesome! Subtle changes that can make a big difference to users' perception. Really helpful.

As of writing up this project, CoderDojo has not made any of the changes to their website.

< Back to portfolio