Step by Step Instructions - Toast

1. Place toaster on a flat sturdy surface.
2. Plug toaster into powerpoint.
3. Select a setting for the darkness of the toast, 1 - lightest and 8 - darkest.
4. Place bread into the toaster.
5. Push down lever.
6. Wait for toast to spring up from toasting. (Is the toast dark enough?)
7. Leave toast to stand for a few minutes to cool. (Is the toast cool?)
8. Remove toast and serve as desired.

Flowchart - Toast

Flowcharts are a graphic illustration of the steps needed to arrive to the solution of a problem, they can range from something as simple as a flowchart for Starting a Car to something as complex as a flowchart for Changing the Motor on a Car.

An example of a Flowchart for Making Toast:

Storyboarding - Toast

Esentially, story boards appear as a large comic strips of propsed interaction for designers to visualise scenes, and the interaction within a design. They usually conisit of a series of illustrations displayed in a sequence.

Example of a Storyboard for Making Toast:

Mood board - Johnny Smith (User Persona)

Mood boards generally consist of images and text by choice of the creator. They are used by designers to help develop their concepts and to help communicate to other members of the design team.

An example of a Mood board for Johnny Smith a 75 year old retired carpenter:

Web 2.0

• Definiton:

Web 2.0 is the second generation of web development and design.

"The concept of "Web 2.0" began with a conference brainstorming session between O'Reilly and MediaLive International. Dale Dougherty, web pioneer and O'Reilly VP, noted that far from having "crashed", the web was more important than ever, with exciting new applications and sites popping up with surprising regularity.

What's more, the companies that had survived the collapse seemed to have some things in common. Could it be that the dot-com collapse marked some kind of turning point for the web, such that a call to action such as "Web 2.0" might make sense? We agreed that it did, and so the Web 2.0 Conference was born."(O'Reilly, Tim)

• Examples:

A sense of Web 2.0 can be seen in the difference from the original Web 1.0 and the Web 2.0. This can be seen in the table made by O'Reilly Media which highlights the most prodominentley used examples of Web 2.0:

Image screencapped from Oreilly.com

Interactive Design

• Definition:

Also known as Interaction design which involves the rapid use of interactivity to create engaging and user friendley experiences. It is the discipline of defining the behavior of products and systems that a user can interact with.

• Great Web Design Examples:

Habbo Hotel:
http://www.habbo.com/

Habbo is a highly interactive virtual community in which you are able to create your own "Habbos" who are you identity whislt you navigate around the site. Habbo allows you to interact with others and to create your own surroundings etc.

Get Out There
http://getoutthere.qld.gov.au/

This is a website promoting a Survival guide for young adults in Queensland, Australia. It is a highly appealing website and it contains many intersting interactions for the viewer to explore. This site is succesful in providing clarity and turns data into great information.

Every Breath is Design: http://www.designbygoo.com/

This is a website for a Bangkok bases Creative Design group. The website allows you to change the background of the pages, and its a very interesting, clear and easy sight to navigate around.

Information Design

• Definition:

Sue Carliner defines Information Design as the "visual method of explaining and interpreting complex information and data to help the user achieve a particular object."

The three main types of information graphics are:

Navigational

Instructional

Statistical

• Examples:
  

A Navigational example can be best shown in the London Underground Subway Map:

Postcard. Flickr - London Underground. Digital image. [London Underground Map]. 1985. Subway. 13 Mar. 2009 .

An Instructional example can be best seen in how to use the site Jott:"Jott.com Voice to Text Notes & To Dos ." Jott.com Voice to Text Notes & To Dos. Email & Text Message Reminders. Hands-free Email & Text Messaging. Group Messaging.. 13 Mar. 2009 .

Satistical Information Design can be clearly seen in this graph for the statistics of an Old Statium vs a New Stadium:

Unknown. Flickr - Old VS New. Digital image. [Old VS New]. Stadium. 13 Mar. 2009 .