Moodboard

Moodboards are basic design tools, created to communicate a persona’s interests, lifestyles and media consumption visually. It is developed through magazine cut outs to help illustrate the persona’s characteristics. This design creates an immediate and understandable reaction about the persona, without having to read through their details. Mood boards are effective design tools in providing great depth than words alone can provide.

“BBC Redesign – The glass wall.” Liam Delahunty. 2002. 16 Mar 2009 <http://www.liamdelahunty.com/tips/usability_bbc_redesign_the_glass_wall.php>

• Example - Johnny Smith's Moodboard

Making toast for beginners : Part 3 of 3

Storyboard - From steps 3 to 7

Making toast for beginners : Part 2 of 3

Flowchart

Making toast for beginners : Part 1 of 3

Step-by-step text description

1. Plug in toaster
2. Switch power-point on (is it safe?)
3. Put bread in toaster
4. Adjust toaster settings to preferences
5. Push the toaster lever down (does leaver work?)
6. Observe toaster
7. Toaster ready (is it to your liking?)
8. Wait for toast to cool down
9. Remove toast (is it still hot?)
10. Prepare toast
11. Eat toast!

Information and Instructional Design Examples

Visual thesaurus is an online interactive thinking map and diagrammatic system that creates word maps that branch out related words. It is an effective website as it encourages learning through their design technique by presenting word meanings more visually interactive and easily understandable.

• Link - http://www.visualthesaurus.com/

This is an example of Nicholas Felton’s annual report design. The presentation of this design is visually creative as it demonstrates information about the countries distribution period in 2007, with its use of pie charts, it effectively engages the viewer and provides a sense of clearer understanding about the distribution period.

• Link - http://feltron.com/index.php?/content/2006_annual_report_report/

This is an example of the cityrail network map. It is a graphical representation of the rail services in New South Wales. It provides an instructional design helping users of the service travel more efficiently to their destination. This design also contains addition station information, making this design, overall effective in its instructional purposes.

• Link - http://www.cityrail.info/networkmaps/network_map.pdf

What is Information and Instructional Design?

The term Information and Instructional Design is a discipline, as it refers to the skill and practice of creating information and instructional content to help the users learn easily, efficiently and effectively. This form of design is basically a presentation of data transformed into more understandable contexts, and providing valuable meaning through its design structure. Communicating clearly through information and instructional design is most important, as it provides an understanding chain to the consumers of information, stimulating an experience through the design and gaining a sense of knowledge and wisdom within the presentation of data.

Diagram -

“Instructional Design.” Wikipedia. 12 Mar 2009. 15 Mar 2009
<http://en.wikipedia.org/wiki/Instructional_design>

Shedroff, Nathan. “Information Interaction Design: A Unified Field Theory of Design.” Nathan Shedroff’s World. 1994. 15 Mar 2009
<http://www.nathan.com/thoughts/unified/3.html>

Great Web Design Examples

Move Design is about being innovative and interactive through their web navigations, creating movements that are reactive and seem fluid like, creating an immediate interaction. Move Design also showcase their works and provide great interactive web designs.

• Link - http://www.movedesign.com/

Adobe brilliant, is about showcasing the latest of designs from finest artists interactively, and also allowing the audience to discover the applications Adobe has to offer.

• Link - http://www.adobe.com/brilliant/

In2media is about a digital agency that specializes in creating experiences through digital communication and developing relations between clients and users, which is clearly shown through their website.

• Link - http://in2media.com/

What is Interactive Design?

The term Interactive Design focuses on design for people, which is an experience of interaction and interactivity towards that creation, whether it is real or simulated. The effect of it however, is what is most important as it creates experiences between the audiences, such as feedback, control, creativity, productivity, communicative and adaptive. Interactive Design also, evaluates the user-behaviour providing knowledge and reaction to that design developing an interaction.

Diagram -

Shedroff, Nathan “A Unified Field Theory of Design.” Nathan Shedroff’s World. 1994. 9 Mar 2009 <http://www.nathan.com/thoughts/unified/index.html>

What is the difference between Web 1.0 and 2.0?

Web 1.0 in comparison to Web 2.0, is about the website design style resulting in a one-way flow of information and containing contents of ‘read-only’ materials. However, with Web 2.0 it can decentralize the website content, allowing users to be more involved and interact, as well as being the contributors, producers of information and consumers.

“Web 1.0.” Wikipedia. 26 Feb 2009. 8 Mar 2009 <http://en.wikipedia.org/wiki/Web_1.0>

Image Link - http://www.sizlopedia.com/2007/08/18/web-10-vs-web-20-the-visual-difference/

Difference

• Web 1.0 | Web 2.0
• Reading → Writing
• Companies → Communities
• Client-Server → Peer-to-Peer
• HTML → XML
• Home Pages → Blogs
• Lectures → Conversation
• Owning → Sharing

“Web 1.0 vs Web 2.0”. BC Writer, Marketer, Professional Speaker and Raconteur DarrenBarefoot.com. 29 May 2006. 8 Mar 2009 <http://www.darrenbarefoot.com/archives/2006/05/web-10-vs-web-20.html>

Web 2.0 Examples

Blogs - Is basically an online journal that consists of opinions, information and personal entries, also allowing viewers to comment their thoughts.

• Example - http://radar.oreilly.com/

Wikis – Are set webpages that is designed to allow users to edit and contribute to the content of that page.

• Example - http://en.wikipedia.org/wiki/Main_Page

Tagging – Is like a digital bookmark that allows the users to tag a piece of information, file or image. As it is then ‘tagged’ it provides the user with multiple access to easily find that marked information.

• Example - http://del.icio.us/

Multimedia sharing – Is an online service that stores and shares videos, photos and podcasts.

• Examples - http://www.flickr.com/ and http://www.youtube.com/

Podcasting – Is another online service that allows users to download or listen to recorded pieces of information.

• Example - http://uk.mevio.com/ and http://odeo.com/

RSS - Is a subscribed or formatted link that allows the enabled user to visit and keep informed about their selected website.

• Example - http://www.netvibes.com/#General

Social networking – Is a networked site designed as an online community for users to easily interact with each other.

• Example - http://www.facebook.com/

Anderson, P “What is Web 2.0? Ideas, technologies and implications for education.” JISC. 2007. 7 Mar 2009 <http://www.jisc.ac.uk/media/documents/techwatch/tsw0701b.pdf>

What is Web 2.0?

The term Web 2.0 refers to understanding the web as a platform, and that is an information space that has been designed to give the users an experience to participate, publish, collaborate and share. It is a development that links people all around and creates connectivity and interactivity between the developers and users through the networks, services and applications. It is seen as user-centered, driven and produced and has created network effects through the contents delivered. Web 2.0 simplifies the way end-users make use of the web, even if it is through social networking, multimedia sharing, wikis, blogs and folksonomies, all of which have become the integral parts of Web 2.0.

Diagram -

“Web 2.0.” Wikipedia. 3 Mar 2009. 7 Mar 2009 <http://en.wikipedia.org/wiki/Web_2.0>

O’Reilly, Tim “What is Web 2.0.” O’Reilly Media. 30 Sep 2005. 7 Mar 2009
<http://www.oreillynet.com/pub/a/oreilly/tim/news/2005/09/30/what-is-web-20.html>

Introduction – The Interactive Generation

Living in a generation that is so interactively involved, in particular, with the World Wide Web, has somehow provided us with the experience of participation, a space or place were we can interact, create, share, express and communicate openly to almost everyone. It is an interactive development that has lead to today’s generation form of involvement with each other.