Sample Code for html 5 / CSS / Javascript

In our last class we discussed the use of html 5 for interactive sites containing video.

The following zip-archive contains all samples of html 5 code and applications of the popcorn.js-library that we discussed in the last meeting. For download-ease I did not include a video file, which you would have to add to the files to work correctly. You can add a random video file, which will work with the archive-files as long as it is called “video_02.mp4”, “video_02.ogv” or “video_02.webm”. Another solution to use your video files with the provided code samples is to edit the file-name reference in the code.

To encode your video files in the formats we discussed you can use the following resources:

  • – VLC (
  • – ffmpeg2theora (
  • – Quicktime with webm-component ( and ogg-component (
  • – Miro Video Converter (
  • – firefogg (for ogg and webm, requires firefox) (
  • – handbrake (for mp4) (

The samples files can be downloaded here: html5_samples

Class Readings

Here are all the readings for the class. Please prepare them for the day they are listed on the syllabus.

Reading for Week 2, Sept 6, 2012:

Sergei Eisenstein: A Dialectic Approach to Film Form; in: Eisenstein, S., Film Form, 1977


Reading for Week 5, Sept 25, 2012:

Italo Calvino, Cybernetics and Ghosts; in: Calvino, I., The Uses of Literature, 1986


Reading for Week 8, Oct 16, 2012:

Espen Arseth, Allegories of Space; in Cybertext Yearbook 2000


Reading for Week 11, Nov 6, 2012:

Umberto Eco, The Open Work; chapter 1


Reading for Week 12, Nov 15, 2012:

Frances Dyson: Embodying Technology; in: Sounding New Media, 2009


Welcome to CTIN 534 – Experiments in Interactivity 1, Fall 2012

Welcome to CTIN 534 – Experiments in Interactivity 1. On our class blog you will find all posts regarding our class, the assignments, example code etc. You should also make frequent use of it to share your insights, post versions of assignments, and post references to interesting things you have seen that might be of interest for the whole class.

A version of the syllabus can be found here: USC_CTIN534_syllabus_2012

Additional Reading

Even though it is at the end of the semester, I am posting an overview of additional reading materials that were part of the discussions throughout the class. The readings are grouped loosely according to the parts of the class:


Narrative and Interactive Media:
Seymour Chatman: Story and Discourse, Cornell University, 1978
W.J.T. Mitchell: On Narrative, University of Chicago Press, 1980
Rudolph Arnheim: Film as Art, University of California Press, 1957
Ian Bogost: Unit Operations, MIT Press, 2006
Borries, Walz, Böttger: Space Time Play, Boston, 2007
Aristotle and Malcolm Heath: Poetics, 1997
Carlo Ginzburg: Clues, Myths, and the Historical Method, 1989
Chris Hales: Interactive Film and New Narrative Interfaces, 2002
Marsha Kinder: Hotspots, Avatars, and Narrative Fields Forever, 2002
Marie-Laure Ryan: Narrative as Virtual Reality, 2003
Kurt Vonnegut: Breakfast of Champions, 1999
Lev Manovich: Language of New Media, Cambridge, 2001
Fredric Jameson: Postmodernism or the Cultural Logic of Late Capitalism, Durham, 2005

Cinematography and Montage Theory:
James Monaco: How to Read a Film, Oxford University Press, 2000
Kris Malkiewicz: Cinematography, Simon & Schuster, 1992
Bruce Block: The Visual Story, Burlington, 2001
Sergei Eisenstein: Film Form, New Yorl/London, 1977
Sergei Eisenstein: Towards a Theory of Montage, London, 1991

Scott McCloud: Understanding Comics, New York, 1993
Wendy Tumminello: Exploring Storyboarding, Florence, 2005

Dariusz Jacob Boron: A History of Digital Gamespace, Boston, 2007
Henry Jenkins: Game Design as a Narrative Architecture, Boston, 2007
Ronald Levaco: Kuleshov on Film, Berkeley/Los Angeles, 1974
Kevin Lynch: The Image of the City, Cambridge 1960
W.H. Matthews: Mazes and Labyrinths, New York, 1970
Erwin Panofsky: Perspective as Symbolic Form, New York, 1997
Robert Venturi: Learning from Las Vegas, Cambridge, 1972

Interface and Visual Design:
Ben Schneiderman: Designing the User Interface: Strategies for Effective Human-Computer Interaction, Boston, 2009
Edward Tufte: The Visual Display of Quantitative Information, Cheshire, 2001
Jacques Bertin: Semiology of Graphics, New York, 2011
Kimberly Elam: Geometry of Design, Princeton, 2001
Philip Kortum: HCI Beyond the GUI, Burlington, 2008
Peter Morville: Ambient Findability, Sebastopol, 2005