Topic: Web & New Media
*Resources and notes used in the lesson will be posted on the teacher’s homepage / module website so that students who are absent from the lesson can complete the lesson at home.


Objective
Topic
Resources
Remarks

Students will learn about Internet & World Wide Web, creation of various web applications and design techniques of building a website.
Topics will cover:
• Internet & world wide web, web 2.0 generation, design & aesthetics, usability, and user-experience
• Knowledge / creation of various web applications: facebook, twitter, youtube, google docs, google map, blogger / wordpress, flickr, wiki, addthis etc.
• Design techniques of building a website; Web publishing.
• Human-computer interaction, socialisation, basic web design & HTML / CSS, typography, colour, choice of media, interactivity and responsible use of new media: netiquettes and intellectual property.

Fast track learners will be adopting an independent learning approach with minimum guidance. Peer-tutoring and self initiated projects will be considered for their differentiated assessment.

Computer lab

Software:
Adobe Dreamweaver CS4, Notepad, Internet Explorer

SMB account

Website:
http://webnewmedia.ning.com
Assessment:
• Forum
• Reflection Blog
• HTML & CSS Challenges (Pair)
• Class Test (Quiz and Theory Test)
• Final Project : ePortfolio





Wk1
Students will be able to:
1. Discuss the history of the Internet
2. Explain how to access and connect to the Internet
3. Analyze an IP address
4. Identify the components of a Web address
5. Explain the purpose of a Web browser
6. Search for information on the Web
7. Describe the types of Web sites
8. Recognize how Web pages use graphics, animation, audio, video, virtual reality, and plug-ins
9. Identify the steps required for Web publishing
10. Describe the types of e-commerce
11. Explain how e-mail, FTP, newsgroups and message boards, mailing lists, chat rooms, instant messaging, and Internet telephony work
12. Identify the rules of netiquette 13. Familiarise with Web 2.0 term and tools 14. Create a blog

Internet & WWW; Web 123; Tools Familiarizing: Facebook, Twitter, Youtube, Google docs, Google map, Blogger / Wordpress, Wiki, Flickr, Addthis etc.
Computer lab

*Reading:
The Internet and WWW.pdf

*Websites:
1. www.facebook.com
2. www.twitter.com
3. www.youtube.com
4. www.flickr.com
5. www.blogger.com
6. www.wordpress.com
7. www.docs.google.com
8. maps.google.com.sg
9. www.wikispaces.com
10. www.addthis.com
11. webnewmedia.ning.com

* Videos:
1. The Internet (VCD)
2. Web 1 and 2 (Youtube) http://www.youtube.com/watch?v=YXFYkbQRgY4&feature=related
3. Web 2 (Youtube) http://www.youtube.com/watch?v=nsa5ZTRJQ5w&feature=related
* Intro WNM Learning website * Intro WNM unit requirements * Intro today lesson
* Show Video Introduction of "The Intenet"
* Show Youtube Videos of "Web 123" * Familiarise with Web 2.0 tools * Create a Blog at blogger / wordpress (Homework)

Assessment (15 marks) - Ability to create a blog successfully with the inclusion of prior IT knowledge information (for lesson 1), reflection journals (for at least 4 lessons) with appropriate images. Blog URL to be submitted by L2.
Wk2
Students will be able to:
1. Be introduced what is HCI
2. Explain social networking websites, its uses and social impacts
3. Identify rules of netiquette and importance of IP
Human-Computer Interaction (HCI); Socialization; Usability & User-Experience; Netiquettes; Intellectual Property (IP).

Computer lab

*Website:
1. webnewmedia.ning.com

*Videos:
1. http://www.youtube.com/watch?v=ukYBAa89kT0
2. http://www.youtube.com/watch?v=6a_KF7TYKVc
3. http://www.youtube.com/watch?v=muk_Z4jlfKk

4. Video on IP (VCD)
* Revise last lesson and check blogs * Intro today lesson * Watch various videos * Advise participation in Discussion Forum 1: Social impacts of New Media
* Advise knowledgeable group to moderate the forum (differentiated)
* Advise Blog URL to be submitted

Assessment (5 marks) - Ability to post & reply meaningful discussions. Assessment is based on shallow/in-depth contributions.
Wk3
Students will be able to:
1. Identify HTML structure
2. Create simple web page using basic HTML codes
3. Self-study CSS (differentiated)
Design techniques of building a website – HTML.
• HTML Structure
• Common tags: <h1> etc, <em>, <a>, <dl> etc, <div>, <hr>, etc.
• Common attributes: align, width, height etc.
Computer lab

*Websites:
1. www.w3.org/standards/webdesign/
2. www.w3schools.com
3. www.w3.org/Style/Examples/011/firstcss (differentiated)

*Software: Notepad / Dreamweaver

* Revise last lesson and check forum * Intro today lesson * Intro HTML * Demo to create HTML web page * Intro CSS (differentiated)
* Advise participation in Discussion Forum 2: Blog or website? Which is best?
* Advise knowledgeable group to moderate the forum (differentiated)


Assessment (5 marks) – Pair with a peer to attempt a HTML Challenge Worksheet.
Wk4
Students will be able to:
1. Understand CSS and external stylesheet
2. Create simple web page using basic HTML codes with CSS
3. Self-reading Scripting & AJAX (differentiated)

Design techniques of building a website – CSS.
• Inline, on-page, external stylesheet
• <link>
• change of font / header color / size, body background color / image, hyperlink color, list style etc.
Computer lab

*Websites:
1. www.w3schools.com
2. www.w3.org/Style/Examples/011/firstcss
3. www.w3.org/standards/webdesign/script

*Software: Notepad / Dreamweaver

* Revise last lesson and check HTML files * Intro today lesson * Intro CSS * Demo to create HTML & CSS web page * Intro Javascript (differentiated) * Advise Blog to be updated and URL to be submitted

Assessment (5 marks) – Pair with a peer to attempt a CSS Challenge Worksheet.



Wk5
Students will be able to:
1. Establish an eye for design
2. Identify the steps required for web publishing and FTP
Design & Aesthetics - Typography, Colour, Choice of Media, Interactivity; Web Publishing & FTP.
Computer lab

* Websites
1. http://www.colormatters.com/colortheory.html
2. http://www.youtube.com/watch?v=Ki6rcXvUWP0

* Reading
1. How_to_FTP.pdf

* Revise last lesson and check files * Intro Color theory
* Intro Typography
* Intro Web Publishing * Intro FTP procedures
* Revise all previous lessons
* Give Quiz (gradable)

Assessment - Submission of Blog with at least 4 reflection journals till date.


Wk6
To test the understanding of the following:
  1. Internet & WWW basics
  2. Web 2.0 technologies
  3. Web Design HTML + CSS


Class Test (Theory only)
Classroom

Test question papers

SMB Account
Assessment (30 marks) - Ability to understand all issues, topics and skills taught and discussed in the previous lessons and pass the test.

Wk7
Students will be able to:
1. Create a personal digital portfolio with HTML / CSS based on a given sample template
2. Customise from the template and be creative in their design 3. Apply design principles to their website 4. Integrate useful web 2.0 tools such as google form, flickr, youtube etc. into their website
Final Project – My ePortfolio.

Computer lab

* Reading 1. WNM Final Project.pdf
* Brief WNM Final Project requirements * Show project samples
* Revise few skills to create website
* Revise commonly used web 2.0 tools and explain embedding function

Assessment (70 marks) - Ability to customise design from a given website template, apply design principles to enhance the look and feel of website and integrate some good functionalities of web 2.0 applications into student's portfolio website.


Wk8
Project Consultation

Project Consultation

* Full time facilitation in lab
Computer lab



Wk9-10
Consultation / Project Submission / Feedback / Sabbatical
* Project Submission via SMB (IS)
Computer lab












Assessment of InfoComm Studies – Web & New Media

1. There will be no End Of Year examination, assessment will be based on the following:

Assessment Methods
Weighting
Remarks

Term Test


30%

Written test

Assignments + Projects
(To replace end of year examination)

Examples:
• Forum
• Reflection Blog
• HTML & CSS Challenges (Pair)
• Class Test (Quiz and Theory Test)
• Final Project : ePortfolio


70%
Marks (base 100) will be awarded for each of Term 1 to Term 3. The project for each term must be completed at the end of the term. Marks should be ready by the 2nd week of the next following term and will be posted to the students for viewing.


2. No ace points.

3. Mark allocation for the project work (40 – to be converted to 100 marks).


Creativity / Aesthetics
10
Functionality / Technicality
10
Media Integration
10
Content / Reflection
10
Total
40