Web Design and Computer Principles

CSCI UA 0004-004
Tues and Thurs 3:30 – 4:45pm

Instructor: Heather Dewey-Hagborg
hdh216@nyu.edu
www.deweyhagborg.com
Office hours: I will be on campus between Courant and Tisch Tuesdays and Thursdays most of the day.
Email me to schedule an appointment.

Tutoring is available in the 4th St. ITS multimedia lab :
Mondays:
Josh 5:30-8:30 PM

Tuesdays
Terrence 3:30-6:30PM

Wednesdays
Josh: 11-3pm
Terrence: 2-5pm

Thursdays
Terrence 1:00-5:00 PM

Fridays
Josh 1:00-4:00 PM

All assignments must be submitted using NYU's Blackboard system.
Late assignments are penalized as follows:

Grading:


Resources:

Extra Credit:
You may come on an "Art-Out" event and write a blog post (200 words+) describing your experience and how it relates to this class.

Please feel free to email me with questions or to make an appointment to meet up and discuss any difficulties you may be having. Please also take advantage of the tutors in the ITS labs.

Syllabus

All readings are available on reserve at Bobst. Readings correspond to each class and should be read beforehand so that you can come to class prepared with questions.
Assignments are due 1 week after the end of each unit but you may work on them throughout the unit.

9/6 - Introduction

Introduce ourselves.
Discuss syllabus, topics and coverage of this class.
Install photoshop free trial.

Photoshop

Read the Project Assignment (due 9/27)

9/8 - Photoshop: Pixels

Readings:
Visual Quickstart Guide: Photoshop CS5
Chapter 1, pages 1-4 (Color modes)
Chapter 2, pages 20-22 (New Document, Resolution)
Chapter 2, pages 24-26 (Saving)
Chapter 5, pages 91-93 (Zooming)
Chapter 6 (Panels)
Chapter 7 (Pixel Basics)

Cropping, rotating, resolution, color.

Artists working with resolution:
Chuck Close
Danny Rozin
Jim Campbell

9/13 - Photoshop: Collage

Readings:
Visual Quickstart Guide: Photoshop CS5
Chapter 8 (Layer Basics)
Chapter 14, 233-238 (Combining Images)
Chapter 18, 312-313 (Transformations)
Chapter 19, 317-319, 325-332 (Filters)

Layering, transforming layers, layer effects.

9/15 - Photoshop: Advanced Compositing

Readings:
Visual Quickstart Guide: Photoshop CS5
Chapter 9, 147-166, 174 (Selections and Masks)

Selections and refining selections, masks.

9/20 - Photoshop: Blending

Readings:
Visual Quickstart Guide: Photoshop CS5
Chapter 11, (Colors and Blending Modes)
Chapter 20, 335-348 (Type)
Chapter 26, 421-426 (Save For Web)

Composite modes and opacity levels, text, exporting.

Homework: For next class bring in an example of something you think is "well-designed" and be prepared to discuss why it is so with the class.

Indesign

Read the Project Assignment (due 10/4)

9/22 - Indesign: Design basics

Readings:
Visual Quickstart Guide: Indesign CS5
Chapter 1 - Page 18 (Tools Panel)
Chapter 2 - Pages 21-28, 41-42, 45-46; 50-52 (Document Setup)
Chapter 5 Pages 123-127, 129-137, 144, 148 (Color)
Chapter 4 Pages 87-111, 117, 122 (objects)
Chapter 8 Pages 203-205, 228 (Graphics)

Color theory, page layout, graphics.

9/27 - Indesign: Type

Photoshop assignment due.

Reading:
Visual Quickstart Guide: Indesign CS5
Chapter 3 Pages 54-75; 80; 85 (Basic Text)
Chapter 9 Pages 237-246 (Text Effects)
Chapter 20 Pages 488-490 (Exporting to PDF)
Chapter 15 Pages 391-398, 404 (Styles)

Text and typography.
The Digital Library of Illuminated Manuscripts

Unix

Read the Project Assignment (due 10/6)

9/29 - 8. Unix

Download Jedit here

Readings available online: Unix/Linux Tutorial
How Stuff Works: Operating Systems
How to List and Read UNIX Directories

Servers and operating systems. Basic Unix commands. FTP.

HTML and CSS

Read the Project Assignment Description (due 11/3)

10/4 - HTML: Structures and Connections

Indesign assignment due.

Reading:
Visual Quickstart Guide to HTML, XHTML and CSS
Chapter 1: (building blocks) Pages 27-37
Chapter 2 (working with files) - all but pg 48 (MS Word)
Chapter 3 - (html structure) - Pages 58, 60-68
Chapter 4 - (formatting with tags) - Pages 69-71, 74 - 76, 79
Chapter 6 (links) - Pages 103-108
Chapter 15 (lists) - Pages 216-217
Chapter 22 (testing pages) – all

Hypertext, non-linear narrative, web page structure, text, lists.

Olia Lialina's My Boyfriend Came Back From the War
Heath Bunting's Read me
jodi.org

10/6 - HTML: Images, Video and Sound

Unix assignment due.

Reading:
Visual Quickstart Guide to HTML, XHTML and CSS
Chapter 5 (images) - Pages 81-85, 90-91, 100-101
Chapter 16 (tables) - Pages 227-234
Chapter 18 (multimedia) - Pages 281-285

10/13 - Midterm Review

10/18 - Midterm

10/20 - no class

10/25 - CSS: Basics

Reading:
Visual Quickstart Guide to HTML, XHTML and CSS
Chapter 7 (css)

Lots of info on CSS on w3schools
The cascade, color.

10/27 - CSS: Design and layout

Reading:
Visual Quickstart Guide to HTML, XHTML and CSS
Chapter 8 (stylesheet files) - 127-129, 131, 134
Chapter 10 (css formatting) - 151-157, 160, 165, 168

box model and divs, layout, menus, headers.

Animated GIFs

Read the project assignment due 11/10

11/1 - Animation basics

Animation, flipbooks, storyboards.

App: FPS app
Video: How Walt Disney Cartoons are made

Articles and examples:
The year of the Animated Gif
Graphics Interchange Format At Denison University’s Mulberry Gallery
iamnotanartist.org
seagull
3fram.es - make a 3 frame GIF from your webcam
Paul chan interview
More gifs

11/3 - Animated GIFs

HTML/CSS assignment due.

Simple Tutorial
Tweening

Basic animated gif technique.

Dreamweaver

Read the Project Assignment due 11/29.

11/8 - Web Design using Dreamweaver

Reading:
Visual Quickstart guide to Dreamweaver CS5
Chapter 1: Introducing Dreamweaver (pages 1-28)
Chapter 3: Building Your first Page (except p. 67, 80-82)
Chapter 4: Adding Text to Your pages
Chapter 5: Including Images & Media (139-150)
Chapter 6: Working with Links (except 185-187 and 189-190)
Chapter 7: Styling Page Content
Chapter 8: Using Styles for Layout

Interface basics. CSS design.

Adobe Kuler
Plugin for Kuler

Positioning in CSS

11/10 - Web Design using Dreamweaver

Animated GIFs assignment due.

Reading:
Visual Quickstart guide to Dreamweaver CS5
p. 165 Adding a favicon
pp. 185 – 187 Adding named anchors

Meta tags, named anchors, favicon, hit counter.


Favicons:
Explanation
Editors:
HTMLKit
Favicon

11/15 - Web Design using Dreamweaver

Reading:
Visual Quickstart guide to Dreamweaver CS5
pp. 189-190 Image maps
Chapter 13: Using Behaviors

Image maps and rollovers.

Homework:
Email me questions to answer in class next week! What are you struggling with?

11/17 - Web Design using Dreamweaver

Today we will focus on your issues, problems and difficulties with building your website.

Workshop: in groups of 4-5 build an online music store homepage.
Think about what would make a great design and what theme your store might have.
Post your page online and make sure to include everyone's names on the page.
Share your work with with the class!

11/22 - Audio


Read the Project Assignment due 12/6.

Download Audacity
How Digital and Analog Recording Work

Recording, editing, uploading, embedding.

Flash

Read the Project Assignment due 12/15.

11/29 - Flash: Drawing

Dreamweaver assignment due.

Reading:
Visual Quickstart Guide to Flash CS5
Ch 1 2-5 (Files); 10-20 (UI)
Ch 2 29-31 (Tools); 40-45 (Stroke/Fill); 46-52 (Drawing)
Ch 6 171-177 (Layers)
Ch 7 193-196 (Libraries)
Ch 8 (Timeline);
Ch 16 489-490 (Importing Bitmaps)
Ch 17 499-504 (Sound)

Simple frame based animations in flash.

Flash Examples:
Adobe Museum - Tony Oursler's Valley
Google Art Project
Dan Waber’s Strings
Brian Kim stefans Dream life of letters
Eric Natzke's generative flash paintings

12/1 - Flash: Tweening

Reading:
Visual Quickstart Guide to Flash CS5
Ch 9 Classic Tweening
Ch. 10 Shape Tweening
Ch. 11 Motion Tweening

Tweening.

12/6 - Flash: Interactivity

Audio assignment due.

Reading:
Visual Quickstart Guide to Flash CS5
Ch. 15 Basic Interactivity
Ch. 18 542-545, 558-559 (Publishing to SWF/HTML)

Scott Snibbe's "Make like a tree"

Buttons and interactivity. Export for web.

Generative code based painting example

12/8 - Flash

Odds and ends: text, publishing, sound, video...
Also - how to set up your own website: hosting, domain names, etc.

12/13 - Best of

Students will present and briefly discuss their work.
Choose the assignment you are most proud of, and make sure it is posted online.

12/15 - Final Exam Review

Final Exam

Dec. 22nd 4pm in room 102.

All assignments must be turned in before the final exam. No late assignments will be accepted after the exam.