New Media Production -- CP440 - S21
Time: 02:00pm – 04:50pm
Location: Online Scheduled Distance Learning
Professor: Robert Spahr
Office: MCMA 1056B
T 01:00pm - 04:00pm
W 09:00am - 12:00pm
and by appointment
Course Syllabus Location: http://www.robertspahr.com/nmp/
New Media Production - 24429 - CP 440 - 001
(co-convened with New Media Production - 24664 - MCMA 511 - 001)
Casabona, Joe. HTML and CSS, Ninth Edition (Visual Quickstart Guide). Peachpit Press
*** All other readings will be distributed in class or available online. ***
"Any sufficiently advanced technology is indistinguishable from magic."
— Arthur C. Clarke, Profiles of the Future: An Inquiry Into the Limits of the Possible
- Students will develop a deeper understanding of the history and theory of the Internet and World Wide Web.
- Students will speak and write critically about the arts and networked culture.
- Students will develop new production skills, and apply this knowledge in critiques and in the creation of individual and collaborative studio projects.
### Please note syllabus is subject to change with notice. ###
Introductions, The Internet, & Basic HTML Markup
Speedviewer's Guide to New Media
Internet - Basic HTML
Code Example: Basic HTML template
Free/Open Source Software for New Media Production
Assignment: Compare & Contrast Exercise
HTML Basics, Tables & CSS Style Basics
HTML Basics, Tables & Lists
CSS - Style
Due: Compare & Contrast Exercise
Marshall Brain: How Web Servers Work
Vannevar Bush: As We May Think, Jul 1945
The Simpsons in CSS
CSS Zen Garden
The First Computer Bug
Douglas Engelbart : The Mother of All Demos (1/9), Dec 1968
Douglas Engelbart: The First Mouse, Dec 1968
HTML5, Images, Typography, & Multimedia
Typography, Images, & Multimedia
Elements of Art & Principles of Organization
Code Example: HTML5 Template
Luigi Russolo: The Art of Noises, July 1, 1913.
Listen to Intonarumori
F.T. Marinetti, et al: The Futurist Cinema, November 15, 1916.
Creating a Cinemagraph in Gimp
John Cage about silence
Kutiman-Thru-you - 01 - Mother of All Funk Chords
Kutiman-Thru-you - 03 - I'm New
Lead Breakfast ('Pulp Fiction' Remix)
Assignment: Project #1
Advanced Layout Using CSS
Lecture Notes: CSS - Layout
CSS Layout - Position Absolute
CSS Layout - Position Relative
CSS Layout - Position Float Left
CSS rollover image example
CSS navigation bar
Adrienne LaFrance: Facebook is a Doomsday Machine, Dec 2020
Rebecca Solnit: Who will stop Google?, Jun 25, 2013
TEDxMidAtlantic 2011 - Vint Cerf - Interplanetary Internet Dec 1, 2011
7 Minutes to Mars: NASA's Perseverance Rover Attempts Most Dangerous Landing Yet Feb 12, 2021
Presentations / Critique of Project #1
Project One is due.
Assignment: Project #2
Kelly: The Technium - Better Than Free
Free / Open Source Software (FOSS), Privacy & Remix
Lecture Notes: Software That Protects Your Private Bits
Bill Gates: Open Letter to Hobbyists, February 1976
Richard Stallman: The GNU Manifesto, March 1985
Lawrence Lessig: The Internet Under Siege, November 1, 2001
ESR cathedral and the bazaar 1:06
Free software, free society: Richard Stallman at TEDxGeneva 2014 13:39
Everything is a Remix Part 1 07:18
Everything is a Remix Part 2 09:48
Everything is a Remix Part 3 11:17
Marcin Jakubowski: Open-sourced blueprints for civilization 04:11
RiP! A Remix Manifesto 1:26:24
Tactical Media, Hacktivism & Net.Art
Lecture Notes: Tactical Media, Hacktivism, Net.Art
Mark Tribe: Introduction to New Media Art
NYTimes: How Facebook is Changing Your Internet, 09:50
NY Times: How China is Changing Your Internet, 05:57
Proposal for Project #2 is due by email.
Assignment: Project #3
Geany Snippets: snippets.conf
Project #2 - Student Presentations / Critique
Project #2 is due
Resources: Questions for Website Critiques
Proposal for Project #3 is due by email.
Templates, Usability & Search Engine Optimization
Responsive Web Design & Open Studio
Responsive Grid Page
Responsive Youtube Video
Class will begin at 3pm on Zoom.
Finals Week - Tuesday, May 04 @ 2:45-4:45PM
Student presentations of Project 3 works-in-progress.
Project 3 is due no later than 11:59PM CDT
Please submit Project 3 as a zipped file by email.
Project 1: Collaborative Hyper-NarrativeWe will be creating an experimental hyper-narrative based on the poem:
Read: T.S. Eliot: The Love Song of J. Alfred Prufrock
Listen: T. S. Eliot reads The Love Song of J. Alfred Prufrock
View the completed Project One - Spring '21
Students assigned lines for Project #1
Each student in the class will create two web pages which will have at least one text or image link. Your link will connect to the next page in the sequence.
Keep it simple, and make the narrative linear. I want you to create an impressionistic page that captures the dream-like qualities of the poem. I do not want you to illustrate the text. Everyone will be assigned a specific section of the poem. You will build two pages that (in some form) convey your section of the poem using HTML/CSS: Images, Links, Text formatting, Paragraphs, Alignment, Page Titles, etc.
A viewer of our group collage will click through a series of web pages that will have an impressionistic narrative loosely following the poem.
For inspiration, take a look at some of these pioneering Hypertext narratives:
- Mark Amerika's Grammatron
- Ben Benjamin's Superbad
- Olia Lialina's My Boyfriend Came Back From the War
Consider how they use Photomontage, and the way they combine text with image to create meaning.
1) You should use at least two images per page. To avoid naming conflicts, be sure to include your last name in the file name of your image. For example: "chairspahr.jpg"
2) Be sure to use CSS styled text using an internal stylesheet.
3) One or more of your images/text links should link to the next page. (This will be a relative link.)
Your pages should link with the following logic:
If you are doing pages 7 and 8, they should be called page07.html, page08.html.
page07.html should link to page08.html,
page08.html should link to page09.html (which will be someone else's page.)
At a minimum, you will create two HTML pages using internal stylesheets, each page will have at least two images, and at least one link to the next page.
This project will be uploaded to your neocities website.
Project 2: Gallery Portfolio
You will curate an online exhibition by selecting at least 5 works organized with a specific theme. Design and develop the look and feel of your gallery portfolio site. Consider the audience and the purpose of the site. Develop a navigation convention and interface that successfully presents the work. A good place to start is to explore the artbase at http://www.rhizome.org/.
The second project will be uploaded to web. A zipped file of the project, and all source materials, notes, sketches and documentation in a folder labeled "source" should be emailed to the instructor.
Details regarding this project will be discussed in class.
Potential Themes to Explore
hypertext mark-up languages
software / programming
open-source, free culture & ownership
social networks / social software
Project 3: Individual Project.
In consultation with the instructor, each student will propose and develop an individual project.
Students are encouraged to imagine project ideas that match their interests, but possible projects could be a personal portfolio web site, a net.art project, a dynamic web project using PHP, or a physical computing project using Raspberry Pi computers. Further discussion will take place in class and in one-on-one conversations with the instructor.
The final project will be uploaded to web. A zipped file of the project, and all source materials, notes, sketches and documentation in a folder labeled "source" should be emailed to the instructor.
Details regarding this project will be discussed in class.Examples of previous students Net.Art:
Allie Lee: Tape
Sarah Mitchell: Dress Me Up
Derek Dadian-Smith: 108 Koans
Evaluation:The work in this course requires motivation, exploration, risk-taking, and most importantly, an openness to new ideas. The grading policy of this class is meant to encourage you to explore new ideas and take chances. Do not think in terms of "What must I do to receive an A grade", but think in terms of what you would like to learn.
Attendance: Attendance to all classes is expected. You are allowed up to TWO unexcused absences. Unexcused absence beyond this threshold may result in failing this course. Students are expected to be at all scheduled 'studio days' working on their projects.
Assignments: All assignments and projects are due at the beginning of class. Late projects will not be accepted.
Thought Questions: Should be in PDF format, no longer than one printed page, and emailed to the professor before the beginning of class. At the top of each document place your name, the class name, the date, and the title of the reading.
Required Equipment: Students are required to bring a wifi enabled laptop to class. The laptop should be no older than 5 years, and can run Mac OS, Windows or Linux. All required software is free and open source (FOSS), and will be downloaded and installed in class.
Grading: A 95-100, A- 92-95
Solution shows excellent depth of understanding and innovation. The solution has been fully developed in form and concept.
B+ 88-91, B 85-87, B- 82-84
Solution exceeds all requirements and shows above average depth of understanding. Demonstrates more than adequate clarity of idea and execution.
C+ 78-81, C 75-77, C- 72-74
Problem has been solved adequately, but the solution lacks depth of understanding, development and innovation.
D+ 68-71, D 65-67, D- 62-64
Solution is extremely weak and lacks understanding and innovation. Technical skills are weak.
F 61 or less
Solution to the problem is unresolved and incomplete resulting in a failing grade.
Each Project will be graded on artistic, creative and intellectual merit.
Grades will be based on the following:
- 20% Originality of concept
- 20% Delivery (execution of the concept)
- 20% Documentation / Process
- 20% Craft
- 20% Critique & participation
Your final grade will be determined by the following:
- 25% Participation / Thought Questions
- 5% Project #1
- 30% Project #2
- 40% Project #3