A Hands-On Approach to User Interface Prototyping

Tags: , ,

Categories: GSI Online LibraryTeaching Effectiveness Award Essays

by Lora Oehlberg, Mechanical Engineering

Teaching Effectiveness Award Essay, 2010

Problem. Engineering design enables students to take action; students must learn not only how to think about design problems, but also how to implement possible designs. In Fall 2008 and Fall 2009, I was a Graduate Student Instructor for ME 290P, “Managing the New Product Development Process,” a multidisciplinary graduate-level product development course. Taught by Alice Agogino in Mechanical Engineering and Sara Beckman in the Haas School of Business, this course introduces student teams to the design process through a semester-long, human-centered design project. However, students are expected to pick up necessary practical design skills on their own over the course of their project. As the GSI, I held Friday office hours followed by hands-on workshops to teach skills that related to the topics presented in course lectures. At the end of the semester, I realized that the Friday workshops should be available to students beyond ME290P, particularly because the workshops help students develop marketable skills for careers in design.

Solution. To address this, I initiated a series of User Interface Prototyping Design Clinics that focused on teaching hands-on prototyping skills to communicate design concepts. I organized this course with help from two Masters students from the iSchool, and recruited Bjoern Hartmann, a professor in Computer Science, to sponsor the course. The clinics are offered as a one-unit seminar in the computer science department, meeting once per week for two hours. At each session we briefly introduce a prototyping technique for 30 minutes, leaving 90 minutes for the students to use that technique to create a design that they present at the end of class.

I surveyed students and faculty in the UC Berkeley Design community, as well as practicing interaction designers, to gauge interest in learning particular tools and understand which tools are used on a regular basis in industry. For each session we invited a professional interaction designer to lead a tutorial on a prototyping tool. I personally led a clinic on design sketching, tailoring my talk for interaction designers by emphasizing figure drawing, cartooning, and communicating action.

Assessment. The Design Clinics have been received very positively. Around 20 students enrolled in the course for Spring Semester and I’ve already fielded numerous requests from students interested in future offerings. After leading a course session, a professional interaction designer and Berkeley alumnus commented on how he wished a course like the prototyping design clinics had existed while he was at Berkeley.

Mid-semester, students filled out a Feedback Survey to let us know the most important things they had learned, what they still didn’t understand well, and what they would like to see covered. Several students felt that they “learned a shocking amount given the short time,” and felt the clinics provided the right equipment and in-class support. One student summed up the course experience: “Just being exposed to the tools has been great. I really appreciate that I now have some idea of what people are talking about when they talk about Balsamiq or Omnigraffle, etc. Plus, I’m having fun!” Students expressed a desire to see more of how the tools were used in industry. Based on this feedback, we’ve encouraged speakers to showcase tools using examples from their own work, and encouraged students to talk with our guests about their own prototyping experiences.

In their midterm surveys, the students listed my sketching talk as one of the highlights of the course. After presenting my sketching workshop to the Design Clinic, I was asked by course instructors to lead workshops in two human-computer interaction courses, CS160 and INFO 213.

The Spring 2010 Design Clinics successfully engaged professional designers with the Berkeley design community and helped students gain practical design skills. I’m planning on revising my Friday workshops for ME290P to reflect what I’ve learned through this design clinic series — giving students more time to explore tools on their own, providing connections with industry, and connecting students with skills relevant to their future professional careers.