Glossary Redesign

We’re always asking ourselves how we can help users when they get stuck while working through our courses. I had an idea at a company hackathon that turned into a big project.

For the past few weeks we’ve been running my idea as an experiment: when certain users write code that returns a common syntax error, we show them a snippet of code from the glossary that’s an example of what they were trying to do.

The idea was that people need to see examples of good code before they can learn how to write good code.

In order to do this we had to redo the internals of the glossary to be more dynamic. With that done, another great result has been that we were able to hand over editing privileges to our moderators, who have been thrilled to take ownership of this part of the site and improve the content. They’ve been doing a good job of cleaning it up and adding to it, and this will be an on-going thing.

The best part of this is that as the moderators improve our glossary, the code suggestion feature will get smarter and show more examples! They come right from the glossary.

The overhaul was also aesthetic; the glossary is now much prettier and easier to read. The typography improved thanks to some expertise from our designer Jason and the code samples now match the color of our code editor.

Go take a look!