No description, website, or topics provided.
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

Web Production 1, Fall 2018

August 27 - December 21, 2018 | Film + Media, Hunter College

MEDP 28500 - 22156 || Wednesdays 7pm - 9:40 pm || North Building HN-470

Professor: Rebecca Leopold
Course Wiki:

Course Description:

This production course is an introduction to writing code for the web through the lens of visual culture and networked media. Class participants will explore granular techniques for design and programming including HTML, CSS, JavaScript and various JS frameworks and libraries. The goal is to introduce various fundamental front-end web and interactive technologies to present a clear understanding of how they interrelate in order to produce creative material for web distribution. Weekly readings, discussions and assignments will ask participants to consider different ways the web can be used for creative and documentary purposes.

Class Participation:

By enrolling in this course and entering the classroom, each student makes the tacit commitment to participate in the class. Active class participation involves more than mere physical presence. Students are expected to be actively involved in the class, contributing positively to discussions, arriving on time having thoughtfully completed the reading, technical and creative assignments. They should take the initiative in discussion and projects, ask relevant questions, and contribute to the over-all learning environment of the class.

It is your responsibility:

  1. To prepare for class by having read assignments, written papers and/or prepared projects
  2. To actively participate in class discussion and activities
  3. To take notes on discussions, presentations, and activities conducted within the class
  4. To complete all course assignments, even if you are absent from a class meeting

Although you will need your laptop for every class, computers should be closed and mobile devices silent + not glowing during critique, class discussion and technical demonstrations. The mis-use of computational machines while in class will negatively affect your grade.

Expected Learning Outcomes:

  1. Know more about web authoring technologies including CSS, HTML, and JavaScript
  2. Create a media-rich website with a text editor that uses responsive design to adapt to the browser and device of the user
  3. Compose pseudocode to think through problems and create site maps and wireframes to map out project development
  4. Apply JavaScript libraries and API’s for web development
  5. Distinguish important characteristics of Internet Art and identify leading practitioners
  6. Distinguish the trade-offs between creating a website with a CMS and a text editor

Class Blog:

Using a blog publishing platform such as WordPress students are required to maintain a weekly blog (one entry per week of the semester) that relates directly to the course and share links to your entries on the class wiki. Blog entries should be 1-3 paragraphs that analyze a web-based project. I will be looking for the quality as well as the depth of your engagement with the material. You may choose to consider examples presented in class or base your writing on your own research.

“Share” (or the class Wiki):

The class wiki is where the rest of the syllabus including each day's resources, in-class and take-home assignments will be found. To turn in your homework you must link to it every day using Markdown. You are required to post on the wiki. To contribute to the wiki you must set up a Github account. We will do this in class on the first day.

Method of Evaluation:

  1. Regular assignments: Course Blog + Wiki + Code + Technical Exercises (30% of grade) will be executed through the semester by following in class demonstrations, online tutorials and assigned readings. These exercises will be essential for learning markup and coding and to successfully complete more complex projects.

  2. Class Participation (20% of grade): Please arrive to class on time. Please do the assigned readings and come to class prepared to share your reflections - active and informed discussion makes the course more interesting for everyone. Attendance to all classes is required and attendance is taken at each class.

  3. Midterm Project (25% of grade) 

  4. Final Project (25% of grade) due during Final Week of Classes     


Required Viewing + Reading:

  • There will be a reading every week. Readings will be linked from the class wiki each week.
  • HTML, CSS & JavaScript Essential Training Subscription to is available through the New York City Library system. Go Sign In (upper right corner) > “Sign in with you organization portal” (under Continue button) > Enter your organization’s URL to log in through their portal: for example “” (for a Brooklyn Library member) > Enter Library Card Number and Library Card Pin and you will have access to the assigned video tutorials. A Kiosk is also available on a first come first serve basis at the Technology Resource Center located in Thomas Hunter, Room 402.
  • HTML, CSS + JS Dan Shiffman Tutorials

Suggested Texts:

Course Outline (this is subject to change):

Week 1 : Wednesday August 29
  • Intro to Course, Class Participants & Instructor
  • Intro to the WWW
  • Working with Text Editors
  • GitHub, Markdown + the Class Wiki
  • Workflow + Directory (File Path) Organization + Running a Local Server
  • Create a CMS website using Wordpress, Tumblr, SquareSpace, Wix or Drupal + email me the URL.
  • Reading: (Watch) Ways of Seeing + (Read) Understanding a Photograph - John Berger
  • Share: Write a blog entry reflecting on Ways of Seeing, Understanding a Photograph or both.
  • Code Exercise: Download a txt editor like Atom or Sublime and get the sample code running via a python server in your browser. Change the image + HTML properties to create a landing page that somehow relates to your recent work or create a self portrait page.

Week 2 : Wednesday September 12
  • Intro to HTML
  • Intro to the Browser + the DOM
  • Authoring HTML document models
  • Images + Video w/ HTML
  • Sitemap + Wireframes

Week 3 : Wednesday September 26
  • HTML Attributes
  • Intro to CSS

Week 4 : Wednesday October 3
  • CSS Text Formatting + Color
  • CSS Positioning - CSS Grid

Week 5 : Wednesday October 10
  • Responsive Web Design
  • Intro to Grids

Week 6 : Wednesday October 17
  • CSS Positioning - fluid layouts

Week 7 : Wednesday October 24
  • Midterm Project Proposals
  • CSS3: Animation

Week 8 : Wednesday October 31

Week 9 : Wednesday November 7
  • Intro to Programming
  • JavaScript Workflow, Syntax + the Canvas
  • Variables + Arrays

Week 10 : Wednesday November 14
  • More JS
  • Intro to JS libraries
  • Intro to p5.js

Week 11 : Wednesday November 21
  • More JS
  • Intro to Bootstrap.js

Week 12 : Wednesday November 28
  • Final Project Proposals

Week 13 : Wednesday December 5
  • Intro to JQuery
  • Next Steps - The Server Side

Week 14 : Wednesday December 12
  • Final Project Workshop

Week 15 : Wednesday December 19

Hunter Assistance & Policies

Computer Labs
Besides the grad lab and lounge, there are several labs available at Hunter to complete homework assignments. The schedule for this lab will be posted outside the entrance and online. Other labs available: ICIT 10th Floor labs

Academic Integrity Statement:

Hunter College regards acts of academic dishonesty (e.g., plagiarism, cheating on examinations, obtaining unfair advantage, and falsification of records and official documents) as serious offenses against the values of intellectual honesty. The College is committed to enforcing the CUNY Policy on Academic Integrity and will pursue cases of academic dishonesty according to the Hunter College Academic Integrity Procedures. Integrity and credibility are the two pillars of journalism. All work submitted in this class must be your original work. Any student presenting the work of someone else, whether off the Internet or from another publication or from a classmate will receive an F for the course.


In compliance with the American Disability Act of 1990 (ADA) and with Section 504 of the Rehabilitation Act of 1973, Hunter College is committed to ensuring educational parity and accommodations for all students with documented disabilities and/or medical conditions. It is recommended that all students with documented disabilities (Emotional, Medical, Physical, and/or Learning) consult the Office of Accessibility located in Room E1124 to secure necessary academic accommodations. For further information and assistance, please call (212) 772-4857/TTY (212) 650- 3230. If you have registered with the Office of Accessibility, please let me know at the start of the term.

Hunter College Policy on Sexual Misconduct:

In compliance with the CUNY Policy on Sexual Misconduct, Hunter College reaffirms the prohibition of any sexual misconduct, which includes sexual violence, sexual harassment, and gender-based harassment retaliation against students, employees, or visitors, as well as certain intimate relationships. Students who have experienced any form of sexual violence on or off campus (including CUNY-sponsored trips and events) are entitled to the rights outlined in the Bill of Rights for Hunter College.

a. Sexual Violence: Students are strongly encouraged to immediately report the incident by calling 911, contacting NYPD Special Victims Division Hotline (646-610-7272) or their local police precinct, or contacting the College's Public Safety Office (212-772-4444).
b. All Other Forms of Sexual Misconduct: Students are also encouraged to contact the College's Title IX Campus Coordinator, Dean John Rose or 212-650-3262 or Colleen Barry or 212-772-4534 and seek complimentary services through the Counseling and Wellness Services Office, Hunter East 1123.

Emergency/Crisis Info: 

This is a list of numbers, which you can use if there is an emergency or crisis situation on the Hunter campus or if you need assistance at other times. 
Security -B125 West - 772 – 4444; 
Medical Office - Room 307 North - 772 – 4800 (During business hours) Office of Student Services - 1119 East - 772 – 4882 4891 (crisis counseling available), The Women's Center - 801 East - 772 – 4931.