Course Overview

The course introduces fundamental methods, principles and tools for designing, programming and testing interactive systems with a special focus on mobile user interfaces and emerging interaction styles.
Prerequisite: CS111 or CS112 or CS115

Topics List

Brief history of HCI
• Computer abilities – Moor’s law
• Human capabilities
• The cost of getting it wrong
• Usability dimensions
Guidelines & Principles
User-Centered Design
• Usability Engineering Process
• User-centered design
User and Task Analysis
Design patterns
Graphic & Color Design
UI Software Architecture
User Testing and Evaluation at Scale

Direct Manipulation & Mental Models
Reality-Based Interfaces
HCI for AI

Reading Materials

The course has a textbook:

Additional reading materials will be available on the course shared e-reserve collection (Google Drive).

Course Requirements

Active participation in this course is required and will be determined not only by class attendance but also by participation and contributions to in-class discussions and activities.

There are three homework assignments in this course that explore conceptual and technical aspects of develping interactive computing systems.

In addition, the course has a final project that requires students to work in teams to design, implement and evaluate a mobile user interface. Teams for the project will be assigned by the istructor.
As part of your team project, you will be expected to do the following:

  • Identify a problem that could be addressed through the development and deployment of a mobile application. Use the project design briefs as a starting point for choosing a topic for your appliction.
  • Develop a conceptual design for a novel mobile user interface, and build a paper prototype.
  • Implement the mobile user interface you have designed using jQuery Mobile. This is an iterative process in which you will re-design, build, and evaluate.
  • Document your user interface with pictures, video, diagrams, and text in a web page that will remain a part of the Human-Computer Interaction course online gallery.
  • Present the mobile interface you have built in class.

There are two quizes about topics discussed in lecture and readings, and a final exam.


Grades for the course will be determined by five factors:
Active participation during class - %5
Homework assignments - %30
Final project - %20
Quizzes - %20
Exam - %25

This course complies with the Wellesley College grading policy. While that policy asks faculty to hold each 100- and 200-level course with 10 or more students to an average of no higher than 3.33, it does not require faculty to grade on a "curve." There is no arbitrary limit on the number of A's, B's, C's etc., and every student will be assigned the grade they earn and deserve according to the grading standards of the college.

Collaboration Policy

This course emphasizes collaboration, as working effectively within teams is an important part of the innovation culture. Working with a team provides you with opportunities to develop and improve interpersonal, communication, leadership, and follower-ship skills. Group assignments and team project are also important for learning integrative skills through the development of a complex system.

We strongly encourage you to get to know all of your classmates and to collaborate extensively with them. Because of the interdisciplinary nature of this course, you may be strong in some areas but weak in others. Please share your strengths, and feel free to ask others for help.

In your quizzes and exam no collaboration is allowed.

Here is a summary of our collaboration policy:

  •  Assignments: Rotating pairs of students
  •  Project: Teams of 3 students
  •  Quizes and exam: Absolutely no collaboration

Laboratory and Computing Environment

Classes will be held in the Science Center room E125 (HCI Lab).
During the course we will use iPhone or iPod devices (will be available for check out from the HCI lab).
If possible, bring your laptop to class.

We will be using the following tools and APIs:
Mockups - Balsamiq
Mobile web app - jQuery Mobile
Information visualization - Google Charts
Conversational UIs - Bot Society
VR content - A-Frame, Google Cardboard

Google CS220 Group

We will use a google group for communication purposes.
Reading materials are available on Google Drive. Homework assignments will be submitted on Google Drive.

Students with Special Needs

If you have any disabilities, including learning disabilities, you are encouraged to meet with an instructor to discuss accommodations that may be helpful to you.