Wednesday, September 24, 2008

Engineered learning

When it comes to making tutorials, there are key aspects that need to be fleshed out before you dive in and make it - aesthetics, content, structure, and one that is overlooked by many, conciseness. Conciseness is a huge problem with many tutorials I've read, and its one that many could avoid by following a few simple steps:
  1. Use diagrams more often. Understanding concepts such as prefix trees and mesh networks with only text can be a painful process for people with no experience in the subject. A diagram gives the reader a visual way of interpreting the information. Most importantly, diagrams let you show how something works, rather than explaining it. This in turn lets you explain less about the concept at hand and let the person absorb the information visually.
  2. Use screenshots. They say a picture is worth a 1,000 words, but those people obviously haven't seen some of the obnoxious photos people post of themselves on Facebook that only say "Look at me, I'm an idiot!" When writing a tutorial, the images will be professional and have a point, or else you're wasting your time even collecting said images. For example, if the person must insert some information into some dialog box in a GUI, rather than telling them what to insert with a step by step process, show them a screenshot of the GUI filled out with the correct data. If you're explaining how to do something in a videogame, show a screenshot of it being done in-game.
  3. Get to the point. You might be surprised at how perceptive people are at understanding concepts explained in short - if you really think that the user needs to know the details of something, have some sort of information bar on the side or some dictionary containing a more detailed description of the concept. It's easy to get lost in a wall of text. Spread it around. This will let you get to the point. Don't ever be afraid to cut out large chunks of text - it may improve the tutorial drastically.
As well, good structure is key to a successful tutorial. You need to have either prerequisites or at least cover the concepts that the user of the tutorial must know to move forward, if there are any. Never talk about something without being extra confident that the reader is prepared to hear about it. You must walk before you can run, and you can't expect someone who lacks the skills or knowledge to complete your tutorials to actually accomplish anything with them. Also, make sure you cover relevant information, and nothing else. If there is something that the reader might want to check out, link them to where they can get information. Don't confuse the reader by jumping around topics.

The content of each tutorial has to be useful, too, and it has to be easy for the person to understand, so content and structure are very dependent on each other. Include examples or analogies in your tutorial, so the user can relate what you're talking about with something they may already have knowledge about or experience with. If its a programming tutorial, show some code examples of how to use the API or framework or language. Examples are great - do not be afraid to use them liberally no matter the subject.

Aesthetics are also very important, and I would argue just as important as the other key parts of a tutorial as they tie right in with the structure and how you will lay out the tutorial. Man pages worked nice for showing a user examples of how to use Unix commands and what to do with them, but many of our goals and projects have become larger and require better ways of structuring the information, and straight text is just not going to cut it in most cases. Have areas where you can put less relevant information, and if the user wants to check it out, they can. Format your text. The user should know what they're looking at based on how the text looks. If you're writing a programming tutorial, have code blocks with courier font or any other fixed-size font.

Don't worry, the irony of writing what could be considered a recursive tutorial is not lost on me.

No comments: