Information/Instructional Design

Information Design, also known as Instructional Design, involves the incorporation of information to help empower the user to learn something. This may be to learn a skill, such as playing the guitar, or how to cook pancakes. Wikipedia describes Instructional Design as a process that consists of "determining the current state and needs of the learner, defining the end goal of instruction, and creating some "intervention" to assist in the transition."

Three examples of Information Design are shown below, highlighting just how broad the range of information that is being communicated can be.

W3 Schools - An educational website that assists the user in learning basic up to advanced web design skills. The site provides access to tutorials, reference material, examples and even access to certifications for the skills they have learnt.

(click image for full size)

Mr Tones - This site allows the user to access the scripts for creating mobile phone ringtones on the phones built in composer. The user can search for his/her favourite song and access the information that lists the order of key presses necessary to compose this tone on the handset.

(click image for full size)

Ultimate Guitar - Guitarists are able to access tablature of their favourite songs, which can be used off screen or can be printed off for further reference. These 'tabs' teach the user the necessary strings and frets to be played in order to recreate the song.

(click image for full size)

Get toasted!

1. Plug toaster into power outlet
2. Turn power on
3. Remove bread clip from bread bag
4. Make sure hands are dry
5. Retrieve slice of bread from bread bag
6. Inspect for mould and other un-wanteds
7. Drop slice of bread into the toaster
8. Set toasting level - Do you want it lightly toasted or burnt?
9. Using the lever on the side, lower the toast into the toaster until a click is felt
10. Allow bread to toast, being careful that no body parts or other objects are in/around the slot
11. Observe bread - Is it toasted enough?
12. If yes - Press cancel button / If no - wait for bread to pop up
13. Is the toast too hot? If s - Wait until it is cool enough to touch. If not - Remove bread from toaster being careful not to touch any hot components of the unit
14. Prepare with condiments to taste

FLOWCHART

(click image for full size)

INTERACTIVE TUTORIAL
This is an example of instructional design put into a graphic context. This style of design would benifit from being used in a Flash type file.

STAGE 1 - Locate Toaster


(click image for full size)

STAGE 2 - Plug Toaster into Power


(click image for full size)

STAGE 3 - Turn Power ON


(click image for full size)