The web as we know it has changed. Gone are the days of static websites and little to no interactivity, but instead an online world where the user is as important as the website itself. Most commonly seen through social networking, communication and advanced web applications, web 2.0 brings the internet into a new era. Web 2.0 promotes the sharing of information, creativity and collaboration amongst its users, and opens up the internet to user created content and information. Users can now comment, edit and redefine websites by their input, releasing the control of the website from the creator and taking control themselves.
To gain a better understanding of Web 2.0, and how it has redefined the web, please view the clip below:
Web 1.0 vs Web 2.0
Another great representation of how the internet has changed is a video shown to us in the first lecture of Interactive Design. Entitled 'The Machine is Us/ing Us', this short clip embodies Web 2.0 and its principles.
The Machine is Us/ing Us
Web 2.0 brings us a new era for the internet, and its something we should all be excited about.
Wednesday, March 4, 2009
Web 2.0 Examples
When focusing on the web today there are any number of Web 2.0 examples, from social networking, to blogs, photo and video sharing, community forums, file sharing, and encyclopedia sources. Below i have selected a few of the important Web 2.0 examples and the role they play on the internet. Feel free to click on the examples to check them out yourself!
Youtube
YouTube is yet another example of Web 2.0. Youtube allows the user to upload and download any kind of video, including News, TV Shows, Movies and Personal Blogs. The user has complete control over the content watched and delivered. Once again the website creator has created a basis for the user to build upon.
Facebook
Facebook is a social networking site that enables people to keep i contact no matter the location, as long as a mobile phone or computer is in arms reach. Users can update their current status (What they are doing at the exact time), blog about their day, send each other messages and upload photos. It seems almost as if there are limitless possibilities for a facebook user, and it is a great example of Web 2.0. The site creator has created a platform for users to interact, redefining the website in a way that is compleltely up to them.
Flickr
Flickr is another great example of Web 2.0 in action. Users create accounts that enable them to create albums and upload pictures and videos and enable them to be open for comment and critique. This has created a community in itself, where any interent user can get involved and become part of this Web 2.0 photo sharing greatness!
Myspace
Myspace was one of the pioneers of social interaction and social networking. Myspace offers a residence for music artists and the like, as well as offering its users interactivity amongst each other with private messaging, blogging, status reporting and video and picture hosting.
Wikipedia
Wikipedia is an encyclopedia that is updated, maintained and monitored by the internet population. Anyone can edit any article, and it will be published as long as the majority agree with what you are saying. It is revolutionary as new topics are added daily, and existing topics are reassessed and edited on a consistent basis. A perfect example of Web 2.0.
Youtube
YouTube is yet another example of Web 2.0. Youtube allows the user to upload and download any kind of video, including News, TV Shows, Movies and Personal Blogs. The user has complete control over the content watched and delivered. Once again the website creator has created a basis for the user to build upon.
Facebook is a social networking site that enables people to keep i contact no matter the location, as long as a mobile phone or computer is in arms reach. Users can update their current status (What they are doing at the exact time), blog about their day, send each other messages and upload photos. It seems almost as if there are limitless possibilities for a facebook user, and it is a great example of Web 2.0. The site creator has created a platform for users to interact, redefining the website in a way that is compleltely up to them.
Flickr
Flickr is another great example of Web 2.0 in action. Users create accounts that enable them to create albums and upload pictures and videos and enable them to be open for comment and critique. This has created a community in itself, where any interent user can get involved and become part of this Web 2.0 photo sharing greatness!
Myspace
Myspace was one of the pioneers of social interaction and social networking. Myspace offers a residence for music artists and the like, as well as offering its users interactivity amongst each other with private messaging, blogging, status reporting and video and picture hosting.
Wikipedia
Wikipedia is an encyclopedia that is updated, maintained and monitored by the internet population. Anyone can edit any article, and it will be published as long as the majority agree with what you are saying. It is revolutionary as new topics are added daily, and existing topics are reassessed and edited on a consistent basis. A perfect example of Web 2.0.
Interactive Design - A Definition
Interaction Design is the means of allowing humans to interact and relate to a program. Focusing on the users experience and usability, interactive design aims to develop, implement, evaluate and maintain situations that facilitate the users experience. The discipline of designing interactivity is largely aimed at the design of technological systems such as software, mobile devices and electronic devices. However, it has also extended in the fields of web design, architecture and industrial design. Using a range of sound, motion and images, interactive design shapes our every day life with the use of digital artifacts to meet the needs of the user.
As Nathan Shedroff states:
"Experience is the place in which knowledge can grow and interaction is the means by which valuable experiences can be created."
As Nathan Shedroff states:
"Experience is the place in which knowledge can grow and interaction is the means by which valuable experiences can be created."
Interactive Design - Great Web Design Examples
Here are a few examples of Great Web Designs. Feel free to click the preview images to visit the site.
Wake up Your Feelings
A great example of flash being used to enhance the interactivity and general design.
Kontain
Another great example of flash being used in a webpage to create a not just beautiful webpage, but an easily navigated and usable site too.
Superbtees
Unlike the previous examples, Superbtees uses CSS and XHTML to create a beautiful layout that promotes easy interaction.
Wake up Your Feelings
A great example of flash being used to enhance the interactivity and general design.
Kontain
Another great example of flash being used in a webpage to create a not just beautiful webpage, but an easily navigated and usable site too.
Superbtees
Unlike the previous examples, Superbtees uses CSS and XHTML to create a beautiful layout that promotes easy interaction.
Information/Instructional Design - A Definition
Information and Instructional Design applies both traditional and evolving design principles to the process of translating unstructered, confusing, misleading, complex and unorganized data into understandable, valuable and meaningful information. The practice of information design requires an interdisciplinary approach which combines skills in graphic design, writing and editing, instructional design, human performance technology, and human factors.
Seen below is a diagram representing the different levels and elements of the user experience, a visual make of how Information design operates.
Information design itself can also be instructional design since instructional design is the systematic process of translating general principles of learning and instruction into plans for instructional materials and learning, which is also one of the functions of information design. Information design is the key element in presenting data in a way that the user can navigate and create understanding.
Seen below is a diagram representing the different levels and elements of the user experience, a visual make of how Information design operates.
Information design itself can also be instructional design since instructional design is the systematic process of translating general principles of learning and instruction into plans for instructional materials and learning, which is also one of the functions of information design. Information design is the key element in presenting data in a way that the user can navigate and create understanding.
Information/Instructional Design - Examples
Examples of Information/Instructional Design can be seen in Maps, Graphs, Signage, Diagrams and illustrative graphics.
A tram map for the city of Amsterdam.
Information graphics used to show the amount of daily gun deaths in the USA.
A weather map of the USA.
A tram map for the city of Amsterdam.
Information graphics used to show the amount of daily gun deaths in the USA.
A weather map of the USA.
Planning Tools for Interaction - 1
A flow chart is a good way to lay out steps in a graphical manner, which make completing a task or solving a problem easier. A well designed flow chart is easily read and understood. Made up of a series of shapes and appropriate symbols, flow charts are a common way of planning interaction design. Below is a step by step set of instructions on how to use a toaster to cook toast, and a flowchart that represents these steps.
Step by Step instructions on how to cook toast.
1. Plug Toaster into wall socket
2. Turn wall socket power on
3. Put bread in toaster
4. Adjust dial to desired level of cooking
5. Depress level till it clicks at the bottom
6. Once popped, is toast cooked?
7. Wait for toast to cool down
8. Remove toast from toaster
9. Prepare toast to your liking
10. Enjoy!
Flowchart
Step by Step instructions on how to cook toast.
1. Plug Toaster into wall socket
2. Turn wall socket power on
3. Put bread in toaster
4. Adjust dial to desired level of cooking
5. Depress level till it clicks at the bottom
6. Once popped, is toast cooked?
7. Wait for toast to cool down
8. Remove toast from toaster
9. Prepare toast to your liking
10. Enjoy!
Flowchart
Subscribe to:
Posts (Atom)
