Lets Review Demo:
Scanning art- High res and low res versions
resolution of images for web
color theory
------------------------------------------------
Breakout Session: Research
Find good examples of Blogs, Flicker, Facebook or MySpace
Discussion of online identities and communities.
--------------------------------------------------
Projects:
Blog: Make a Blog for one on the following people:
1. Dion Warwick
2. Paul Reubens
3. A famous animal- example-"Lassie"
Flicker: Make an online gallery of images
Facebook or MySpace:
Tuesday, September 30, 2008
Monday, September 29, 2008
Timeline
TimeLine
M September 29
Introductions to Course and Instructor
Project 1
W October 1
Presentation and discussion about Web ready tools- Blogs, Online Communities, Photo/Video archiving and sharing
Demos- Image scanning, image size, resolution, color theory
In-class working
M October 6
In Class working
Demos-
In class working
W October 8
Send Blog Info to Instructor to post for everyone to review before crit.
Demos-
In class working
M October 13
Critique and sharing of online projects
Projects 2
W October 15
Dreamweaver demo- Software Environment, HTML, File Organization Tips and Requirements
Poem line handout
Make first HTML page and FTP it to your ODIN server
M October 20
Demos-
W October 22
Demos-
In class working
M October 27
Demos-
In class working
W October 29
Critique and discussion
Project 3
M November 3
W November 5
M November 10
W November 12
M November 17
W November 19
M November 24
W November 26
M December 1
W December 3 Final Critique and Hand-In
M September 29
Introductions to Course and Instructor
Project 1
W October 1
Presentation and discussion about Web ready tools- Blogs, Online Communities, Photo/Video archiving and sharing
Demos- Image scanning, image size, resolution, color theory
In-class working
M October 6
In Class working
Demos-
In class working
W October 8
Send Blog Info to Instructor to post for everyone to review before crit.
Demos-
In class working
M October 13
Critique and sharing of online projects
Projects 2
W October 15
Dreamweaver demo- Software Environment, HTML, File Organization Tips and Requirements
Poem line handout
Make first HTML page and FTP it to your ODIN server
M October 20
Demos-
W October 22
Demos-
In class working
M October 27
Demos-
In class working
W October 29
Critique and discussion
Project 3
M November 3
W November 5
M November 10
W November 12
M November 17
W November 19
M November 24
W November 26
M December 1
W December 3 Final Critique and Hand-In
Grading + Attendence
GRADING
Grades are derived from results for each of the following weighted elements against the scale below.
Web Environments; Facebook, Blog, Flicker 20%
Poetry Website 20%
Final Project 40%
Presentations 10%
Participation, Motivation, Attitude 10%
Grading Scale:
A 94% and above
A- 91-93%
B+ 87-90%
B 84-86%
B- 81-83%
C+ 77-80%
C 74-76%
C- 71-73%
D+ 67-70%
D 64-66%
D- 60-63%
F 59% and below
Attendance:
Attendance in class (as in life) is essential if you wish to do well. As a result, attendance is mandatory. Arriving late,
leaving early or failing to attend class will directly (and adversely) affect your grade as described below. Students are
allowed one excused absence per term to allow for illness or personal circumstances.
EACH UNEXCUSED ABSENCE WILL RESULT IN YOUR FINAL GRADE BEING REDUCED BY 5%.
Late Arrival = ½ Absence Early Departure = ½ Absence Each Full (1) Absence = 5% reduction in final grade
Grades are derived from results for each of the following weighted elements against the scale below.
Web Environments; Facebook, Blog, Flicker 20%
Poetry Website 20%
Final Project 40%
Presentations 10%
Participation, Motivation, Attitude 10%
Grading Scale:
A 94% and above
A- 91-93%
B+ 87-90%
B 84-86%
B- 81-83%
C+ 77-80%
C 74-76%
C- 71-73%
D+ 67-70%
D 64-66%
D- 60-63%
F 59% and below
Attendance:
Attendance in class (as in life) is essential if you wish to do well. As a result, attendance is mandatory. Arriving late,
leaving early or failing to attend class will directly (and adversely) affect your grade as described below. Students are
allowed one excused absence per term to allow for illness or personal circumstances.
EACH UNEXCUSED ABSENCE WILL RESULT IN YOUR FINAL GRADE BEING REDUCED BY 5%.
Late Arrival = ½ Absence Early Departure = ½ Absence Each Full (1) Absence = 5% reduction in final grade
Syllubus
Art 341 Interactive Media l Fall 2008 MW 12-2.50 pm
COURSE OVERVIEW
This is a Studio Course in Digital Media that requires you to integrate practical and theoretical knowledge in the research and development of web pages. It is the first part of a two-term studio sequence in design for interactive media.
Description:
Interactive design for the web focuses on information architecture, navigation systems, and visual interfaces. HTML protyping and mockup and the use of visual design tools are integral to this course as are the creation and optimization of graphics in compressed formats. Experience with web production workflow will be gained through development of site projects. Topics include usability and the aesthetics of web media.
Prerequisites: Art 120, 210, successful completion of the Sophomore Review.
Objectives:
By the end of this course, students will have been exposed to practical and conceptual approaches to:
• Web page construction through coding in HTML.
• Preparation and optimization of web graphics using appropriate compressed formats.
• Color theory for web design.
• Web page and web site construction using visual page and site editors.
• Assembly of templates from prototype layouts and designs.
• Creation of web animations in optimized formats.
• Information design and the organization of content.
• Interaction design and organization of navigation systems. Site maps and flow charts.
• Screen design, including the use of type, layout, and color to support functionality and user experience.
• Web site file and directory management.
• Web-based portfolio project, including preparation of a design document.
References:
Textbooks are required but having a third party reference book can be helpful. There are many to chose from and sometime dependant on personal preference.
Hardware:
External memory devices are required. Either an USB Flash drive or an external removable hard drive.
Projects
1. Using the Web Environment
A. Flicker site- A photo archive
Required Elements:
Two pages of “Favorites” archive that relate to art and design.
Upload set of your own photos, drawings, or design related images that you made.
B. Facebook or MySpace
C. Create a Blog – Create an identity [Fictional]
Required Elements:
Post an YouTube video, a sound file, photos, drawing, links to articles, archive of daily journal entrees, post news article, links to other sites you like that are related to design.
Link all three sites together.
Projects objective and skills:
- Getting comfortable with the web and using tools that are already available to the public.
- Scanning and Import analog and digital elements.
- Learning how to communicate and dialog on the web.
2. Making a first site
Poetry webpage
Description
Design one line of a poem in Photoshop. Create each of the word elements of the one line poem so that each word is a link. Every word will be a link to another poem site made by a classmate. Using Photoshop, cut-up the page so that each word is a graphic element. Compress the graphic elements. Make one of your links an animated GIF in Photoshop. Import elements into Dreamweaver.
Skill sets covered for project:
- Designing in Photoshop- thinking about how to design and produce the design with the grid in mind.
- Production skills include cutting up graphics, compressing graphics and file formats, color theory.
- Making an animated GIF
- Learning Dreamweaver’s environments and making a one-page HTML page using tables.
3. Final Project
Portfolio website/ Gallery/ Self Promotional Environment
This site is your first personal portfolio site with a small navigation system with a minimum of four navigational sections. For example: Homepage, Design samples [organized in some fashion], Resume, Links
Required elements:
- Web site map
- Two web site homepage design proposals which explores site navigation system and an design aesthedic
- Site Template page
- Site protype/mockup in HTML using Dreamweaver
- Make links to your Facebook, Blog, and Flicker site
- FTP site to a server to have a live site- ODIN account.
Skill sets covered for project: Process
- Making a site map in Illustrator
- Researching different navigation systems
- Researching and exploring site designs for inspiration
- How to organize a project and documents
- Formatting text and using CSS
COURSE OVERVIEW
This is a Studio Course in Digital Media that requires you to integrate practical and theoretical knowledge in the research and development of web pages. It is the first part of a two-term studio sequence in design for interactive media.
Description:
Interactive design for the web focuses on information architecture, navigation systems, and visual interfaces. HTML protyping and mockup and the use of visual design tools are integral to this course as are the creation and optimization of graphics in compressed formats. Experience with web production workflow will be gained through development of site projects. Topics include usability and the aesthetics of web media.
Prerequisites: Art 120, 210, successful completion of the Sophomore Review.
Objectives:
By the end of this course, students will have been exposed to practical and conceptual approaches to:
• Web page construction through coding in HTML.
• Preparation and optimization of web graphics using appropriate compressed formats.
• Color theory for web design.
• Web page and web site construction using visual page and site editors.
• Assembly of templates from prototype layouts and designs.
• Creation of web animations in optimized formats.
• Information design and the organization of content.
• Interaction design and organization of navigation systems. Site maps and flow charts.
• Screen design, including the use of type, layout, and color to support functionality and user experience.
• Web site file and directory management.
• Web-based portfolio project, including preparation of a design document.
References:
Textbooks are required but having a third party reference book can be helpful. There are many to chose from and sometime dependant on personal preference.
Hardware:
External memory devices are required. Either an USB Flash drive or an external removable hard drive.
Projects
1. Using the Web Environment
A. Flicker site- A photo archive
Required Elements:
Two pages of “Favorites” archive that relate to art and design.
Upload set of your own photos, drawings, or design related images that you made.
B. Facebook or MySpace
C. Create a Blog – Create an identity [Fictional]
Required Elements:
Post an YouTube video, a sound file, photos, drawing, links to articles, archive of daily journal entrees, post news article, links to other sites you like that are related to design.
Link all three sites together.
Projects objective and skills:
- Getting comfortable with the web and using tools that are already available to the public.
- Scanning and Import analog and digital elements.
- Learning how to communicate and dialog on the web.
2. Making a first site
Poetry webpage
Description
Design one line of a poem in Photoshop. Create each of the word elements of the one line poem so that each word is a link. Every word will be a link to another poem site made by a classmate. Using Photoshop, cut-up the page so that each word is a graphic element. Compress the graphic elements. Make one of your links an animated GIF in Photoshop. Import elements into Dreamweaver.
Skill sets covered for project:
- Designing in Photoshop- thinking about how to design and produce the design with the grid in mind.
- Production skills include cutting up graphics, compressing graphics and file formats, color theory.
- Making an animated GIF
- Learning Dreamweaver’s environments and making a one-page HTML page using tables.
3. Final Project
Portfolio website/ Gallery/ Self Promotional Environment
This site is your first personal portfolio site with a small navigation system with a minimum of four navigational sections. For example: Homepage, Design samples [organized in some fashion], Resume, Links
Required elements:
- Web site map
- Two web site homepage design proposals which explores site navigation system and an design aesthedic
- Site Template page
- Site protype/mockup in HTML using Dreamweaver
- Make links to your Facebook, Blog, and Flicker site
- FTP site to a server to have a live site- ODIN account.
Skill sets covered for project: Process
- Making a site map in Illustrator
- Researching different navigation systems
- Researching and exploring site designs for inspiration
- How to organize a project and documents
- Formatting text and using CSS
Subscribe to:
Posts (Atom)