Main Page

From CS160: User Interface Design Sp12

CS 160 is an introduction to Human Computer Interaction (HCI). You will learn to prototype, evaluate, and design a user interface. You will be expected to work within a group of four or five students in this project-based course. The project topic will be proposed by your group, and your implementation will be tailored to your users’ needs based on interviews with them.

In contrast to most of the other CS classes at Berkeley, CS160 does not focus on particular algorithmic techniques or computer technologies. Instead, you will make use of technology to develop your applications, and you will acquire some expertise in the development environment you choose. The focus of the course is on developing a broad set of skills needed for user-centered design. These skills include ideation, needs assessment, communication, rapid prototyping, algorithmic implementation and evaluation.

Project Theme: This semester, projects will focus on applications of Microsoft's Kinect 3D camera. The Kinect is a unique sensor that offers new opportunities and challenges in interface design. Your team will be developing applications using the Microsoft Kinect SDK. While we will provide access to a Windows-based programming environment, we encourage you to buy a personal Kinect device for this course. We may have a few Kinect devices to loan to students, but it will be easier for you to complete the assignments if you can obtain one for yourself. Note that this course does not use a textbook and the price of a Kinect is roughly equivalent to the price of a high-end textbook.

Contents 1 Announcements 2 Schedule 2.1 Week 1 2.2 Week 2 2.3 Week 3 2.4 Week 4 2.5 Week 5 2.6 Week 6 2.7 Week 7 2.8 Week 8 2.9 Week 9 2.10 Week 10 2.11 Week 11 2.12 Week 12 2.13 Week 13 2.14 Week 14 2.15 Week 15 2.16 Week 16 3 Information 4 Requirements 5 Grading 6 Assignments 6.1 Individual Assignments 6.2 Individual Feedback (No points) 6.3 Group Assignments 7 How to use and edit this wiki 8 Credits

Announcements

• Apr 24, 2012: The final Poster and Demo Session will take place Friday May 4th 2-4pm in the Visual Computing Lab (5th Floor Soda Hall).
• Apr 16, 2012: The Pilot Usability Study is now due April 23.
• Apr 1, 2012: Interactive prototype group presentation date/order posted.
• Feb 21, 2012: MyBalsamiq startup: http://www.cmumobileapps.com/2011/10/29/easy-interface-prototyping-with-balsamiq/
• Feb 6, 2012: Nick's office hours today will be in 514 Soda from 1-2 PM. You can also drop in if you want to borrow a Kinect.
• Feb 1, 2012: We will allow up to two students per group to borrow Kinects for the semester. Bring a $150 check made out to the UC Regents - this check will only be cashed if the Kinect is not returned in the same condition. We will be holding extra office hours in 514 Soda for you to pick up the Kinects - check Piazza for more details.
• Feb 1, 2012: Scott Snibbe is giving the EECS colloquium today in 306 Soda at 4:00 PM today. Here is his talk abstract:

San Francisco artist and entrepreneur Scott Snibbe will present selections from twenty years of interactive exhibits, interactive art, and interactive music. He will show many examples of interactive media with technologies including computer vision, haptics, multitouch, and iPads, including recent work creating the first app album with Björk: Biophilia; and the recent interactive exhibits for James Cameron's movie Avatar. He will discuss the educational and societal benefits of interactivity; and the joys, challenges, and research involved in the creation and distribution of interactive media on the cutting edge of interactive technology.

• Jan 24, 2012: Jerry Nixon from Microsoft will be giving an intro to Visual Studio, .NET, C# and WPF today from 4-6 PM in 380 Soda. He's a great speaker and it will be really helpful for your assignments, so definitely show up!
• Jan 18, 2012: If you encounter issues with setting up your development environment, Nick will be in the scheduled discussion room (405 Soda) on Thursday, Jan. 19 to provide help. Drop in if you would like assistance. DreamSpark note: If the verification step is failing, try signing up while on the campus network.
• Jan 9, 2012: We will expand the size of the course. As of today, 25 students are enrolled and 85 are on the waitlist. We do not yet know how many students we will be able to accomodate, but we will expand. Please come to the first couple of lectures even if you are on the waitlist. We will have more information about enrollment in the course then.
• Jan 9, 2012: We strongly encourage you to buy a Kinect for this class. Amazon is currently offering a very good price.

Schedule

W Jan 18: Introduction [ Slides ]

Assignment due by midnight on Friday Jan 20: Create a Wiki Account

Assignment due by midnight on Friday Jan 20: Course Petition (5 points)

Assignment due before class on Jan 30: Individual Design Exercise

Assignment due before class on Jan 30: Individual Programming Assignment 1

Th Jan 19: Nick will be in 405 Soda from 1-3 PM to help with setting up your development environment.

F Jan 20: No class, but assignments due by midnight

Due: Create a Wiki Account

Due: Course Petition (5 points)

M Jan 23: The Design Cycle and Brainstorming [ Slides | Readings | Submit Response (by 9am)]

W Jan 25: Sketching, Storyboarding, and Critique [ Readings | Submit Response (by 9am) ]

Natural User Interfaces (guest lecture from John Tang) [ Slides ]

Sketching and Storyboarding (guest lecture from Lora Oehlberg)

Section 1: WPF.

M Jan 30: In Class Group Brainstorming [ Slides | Readings | Submit Response (by 9am) ]

Due: Individual Design Exercise

Due: Individual Programming Assignment 1

Assignment: due before class on Feb 06: Group Brainstorm

Assignment: due before class on Feb 13: Individual Programming Assignment 2

W Feb 1: Task Analysis and Contextual Inquiry [ Slides | Readings | Submit Response (by 9am) ]

Section 2: Kinect SDK

M Feb 6: Conceptual Models I [ Slides | Readings | Submit Response (by 9am) ]

Due: Group Brainstorm

Assignment: due before class on Feb 22: Contextual Inquiry, Task Analysis, Competitive Analysis

W Feb 8: Conceptual Models II [ Slides | Readings | Submit Response (by 9am) ]

Section 3: Locus of Attention + Kinect SDK 1.0 Walkthrough

M Feb 13: Human Information Processing [ Slides | Readings | Submit Response (by 9am) ]

Due: Individual Programming Assignment 2

Assignment: due before class on Feb 22: Individual Heuristic Evaluation

Assignment: due before class on Feb 27: Individual Programming Assignment 3

W Feb 15: Input Devices and Input Models [ Slides | Readings | Submit Response (by 9am) ]

Section 4: Direct Manipulation Interfaces

M Feb 20: No Class. President's Day Holiday.

W Feb 22: Prototyping [ Slides | Readings | Submit Response (by 9am) ]

Due: Contextual Inquiry, Task Analysis, Competitive Analysis

Due: Individual Heuristic Evaluation

Assignment: due before class on Mar 5: Low-Fidelity Prototype Video

Section 5: Balsamiq

M Feb 27: Engineering Interfaces I: Layout, Widgets and Events [ Slides | Readings | Submit Response (by 9am) ]

Due: Individual Programming Assignment 3

W Feb 29: Engineering Interfaces II: MVC, Multithreading [ Slides | Readings | Submit Response (by 9am) ]

Section 6: WPF events

M Mar 5: Usability Testing [ Slides | Readings | Submit Response (by 9am) ]

Due: Low-Fidelity Prototype Video

Assignment: due before class on Mar 12: Low-Fidelity Test and Iteration

W Mar 7: Statistical Analysis [ Slides | Statistical Analysis | Submit Response (by 9am) ]

Section 7: Speech with Kinect

M Mar 12: Midterm Review [ Slides | No Readings - come with questions]

Due: Low-Fidelity Test and Iteration

Assignment: due before class on Apr 9: Interactive Prototype

W Mar 14: Midterm Exam

Section 8: No section due to midterm

M Mar 19: Graphic Design and Gestalt Principles [ Slides | Readings | Submit Response (by 9am) ]

Assignment: due by 9am on Mar 21: Midsemester Feedback

Assignment: due by 2pm on Mar 21: Individual Team Assessment I

W Mar 21: Visual Information Design [ Slides | Readings | Submit Response (by 9am) ]

Due: by 9am: Midsemester Feedback

Due: by 2pm: Individual Team Assessment I

Section 9: Midterm Post-Mortem

M Mar 26: Spring Break - No Class

W Mar 28: Spring Break - No Class

Section 10: Spring Break - No Section

M Apr 2: Collaboration and Social Software [ Slides | Readings | Submit Response (by 9am) ]

W Apr 4: Physical and Physiological Computing [ Slides | Readings | Submit Response (by 9am) ]

Section 11: UI Design Critiques

M Apr 9: Interactive Prototype Presentations I [ No Slides | No Readings ]

Due: Interactive Prototype

Assignment: due before class on Apr 23: Pilot Usability Study

W Apr 11: Interactive Prototype Presentations II [ No Slides | No Readings ]

Section 12: Project feedback and assistance

M Apr 16: Designing Help and Program Flow [ Slides | Readings | Submit Response (by 9am) ]

W Apr 18: Historical Perspectives [ Slides | Readings | Submit Response (by 9am) ]

Section 13: ??

M Apr 23: Research Directions in HCI [ Slides | No Readings ]

Due: Pilot Usability Study

Assignment: due May 4: Final Poster Presentation

Assignment: due May 4: Individual Team Assessment II

W Apr 25: Course Summary [ Slides | No Readings ]

Section 14: ??

F May 4: Poster and Demo Session 2-4pm Visual Computing Lab - 5th Floor Soda Hall

Due: Final Poster Presentation

Due Individual Team Assessment II

Please return all equipment you have borrowed by 6pm

Information

Instructor:

• Maneesh Agrawala

GSIs:

• Nicholas Kong
• Anuj Tewari

Prerequisites:
A working knowledge of programming is required. CS61A/B are one way to satisfy this requirement. If you have not taken these courses but are comfortable with Java, you will be fine. If you don't know Java but are confident you can learn another programming language quickly you will be fine as well.

Questions:

• For all technical questions, use the CS160 Piazza Q&A Site.
• For private questions, send email to cs160(at)imail.eecs.berkeley.edu
  

Please avoid emailing the Instructor or the GSI directly. You will receive a response much faster if you use Piazza or the email address above.
You may also choose to email us anonymously.

Meeting:

• Lectures: 306 Soda Hall MW 2-3:30PM
• Discussion Sections: 405 Soda Hall -- Tu 11-12noon, Tu 3-4pm, Th 1-2pm, Th 2-3pm

Office Hours:

• Maneesh: 535 Soda Hall, Time M 3:30-4:30pm and by appointment
• Nick: HMMB (Hearst-Mining) 354, M 1-2pm and Tu 2-3pm
• Anuj: HMMB (Hearst-Mining) 354, W 3-4pm and F 3-4pm

Textbook:
There is no required textbook for this class. There will be readings assigned for each lecture. The readings will be available online through this wiki. If you are interested in reading further take a look at the recommended reading list.

Kinect Devices
The course project this semester will be based on Microsoft's Kinect 3D Camera. Although we are hoping to obtain a few Kinect devices -- enough to supply one per project group -- we strongly recommend buying your own personal device. Owning the device will facilitate completion of the individual projects and also make it easier to work on the group project in parallel. Your best bet is to buy the Kinect online where we have been able to find it on sale for about $110-150.

Requirements

CS160 is an upper division course, and one of few where you will work extensively on one significant programming project. To participate fully in this course, you are required to have taken CS61B. We will assume that you are familiar with either Java or C++ and are comfortable coding a large-scale project.

You will be expected to actively participate in lectures, complete readings ahead of time, complete a number of small programming assignments, and, most importantly, participate fully in your group project. The teaching staff will promptly return graded homework to you, and will be available to provide feedback and help with problems.

Note that the majority of the work in this course is conducted in the form of a semester-long group project. Unlike other courses, dropping the course before the end of the semester has negative consequences for your other group members. So once you have joined a group please make sure you are committed to staying in the course.

• You are expected to read the assigned readings and post 1 substantive comment about the readings before class. Late comments will NOT be accepted. There will be plenty of opportunities in class to apply that knowledge and in-class participation will be part of your grade. More on the class participation component can be found here.
• There will be two types of assignments: individual assignments and group project assignments. Individual assignments will either consist of design exercises or short programming exercises; their main goal is to teach you the skills needed to successfully execute on your project. Group project assignments will be done in groups.
• You will be expected to turn in documentation at each stage of your project. You will also turn in working code. Each group member will help to give an oral presentation about your project.
• There will be a midterm exam.
• Most assignments will be turned in through this class wiki. Most project assignments will be due before the start of the lecture during which they are due. Individual assignments will be due at the begining of the week.
• Project assignments may not be turned in late. Programming assignments will lose 33% per day they are late.
• Each group is responsible for making sure that all members are participating. As part of the project reports, you be required to describe the effort put in by each member, both on specific tasks and as a fraction of the group’s effort. Make sure you discuss this regularly, to make sure your group is in agreement about the work breakdown.
• If a group member is not participating, the entire group must meet with the teaching staff. Effective group work (which entails some amount of conflict resolution) is a key skill for success in industry. We would like you to work through conflicts if at all possible, and we will devote some class time to this topic.
• If you have a question about a grade, you should meet with the GSI. You can come to the professor if the issue cannot be resolved with the GSI's help.
• Cheating will not be tolerated, and will get you an F in the class.

Grading

• Class participation (10%)
• Individual assignments (25%)
• Midterm (25%)
• Group project assignments (40%)

Late Policy:
Group project assignments may not be turned in late. Individual assignments will lose 33% per 24 hours they are late. If you turn in an assignment late on the wiki, please send an e-mail to the class e-mail address (cs160(at)imail.eecs.berkeley.edu) so that we know to grade it.

Regrading Policy:
If you want an assignment regraded, you must submit a hardcopy of your assignment and a written description of why you believe the grade was unsatisfactory within two weeks of reception of the grade. Submit the regrade request to Prof. Agrawala's office, 535 Soda Hall. We will regrade the entire assignment; this means that your grade may potentially drop.

Section Attendance:
Section attendance is strongly encouraged and is considered in the class participation grade. However, you are allowed to miss up to two sections; this is to accommodate both planned and unplanned absences.

Note:
This is largely a design class. Unlike most other CS classes there is not always a single "correct" design solution. Usually there are many possible designs with different advantages and disadvantages. In this class you will learn to both design new interfaces and evaluate the pros and cons of the interfaces you design. As you complete the assignments for this class you should try to point out both the pros and the cons of the interfaces and applications you design.

Design is typically evaluated in a qualitative manner. As a result a significant portion of the grading in this class will be qualitative, including assessments of the end user experience of the system and the quality of your designs, evaluations, and prototypes.

Assignments

The majority of the homework in this class will be oriented around the project. Many of these homework assignments will be done in with your project group, but some assignments (or parts of assignments) must be completed individually. We provide a rough schedule of the assignments here (the schedule may change over the course of the semester and we may choose to add or drop assignments).

Individual Assignments

• Create Wiki Account (due 1/20)
• Course Petition (1/20)
• Individual Design Exercise (1/30)
• Individual Programming Project 1 (1/30)
• Individual Programming Project 2 (2/13)
• Individual Heuristic Evaluation (2/22)
• Individual Programming Project 3 (2/27)

Individual Feedback (No points)

• Mid-Semester Feedback (3/21)
• Team Assessment I (3/21)
• Team Assessment II (5/4)

Group Assignments

• Group Brainstorm (2/6)
• Contextual Inquiry and Task Analysis (2/22)
• Low-Fi Prototype (3/5)
• Low-Fi Test + Iteration (3/12)
• Interactive Prototype (4/9)
• Pilot Usability Study (4/23)
• Final Poster Presentation (5/4)

How to use and edit this wiki

New to wikis? Read the Wiki editing guide.

To contribute to this wiki, you'll need to first create an account. Please use your full name as your user name as in this example. Afterwards, please add some descriptive information about yourself on your personal page -- click your login name (next to the person icon) at the top of the page to access your personal page.

To facilitate discussion we have created the [add comment] button that appears at the bottom of each page. Clicking on the button will allow you to add a comments, ideas or question to the current page. The comments will include your user name and the date in the section heading. Try adding a comment to the discussion page for a lecture.

Credits

This lectures, format and syllabus of this class are based on HCI classes taught by Ben Bederson, John Canny, Francois Guimbretiere, Marti Hearst and James Landay. These authors have kindly provided access to their lecture slides and my own slides borrow from their earlier work.

---