Debbie Designs

"Making the simple complicated is commonplace; making the complicated simple, awesomely simple, that's creativity" — Charles Mingus

Information/Instructional Design

Information or instructional design is the process of gathering, filtering and presenting information in a graphical, design appropriate way. It allows the user to see information such as stats and numbers in a more design friendly situation. This form of design helps communicate and understand the meaning and essence of the information.

“Information designers are very special people who must muster all the skills and talents of a designer, combine it with the rigor and problem solving ability of a scientist or mathematician and bring the curiosity, research skills and doggedness of a scholar to their work. I think they’re the unsung and often unnoticed heroes of our profession.” Terry Irwin, ‘Information design: what is it and who does it’

Example One:

A very clever clock that uses a polar plot to show the passing of time. Below is a screen grab and link to the creator’s blog.

Polar Clock

http://blog.pixelbreaker.com/

Example Two:

Design Destiny created an Environmental Report for Federlegno in 2008 using information design to portray the information in an interesting way.  The diagram describe the input-output flows in the production of wood-based products. From raw materials/energy/chemicals/water to waste/emissions/water. In between them are the products themselves.

http://www.densitydesign.org/

Example Three:

The last informational design example is by Maximus Chatsky, it was created for SYNC Magazine in 2008.


http://www.behance.net/Gallery/Illustration-for-SYNC-magazine/119242

References:

http://tech-head.com/info.htm

http://www.stcsig.org/id/id_articles.htm

(References for all blogs can be found in the Links section)

Interactive Design

Interactive Design is the method used to allow users to have interaction with the design and be involved in what it does, how it works and what it looks like. It focuses on human behaviour and heavily relies on the material and information gathered during the conceptual phase. It asks the important questions of how do you do something with what your creating?, how do users feel? and how do you know?

Example One:

http://www.mauriciostudio.com/

Mauricio’s studio site is an interactive design as the user must interact, click and move on the homepage to get to his other pages such as contact and about.

Mauricio's Homepage - About section mouse hover

 

Example Two:

http://wechoosethemoon.org/

We choose the moon is an interactive site that recreates the Apollo 11 launch for its user. You can click on what you want to do from launching to viewing photo galleries. Theres also a mission tracker at the bottom of the page and a voiceover describing whats happening.

We Choose The Moon

Launch and Mission Tracker closeup

Example Three:

http://www.buildyourwildself.com/

A promotion for New York’s Zoos, this website allows you to build yourself wild! It starts off with you building a normal person, then you can add head gear, ears, arms and tails from various animals found in the zoo.

Build your wild self!

Story Board and Moodboard

Storyboard one and two

Storyboard three and four

Making Toast

Making Toast

Step-by-Step Instructions:

  1. Plug in toaster to power outlet
  2. Turn on switch
  3. Check that bread is not mouldy, stale or unsuitable to eat
  4. Place bread in toaster
  5. Adjust dials to preferred heating setting
  6. Pull leaver down to start toasting process
  7. Get out butter, knife and cutting board
  8. Wait for toast to be ready ensuring it does not burn
  9. When toast pops up, take it out when it is cool enough to touch
  10. Place toast on cutting board
  11. Butter toast with knife or spread alternative spreads on if desired

Web 2.0

Web 2.0

 Web 2.0 is associated with web applications that give the user interaction with other people, as well as having the ability to change setting s and layouts of the website.  The term Wb 2.0 was brought up in 1999 by Darcy DiNucci, in her article, “Fragmented Future,” but the term soon rose to popularity in 2004 when sites used only to gain information lost their intrigue and users started to experience sites that offered more interaction and more services.

Popular examples of Web 2.0 include Flicker, Skype, Facebook, Blogger, WordPress, Myspace and Youtube. In using and visiting these web applications users can adjust their settings, create their layouts, upload photos and videos and interact with other people using the site.

Facebook

Facebook is an interactive user site that allows people to connect with friends and family from all over the world. As well as creating your own profile you can upload photos, connect with friends, tag friends in photos, join fan groups of things you love and play some of the thousands of games Facebook provides its users with.

www.facebook.com

Youtube

Youtube is another example of Web 2.0. It is a site for users to upload videos to share with others. Users can then comment on other videos, write a profile about themselves, edit a page where all their videos with be shown and interact with other users of the site. It is a great way to share funny moments with friends, memorable family moments or even showcase acting talent.

www.youtube.com

Blogger

 

Blogger is a web 2.0 example that allows users to create their own web logs or “blogs” for other users to read. It is a create sharing site where users can create their own profile, customise the look and layout of their blog, insert new posts, follow other bloggers, share pictures and videos and interacte with others using the site.

www.blogger.com

 

Follow

Get every new post delivered to your Inbox.