Syllabus

Interactive Web Design I · DM2280B spring 2013 · Corcoran College of Art + Design
Instructor: David Ramos alberto_ramos@corcoran.edu

We are in an astonishing moment. What does it mean when a person can carry the Internet in a pocket? What happens when books start to think and to move? How might mobile computing shape culture and society? This course operates in the area where technology and design meet, seeking to answer questions about what the mobile world can be.

Description

New handheld, touchscreen devices have brought us to the edge of a new way of reading, one that brings together print, time-based, and interactive media. This course explores ways of telling stories and creating experiences in this new environment. Projects target the iPad, with workflows built around InDesign, but incorporating images, sound, video, and interactivity.

Approach

“Anything that can be connected to the Internet, will be.” (Luke Wroblewski)

Students will study the design challenges and possibilities that mobile devices bring. The class considers the effects of touch interfaces, Internet access everywhere, location awareness, and unpredictable contexts for use. It asks whether new, mobile devices can, perhaps, make the world slightly easier, more equitable, and enjoyable.

The class introduces three current approaches: Adobe’s digital publishing platform, HTML/CSS-based mobile-friendly websites, and interactive and paper prototypes. Prototyping and documentation are central concepts.

At the level of culture, this class examines changes in publishing, the future of technology and reading, and the broadening scope of design practice. Projects are open-ended, and require students to bring an editorial stance to their work.

Objectives

Students will:

Structure

This class will be a mix of demonstrations, discussion, critiques, and studio working sessions. It requires extensive self-scheduled project work outside of the classroom.

Projects

Students will produce a mixture of sketches, prototypes, documentation, and finished artifacts. Projects are student-driven, using prompts as the starting points for more extensive research, asking students to create their own content and to supply their own point of view.

The course opens with a one-week-long project, introducing design concepts that are essential to work later in the semester. Students will develop and present two navigational systems for presenting restaurant menus.

Location

Design a mobile website or smartphone application that responds to a user’s geographic location. Develop your design through critiques and usability testing. Explain your design in a screen/print booklet.

Narrative

Working from a prompt, create an electronic publication that explores a topic. Design for a tablet. Bring together text, images, and time-based media, advantage of the tablet’s screen and multimedia capabilities. Consider narrative structure and navigation systems.

Semester project

Imagine a design question that you would like to study, within the framework of mobile computing. Examine that question by making something that runs on a mobile computer – a book, an app, a magazine, a website, or something entirely different. Create working prototypes, documentation, or final pieces, using the tools and methods taught in this course.

Weblog

Create a weblog that is dedicated to this class, and post on it at least twice a week. Use the weblog to record your process and work as the class progresses. You may also add links and images that relate to your work, but not as a substitute for process documentation.

OPEN exhibition

The Undergraduate Design Department holds a yearly exhibition of student work – an opportunity to show and share projects. This year’s event takes place on Friday 30 November. It forms part of your participation grade.

Grading

 4%	Navigation
25%	Location
25%	Narrative
26%	Semester project
10%	Weblog
10%	Participation

Code/No Code

If designers do not learn to work with technology, they surrender their say in shaping new media. Some topics covered by this course involve work with HTML, CSS, and JavaScript; and some in-class exercises will require writing code. Nevertheless, student experience and familiarity with development tools varies, and for all graded projects, students will be able to choose between coding and non-coding approaches.

Tools + resources

Texts

This course draws on assigned readings and two required textbooks.

Wroblewski, Luke. Mobile First. New York, N.Y.: A Book Apart, 2011.
http://www.abookapart.com/products/mobile-first

Moggridge, Bill. Designing Media. Cambridge, Mass.: MIT P., 2010.
www.designing-media.com

Mobile First is available in print and as an ebook. Throughout the course, we will be reading excerpts from Designing Media, available in print and as free PDF downloads.

Required software + tools

Smartphones and tablets

Develop and test by making browser windows smaller or by using environments like Apple’s iOS Simulator and Adobe’s Folio Producer preview tool.

Backup strategy

Loss of data is not an excuse. Back up your work. An adequate backup plan involves duplicating your work across three different storage devices, kept in two separate locations.

Work

Process

This course seeks to help students to develop their own working processes. Good final projects invariably come as the result of diligent, structured work earlier in the semester. Do not leave work for the last few weeks. You will need to turn in your process work as part of your grade. Keep versions of your files and paper sketches as they progress. Never delete the files for anything you show in a critique.

Presenting work

If you are bringing work on paper for critiques – an excellent idea for sketches, wireframes, and design documentation – remember that other people in the class must be able to see your work. You need not mount any work from this course.

In the interest of efficiency and equity, HTML-based projects will be evaluated using a current build of Mobile Safari on iOS. You should test projects using real or simulated devices.

Submitting work

Follow these steps to submit files. If your instructor cannot readily identify or review your projects, you will not receive a grade.

  1. Put the files into a folder.
  2. Name the folder with your first and last names and the project title.
  3. ZIP compress the folder.
  4. Make sure that the name of the ZIP file contains your first and last names, and the project title.

You may send the following file formats: PDF, .folio, HTML/CSS/JS, JPG, PNG, MOV, MP4, MP3, AAC, and TXT. Your instructor will not grade InDesign, Illustrator, or Word files.

Policies

Attendance

Students are expected to attend scheduled class sessions and course-related activities. Two unexcused absences will reduce a student’s semester grade by one letter grade. A third unexcused absence is cause for failure of the course. Grounds for excused absences are illness, family emergencies, jury or military service, and religious obligations.

Grading scale

A	Outstanding 
B	Good
C	Adequate 	
D	Poor 	
F	Unacceptable

Resubmitting work

Students may revise and resubmit projects for a new grade before the end of the semester. Late work will be marked down.

Classroom rules

Intellectual honesty

The Corcoran Honor Code applies in this course. Please cite the work of others. Do not borrow projects from other students or reuse work from other classes without permission. Plagiarism or cheating are grounds for failure on an assignment; repeated plagiarism or cheating results in failure of the course. If in doubt about how and when to cite, please ask the instructor or a librarian.

Code citations: If you use any code from a source outside of the textbook and class demonstrations, insert a comment describing the material that you used, along with a URL for the original code.

College policies

Please review the Corcoran Honor Code and Attendance Policy, as published in the Student Handbook.

-30-

Published 2012-08-29.