COMM 225: Digital Media I

Morgan Schwartz

office: Nugent 560, Room A
tel: 1-212-774-4865
email: mschwartz AT mmm DOT edu
web: http://sodacity.net/courses/

FALL 2007

Section 03 Monday, 7:15 - 9:55 pm

Classroom: Nugent 556

Syllabus

Course Description

Digital and interactive media permeate virtually every aspect of our society from information delivery and product marketing to education and entertainment. In this course you will learn practical and critical skills necessary to become a technically proficient and thinking digital media maker. Literacy in any medium is the ability both to access (read) materials created by others and to generate (write) materials for others. In this course you will learn to "speak" the language of digital media and to become conversant with the computer as an expressive medium. Through hands-on training, you will be introduced to creative approaches to media production and to a range of software. The format of this class is designed to bridge practice and theory. Topics will include digital imaging, typography, animation, video, sound and web design. We will concern ourselves with "how" and "why" the digital world is constructed the way it is. Students will be challenged to deconstruct this world and to develop an ability to analyze and critique the cultural implications of digital media in our lives. Prior computer experience is not required, but students are expected to take the initiative to become comfortable operating a Macintosh computer.

Learning Goals

  • You will be able to understand the function and relationships of computer hardware and operating systems, input and output peripherals and the Internet.
  • You will be able to use Macintosh-platform digital media software including Adobe Photoshop (for image manipulation), and Macromedia Dreamweaver (for web design).
  • You will be able to present and articulate your creative ideas to others.
  • You will be able to give and receive constructive critical feedback in a group setting.
  • You will read, write, and think about the roles computers and media play in your life, in your creativity and in society in general.

Textbooks and Materials

materials:
USB Flash Drive (256MB or bigger) - OR - portable Hard Drive

required texts:
all required readings will be available online or handed out in class

optional technical texts:
Adobe Photoshop CS2 for the Web Hands-On Training by Tanya Staples
Photoshop CS2: Visual QuickStart Guide by Elaine Weinmann, Peter Lourekas
HTML, XHTML, and CSS: Visual QuickStart Guide (6th Ed) by Elizabeth Castro
Macromedia Dreamweaver 8 Hands-On Training by Daniel Short & Garo Green
Macromedia Dreamweaver 8: Visual QuickStart Guide by Tom Negrino & Dori Smith

optional history/theory texts:
The Reconfigured Eye by William J. Mitchell
Multimedia - From Wagner to Virtual Reality edited by Randall Packer & Ken Jordan
The New Media Reader edited by Noah Wardrip-Fruin & Nick Montfort

Grade Weights

Participation: 20%

A large amount of class time will be dedicated to group critiques, team projects and class discussion. I encourage you to take an active role in contributing to make our class a fun and dynamic place to be.

Weekly Assignments: 50%

This is where its at - you can't learn HTML by osmosis or wait until the end of the semester to cram for an exam. Multimedia production involves a complex spectrum of techniques and software. If you do the assignments each week you will do well. If not, you will fall behind rapidly. Weekly exercises are due at the beginning of class the week after they are assigned unless noted otherwise.

Rant or Rave: 5%

This 2-3 page paper will be assigned later in the semester. You will select a website, CD-ROM, multimedia technology or media phenomenon that interests you and make an analysis or critique. Your paper should address the following:
* describe the product/service - what does it do and for what purpose?
* who is the intended audience? who is the actual audience?
* what media elements are used and how do they contribute to or detract from the product/service's effectiveness
* place this product/service in the context of other media - does it extend a previous technology, what future impact will it have on society?
* offer your evaluation (critical or positive)

Final Project: 25%

This project will be self-initiated and should integrate many of the skills you will learn this semester. When the time comes I will suggest possible topics and approaches. You will have the option of working individually or collaborating with other students.

Tips

  • Warning - this course demands substantial work outside of class time to complete the projects. Unless you already own an Apple computer with the relevant software, you should plan on coming into the Digital Media lab for an additional 3 hours every week.
    Attendance is essential to succeed in this class. The skills and techniques taught are cumulative - they build upon previous ones. Missing just one week can make it very difficult to catch up. You will also note that class participation makes up a sizable percentage of your final grade - if you are absent you cannot participate and your grade will suffer.
  • Save different versions of your projects and save often. Make back-ups of your files.
  • Work in the lab with a friend - when learning new technology, 2 brains are usually better than one. You are welcome to work on your assignments at home but many students use the Multimedia Lab in room 556. Lab hours will be posted after the first week of classes. Students may not use the lab when another class is in session. If the lab is locked during regular lab hours you may get a key from the Security Desk.

Safety


Electrical:
Water/liquids are a excellent conductors. You can be shocked if you are touching water that touches electricity. Be careful with drinks around the computers!

Carpal Tunnel
Computer keyboarding, typing and use of the mouse are among many common activities that have been identified as contributing to repetitive stress induced carpal tunnel syndrome.

Attendance Policy

Attendance will be taken in each class. You are allowed one unexcused (no questions asked) absence, after which your final grade will drop substantially with each absence. In the event that an extraordinary circumstance will require you to miss a class, please let me know ahead of time, by calling me, or by email.

Disabilities

Students with disabilities who require reasonable accommodations or academic adjustments for this course must either enroll in the Program for Academic Access or register with the Office of Student Support Services. For any accommodation, the instructor must be presented with either a letter from the Assistant Director of the Program for Academic Access or an Accommodations Card from the Office of Student Support Services during the first week of classes.

Academic Honesty Policy

MMC fosters an academic community where students and faculty work together to create a learning experience that imparts knowledge and forms character. To achieve this, the College requires all members of the community to adhere to the policy of Academic Honesty that can be found in the Student Handbook, the College Catalogue and on the College website.

Schedule

SEP 10: 01 - introduction

  • digital media - what is it?
  • computer basics - hardware, software, peripherals, i/o
  • mac operating system - how to find your way around [desktop, files, commands, tips]
  • how to find digital materials - google, MMC resources, library of congress, obiblio.org

read:
- "Overture" from Multimedia: From Wagner to Virtual Reality by Randall Packer & Ken Jordan
- "Chapter 1 & 4" from The Reconfigured Eye by William J. Mitchell

assignment:
- download 10-20 online (digital) images for self-portrait project
- collect 1 physical (analog) image of your favorite celebrity that is scratched/damaged [you can provide the scratches]

SEP 17: 02 - photoshop is a hammer [ - digital imaging - ]

  • basic concepts - digital vs. analog, pixels, resolution
  • scanning demo
  • Photoshop basics: selection strategies - shape, edge, color, brightness, etc
  • image manipulation - curves, levels, brightness, contrast
  • tools - smudge, clone, etc

read:
- "Chapter 8: Computer Collage" from The Reconfigured Eye by William J. Mitchell

assignment:
"cosmetic surgery" : scan, repair and enhance a scratched/damaged image of a celebrity - be prepared to show all 3 stages

SEP 24: 03 - photoshop is also a kitchen [ - digital imaging - ]

  • layers, filters, adjustment layers
  • discuss strategies of collage and composition
  • in class exercise - play photoshop ping-pong

read:
- "Chapter 9:" from The Reconfigured Eye by William J. Mitchell

assignment:
"self-portrait" : create a collaged representation of yourself using the images you collected in week 1 and/or scanned images/objects

OCT 01: 04 - text as sound [ - typography - ]

  • basic concepts - types [serif, sans-serif, mono], screen issues
  • typographic design issues - flow, spacing, color, contrast, weight → readability
  • in class exercise - sound interpretations

read:
- "The Cut-Up Method of Brion Gysin" from The New Media Reader by William S. Burroughs
- "The Future of the Novel" from Multimedia: From Wagner to VR by William S. Burroughs

assignment:
"Propaganda" : Manipulate an image to change its meaning. You should do this by incorporating text and/or adding/removing visual information. Your aim is to influence the opinions of people, rather than impartially providing information.

OCT 08: NO CLASSES - Columbus Day

OCT 15: 05 - web web web [ - HTML - ]

  • Hey, what is the World Wide Web and how does it actually work?
  • hand coding HTML - basic tags, basic text formatting
  • 'view source' in class exercise - code sharing: Frankensite.

read:
- "Chapter 10: Identity Crisis" from Life on the Screen by Sherry Turkle

assignment:
"cut-up" : Use what you know of HTML to format the text of a poem or song lyric into an interesting web page layout

OCT 22: 06 - web web web web web web [ - HTML - ]

  • incorporating images and links [still hand coding]

read:
- "Chapter 2: The Vocabulary of Comics" from Understanding Comics by Scott McCloud

assignment:
"false identity" : Develop a false or fictional identity for an online dating service. Your web page should use only "shared" images and incorporate links to external sites.

OCT 29: 07 - image optimization and animation [ - digital imaging - ]

  • concepts - image types [JPG, GIF, PNG], transparency, browser safe, anti-aliasing
  • optimizing images for use on the web [ImageReady]
  • creating animated GIFs [ImageReady]

assignment:
"exquisite corps" class project - create 3 animated GIFs: head, torso & legs

NOV 05: 08 - web authoring [ - HTML - ]

  • basic tour of Dreamweaver
  • how to set up and organize a project
  • text formatting, images, links the Dreamweaver way
  • some basic approaches to layout - tables

assignment:
"mini-portfolio" - create a simple webpage with links to the previous weeks assignments

NOV 12: NO CLASSES

NOV 19: 09 - web authoring part 2 [ - HTML - ]

  • layout continued
  • navigation, architecture, sitemaps
  • imagemaps

assignment:
"Sitemap" - Develop a sitemap and 1 page written proposal for your final project

NOV 26: 10 - turn up the volume [ - SOUND - ]

  • basic concepts - sampling rate, frequency, file formats
  • how to capture/record/digitize/download audio & sounds [Audio Hijack Pro]
  • basic sound editing, loops, and FX [Garage Band]

assignment:
- "Rant or Rave" - see 'Assignments' section of the syllabus [due in 2 weeks]

DEC 03: 11 - lights, camera ... [ - VIDEO - ]

  • basic concepts - frame rate, aspect ratio, CODECs, file formats
  • how to capture/record/digitize/download video
  • basic editing, effects, transitions, audio [iMovie]

assignment:
- work on final project

DEC 10: 12 - open lab [ - WORK - ]

  • work on your final project in class

DEC 17: 13 - Final Class

  • in class critique of final projects
  • wrap-up and what comes next! Flash teaser [brief tour]

Class notes and projects

Class notes, links, resources and projects.

Class 01 - Introduction

Watch: Tripod Performs at Comedy Festival.

Talk:

  • watching Google vs. watching TV
  • time shifting
  • video games and relationships

Review the syllabus.

Discuss: black box or black box

Take apart a computer.

Explore OS X and learn some keyboard shortcuts.

Learn how to take screenshots.

Download images from:

Class 02 - Photoshop - Pixels

DUE:

  • download 10-20 online (digital) images for self-portrait project
  • collect 1 physical (analog) image of your favorite celebrity that is scratched/damaged [you can provide the scratches]

read:
- "Overture" from Multimedia: From Wagner to Virtual Reality by Randall Packer & Ken Jordan
- "Chapter 1 & 4" from The Reconfigured Eye by William J. Mitchell

Class 03 - Photoshop - Cosmetic Surgery

DUE: Cosmetic Surgery

Collect 1 physical (analog) image of your favorite celebrity that is scratched/damaged [you can provide the scratches]

For this project you will need to turn in three .psd files:

  1. Scan your image using one of the scanners in the Digital Media Lab. Crop/resize this image so that it is 800x600 at 72dpi. [cosmetic-scan.psd]
  2. To the best of your abilities, repair the scanned image using Photoshop. [cosmetic-repair.psd]
  3. Give your celebrity some cosmetic surgery: play with tools, brushes, filters to transform the original image. [cosmetic-improve.psd]

Class 04 - Photoshop - Self-Portrait

DUE: Self-Portrait

Using a minimum of 10 different images, create a composition that explores collage to make a representation of your self identity. The image should be 800x600 pixels.

read:

  • "Chapter 8: Computer Collage" from The Reconfigured Eye by William J. Mitchell

Class 05 - Photoshop - Propaganda

Assignment: Propaganda

Develop a piece of propaganda and deliver it to your intended audience. For this project you will need to develop both a message and a distribution strategy. The message should involve images and text and should use at least one of the tactics indicated below. Your aim is to influence the opinions of people, rather than impartially providing information. You should design the message with your distribution strategy in mind. Think about your audience. What is the best way to reach them? You can use email, mailboxes, cell phones, walls/bulletin boards, etc., etc. You could choose to spoof a form of propaganda that you have found (please share the original with me) or you could develop your own from scratch.


References:

Propaganda Critic

Wikipedia Propaganda page

Think Again - activist artists

German Propaganda Archive

Propaganda Re-Mix Project

Chinese Propaganda posters

Adbusters Posters

Propaganda is a specific type of message presentation directly aimed at influencing the opinions of people, rather than impartially providing information. You could view advertising as a form of propaganda whereby a company tries to convince a certain demographic to buy their product. The government and other groups use propaganda to encourage/discourage types of behavior (stop smoking, wear seatbelts, be Jewish). Perhaps the most powerful forms of propaganda come in times of war where it is used to created hatred towards a supposed enemy or to try and undermine the enemy's resolve. Propaganda uses various tactics:

WORD GAMES
Name-calling - The use of names when referring to groups or individuals (usually negative) - commie, fascist, pig, yuppy
Glittering generalities - The use of adjectives to describe in a positive way - Makes the product, event, person sound better then they are.
Euphemisms - Using language that attempts to pacify the audience in order to make an unpleasant reality more palatable. During wartime, civilian casualties are referred to as "collateral damage," and the word "liquidation" is used as a synonym for "murder."

FALSE CONNECTIONS
Transfer - A device by which the propagandist carries over the authority, sanction, and prestige of something we respect and revere to something he would have us accept.
Testimonial - The use of an important person to testify to the importance of the product, event, or person even if that person may not be an expert in the matter.

SPECIAL APPEALS
Plain Folks - The use of common language "Normal Folk" to describe the product, event or person to make it seem as if its already been accepted by the masses.
Bandwagon - The use of "Everybody's doing it" so you should to.
Fear - By playing on the audience's deep-seated fears, practitioners of this technique hope to redirect attention away from the merits of a particular proposal and toward steps that can be taken to reduce the fear.

Class 06 - HTML - Cut-Up

DUE: Cut-Up

Select an original text[s] or poem[s] (this can be written by you or by another author). Using what you know of HTML and any other means at your disposal (language translation software, the cut-up machine, Google searches, surfing, etc.) create your own cut-up Web page of this original text[s]. You can write your own HTML code and/or use "View Source" to copy & paste code from other websites. Make sure to turn in the original text[s] with your assignment. Remember that the goal of a "cut-up" is not complete randomness, but is rather a means to disrupting conventional linear narrative to arrive at meaningful new connections.

Background:
The "cut-up" is a technique created by Brion Gysin and made famous by the writer William Burroughs. In one approach, a page of text is cut down the middle and then across the middle to create 4 sections. These sections are then rearranged to create a new page. The method has its roots in collage and randomness, approaches to visual art that were initially embraced by the surrealists. In many ways Burroughs' approach to writing can be considered a precursor to hypertext, non-linear narrative and computer-based multimedia storytelling. We actually experience the "cut-up" in many aspects of our daily routine such as when we channel hop between television stations or when we "surf" the Internet. Burroughs argued that the cut-up is not just randomness for the sake of randomness, but a means to discovering unexpected associations between words and ideas. In this way it can be thought of as a valuable tool in many disciplines.

References:
The Cut-Up Machine

Babel Fish Translation

Dialect Translation - search for your own!
http://rinkworks.com/dialect/
http://www.ighetto.com/html/jive.shtml
http://www.cs.utexas.edu/~jbc/home/chef.html

Mark Napier
http://www.potatoland.org/
http://www.potatoland.org/shredder/

Class 07 - HTML - False Identity

DUE: False Identity

Develop a false or fictional identity. Create a website (3 page minimum) for this identity that acts as a dating profile (who are you, what are you looking for in an ideal mate, what are your interests). Your web site should use only "shared" or found images and should incorporate links to external sites.

Background:

In Sherry Turkle's chapter "Identity Crisis" she discusses how the ability for people to easily create multiple online personae challenges our notion of fixed identities. In the past, a strong identity was associated with stability and clear boundaries. But Turkle argues that in today's world, this concept is being replaced by a notion that celebrates flexibility and mutability. She suggests that the "home page" is a compelling manifestation of "new notions of identity as multiple yet coherent". When working on this assignment, consider your own online identity. What are the freedoms and risks associated with your online life? Are there things that are safer and easier to explore online rather than in RL [real life]?

References:

Basic HTML tags

Web Color Codes:
http://www.visibone.com/colorlab/
http://www.webmonkey.com//reference/color_codes/
http://html-color-codes.com/

Web sites:
http://www.thing.net/~cocofusco/
http://geobodies.org/
http://www.blacknetart.com/
http://www.nancyburson.com/

Class 08 - Animation - Exquisite Corps

DUE: Exquisite corpse

For this assignment you should create 3 separate animated GIF files that when stacked on top of each other create the complete body of a person - or - creature - or - animal - or - thing - or - robot. The 3 images should portray the head, torso and legs of your "being". Each file should have dimensions 300 pixels wide by 200 pixels tall. Save each body part both as a .psd file and "Save optimized as" a .gif file. You should turn in:

head.psd, head.gif
body.psd, body.gif
legs.psd, legs.gif

Background:
Animations attract attention and can enliven a web page design. Animation techniques can include motion, zooming, fading [in or out], spinning, color changes, selective revealing and more.

Exquisite corpse is a method by which a collection of words or images is collectively assembled. It is a technique invented by Surrealists in 1925, and is based on an old parlor game called Consequences in which players wrote in turn on a sheet of paper, folded it to conceal part of the writing, and then passed it to the next player for a further contribution. Later, perhaps inspired by children's books in which the pages were cut into thirds, the top third pages showing the head of a person or animal, the middle third the torso, and the bottom third the legs, the game was adapted to drawing and collage.

References:
http://en.wikipedia.org/wiki/Exquisite_corpse

http://blueballfixed.ytmnd.com/

http://www.futureofthebook.org/itinplace/

Do a Google search for "animated gif" to find many archives of free images.

http://k10k.net
under issues select "Font Cockpit" and "Fun Fun Fun"

http://www.cadavre-exquis.net/eng/Accueil/accueil.php

http://tiles.ice.org

Class 09 - Dreamweaver - portfolio

In class

  • layout continued
  • navigation, architecture, sitemaps
  • imagemaps
  • rollovers

DUE: Personal Portfolio

Using Dreamweaver create a personal portfolio website for the projects you've completed so far in class. You can design the website anyway you like, but it should include the following elements:

  • A homepage with some basic information about you and what this website is for, this file should be called "index.html".
  • Six additional pages, 1 for each of the previous projects - include a title and brief description about your project [cosmetic surgery, self-portrait, propaganda, cut-up, false identity, and exquisite corps] *note - for cut-up and false identity you can simply link to the pages you've already made
  • Navigation - every page should have links to every other page

!! Important !! - Don't remove any files from your original projects folders - instead, duplicate any files that you need for your portfolio. (ie you should still have your original files in your folders for project 1, project 2, etc.)

References:

http://netdiver.net/ - a great directory of innovative web design for inspiration

Class 10 - Sound

In Class

  • basic concepts - sampling rate, frequency, file formats
  • how to capture/record/digitize/download audio & sounds [Audio Hijack Pro]
  • basic sound editing, loops, and FX [Garage Band]

DUE:

‚ÄúSitemap‚Äù - Develop a sitemap and 1 page written proposal for your final project

Class 11 - Video

In class

  • basic concepts - frame rate, aspect ratio, CODECs, file formats
  • how to capture/record/digitize/download video
  • basic editing, effects, transitions, audio [iMovie]

DUE

Photoshop layouts

Class 12 - Open Lab

Work on your final project in class

Class 13 - Final Class

  • in class critique of final projects
  • wrap-up and what comes next! Flash teaser [brief tour]