cmsc434 week 01 | lecture 01 | sept 02, 2014 design ... › class › fall2014 › cmsc434-0101 ›...
TRANSCRIPT
Human Computer Interaction Laboratory
@jonfroehlich Assistant Professor Computer Science
CMSC434 Introduction to Human-Computer Interaction
Week 01 | Lecture 01 | Sept 02, 2014
Design Activity, Intro to HCI, Intro to Class
Remixed from http://marshmallowchallenge.com/Instructions_files/TED2010_Tom_Wujec_Marshmallow_Challenge_Web_Version.pdf
GOAL: Build the tallest freestanding structure. The winning team is the one with the tallest structure measured from the table top surface to the top of the marshmallow.
Remixed from http://marshmallowchallenge.com/Instructions_files/TED2010_Tom_Wujec_Marshmallow_Challenge_Web_Version.pdf
RULES: 1. The structure cannot be suspended from a higher structure, like a chair,
ceiling, light
2. The structure cannot be taped to the desk/table.
3. The entire marshmallow must be on top—cutting/eating part of the marshmallow is not allowed
4. Use as much or as little of the kit; however, you cannot use the paper bag as part of your structure
5. You can break up the spaghetti, string, or tape in anyway you want.
6. The challenge lasts 18 minutes. You cannot hold/touch the structure after time runs out. You cannot open the bag until the timer starts.
GOAL: Build the tallest freestanding structure. The winning team is the one with the tallest structure measured from the table top surface to the top of the marshmallow.
Remixed from http://marshmallowchallenge.com/Instructions_files/TED2010_Tom_Wujec_Marshmallow_Challenge_Web_Version.pdf
RULES: 1. The structure cannot be suspended from a higher structure, like a chair,
ceiling, light
2. The structure cannot be taped to the desk/table.
3. The entire marshmallow must be on top—cutting/eating part of the marshmallow is not allowed
4. Use as much or as little of the kit; however, you cannot use the paper bag as part of your structure
5. You can break up the spaghetti, string, or tape in anyway you want.
6. The challenge lasts 18 minutes. You cannot hold/touch the structure after time runs out. You cannot open the bag until the timer starts.
GOAL: Build the tallest freestanding structure. The winning team is the one with the tallest structure measured from the table top surface to the top of the marshmallow.
Remixed from http://marshmallowchallenge.com/Instructions_files/TED2010_Tom_Wujec_Marshmallow_Challenge_Web_Version.pdf
1. TEAM: LUKA – 26.25
2. TEAM: HALLEY – 25
3. TEAM VICTOR – 37.5
4. TEAM IZZY – 15
5. TEAM PETE – 0
6. TEAM ALEX – 0
7. TEAM JASON – 19.5
8. TEAM JAKE – 27.25
9. TEAM ERICA – 22.5
10. TEAM ANDREW – 19.5
11. TEAM SAM – 22
12. TEAM EILEEN - -2
TEAM MEASUREMENTS:
*Red teams had previous Marshmallow challenge experience
Remixed from http://marshmallowchallenge.com/Instructions_files/TED2010_Tom_Wujec_Marshmallow_Challenge_Web_Version.pdf
DEBRIEF:
1. How did you approach the task? What was your building process?
2. How did you collaborate and work together?
3. What is the key to a tall structure? Why?
4. What do you think are shared attributes between the most successful teams?
MY THOUGHTS
To me, this task represents a microcosm for the entire semester. This
course is fundamentally about design, which requires creativity,
iteration, and collaboration.
It’s also about working with and within constraints—be it time, money,
or resources. You cannot escape constraints in life or work.
Slide from http://marshmallowchallenge.com/Instructions_files/TED2010_Tom_Wujec_Marshmallow_Challenge_Web_Version.pdf
PETER SKILLMAN’S TAKEAWAYS
You learn by doing
Work in parallel
On being first to market
Multiple iterations
All projects have resource
constraints
Peter Skillman, Original Marshmallow Challenge Talk TED, 2006, http://youtu.be/1p5sBzMtB3Q
Learning from the mistakes of others* is
the best way to launch an idea.
* or yourself
Multiple iterations almost always beats
the single-minded commitment to building
your first idea
Slide from http://marshmallowchallenge.com/Instructions_files/TED2010_Tom_Wujec_Marshmallow_Challenge_Web_Version.pdf
Video from http://marshmallowchallenge.com/Welcome.html
Slide from http://marshmallowchallenge.com/Instructions_files/TED2010_Tom_Wujec_Marshmallow_Challenge_Web_Version.pdf
Video from http://marshmallowchallenge.com/Welcome.html
COURSE SCHEDULE
Generated with the online Gantt chart tool from smartsheet.com
! WARNING
HIGH
WORKLOAD
AHEAD
! WARNING “This class is certainly a fun, interesting course to take .. it
will keep you quite busy and you can easily fall behind if
you don't stay on top of your workload.” -CMSC434 Student
“Course was actually intensive in terms of workload, but
we learned more…” -CMSC434 Student
“Overall, the course was a lot of work (as you warned us
in the beginning of the semester), but I learned a lot.
One of the best CS courses I've taken at UMD.” -CMSC434 Student
! WARNING “This class is certainly a fun, interesting course to take .. it
will keep you quite busy and you can easily fall behind if
you don't stay on top of your workload.” -CMSC434 Student
“Course was actually intensive in terms of workload, but
we learned more…” -CMSC434 Student
“Overall, the course was a lot of work (as you warned us
in the beginning of the semester), but I learned a lot.
One of the best CS courses I've taken at UMD.” -CMSC434 Student
ACHIEVEMENT UNLOCKED CMSC434 Metacomment
Workload was appropriate.
- CMSC434 Student
Really appreciated the process of learning how to
brainstorm, sketch, plan, and build. Will be useful in
many future endeavors…
- CMSC434 Student
I would have prefer a programming unit in this class
to show us how we can use today's technologies to
connect to what he said in class.
- CMSC434 Student
ASSIGNMENTS & ASSESSMENT 70% of your grade is based on your performance on assignments
ASSIGNMENTS & ASSESSMENT 70% of your grade is based on your performance on assignments
THE LECTURES
“The professor tries very hard to make the classroom into
a friendly, interactive community where every student is
engaged in learning from the material, the professor, and
each other; and I think he has overwhelmingly
succeeded.”
-CMSC434 Student
ASSIGNMENTS & ASSESSMENT 70% of your grade is based on your performance on assignments
ASSIGNMENTS & ASSESSMENT 70% of your grade is based on your performance on assignments
ASSIGNMENTS & ASSESSMENT 70% of your grade is based on your performance on assignments
ASSIGNMENTS & ASSESSMENT 70% of your grade is based on your performance on assignments
Project Overview Goal: Apply and integrate user-centered concepts learned in this class along with your
other (current and prior) computer science education.
Secondary Goal: Work on real problems! Intense end-to-end design.
Focus: Mobile Applications With Sensor Integration
1. You pitch project ideas
2. We will sketch, prototype, test, and iterate.
3. You have to implement the final prototype in code.
Teams: Divided up based on skills and interest. If you have a significantly good
practical reason for working with someone, let me know.
You must be committed to working with your team throughout the semester.
Design
Build
Evaluate
Human-Centered Design
Iterative Design
TA04: SKETCHES, STORYBOARDS, & CRITIQUES
TA05: PAPER PROTOTYPING AND USER TESTING
TA06: MID-FI PROTOTYPES & CRITIQUES
TA07: FINAL INTERACTIVE PROTOTYPE
TA09: FINAL VIDEO
Source: Anand Agrawala, University of Calgary, http://youtu.be/_66uD0AKiJc
Icon from http://thenounproject.com/term/trophy/412/
The class will vote on the best interactive
prototype as well as best final video. The
winning team will get an award.
Group Project
FEEDBACK
Design Critiques
CMSC434 Design Critique
I think it'd be good to have a say in what group you'll be in, after indicating your initial topic preferences. I got stuck in a group that is pretty apathetic, and it's come through the most with our final project. I've coded 98% of it, and I can't do anything about it, because we set a mutually agreed schedule for adding code. There's only so many times I can keep asking for contribution when the group members don't care.
DESIGN CRITIQUES / PEER REVIEW
Really liked how we reviewed the class' works and that you
guys actually handed us these peer reviews back. Definitely a
good way to get good feedback.”
- CMSC434 Student
Group Project
FEEDBACK
Design Critiques
User Testing
Peer Assessment
I think it'd be good to have a say in what group you'll be in, after indicating your initial topic preferences. I got stuck in a group that is pretty apathetic, and it's come through the most with our final project. I've coded 98% of it, and I can't do anything about it, because we set a mutually agreed schedule for adding code. There's only so many times I can keep asking for contribution when the group members don't care.
ABOUT GROUP WORK
I think it'd be good to have a say in what group you'll be in,
after indicating your initial topic preferences. I got stuck in a
group that is pretty apathetic, and it's come through the most
with our final project. I've coded 98% of it, and I can't do
anything about it, because we set a mutually agreed schedule
for adding code. There's only so many times I can keep asking
for contribution when the group members don't care.
- CMSC434 Student
Slide from Björn Hartmann & Maneesh Agrawala
Note: These are private and will not be shared with your teammates
Group Project
FEEDBACK
Design Critiques
User Testing
Peer Assessment
Feedback from TA/Prof
Hall of Fame Hall of Shame
As you watch the following video, think about why designing such
an interactive system is hard and why the user struggles
Touchscreen Soda Fountain Submitted by: Jon Froehlich
Why is this a hard design problem?
Why did the user struggle?
Facebook Inline Translation Submitted by: Jon Froehlich
Hall of Fame Hall of Shame
Submit your video recording (screen capture or cell phone) along with a
paragraph (or two) description of why its Hall of Fame or Hall of Shame. Your
description must include principles learned from class.
Individual Assignment (IA)
Group Project Assignment (TA)
Reading Assignment (R)
Event/Holiday
Lecture (L)
Individual Assignment (IA)
Group Project Assignment (TA)
Reading Assignment (R)
Event/Holiday
Lecture (L)
THIS WEEK
Individual Assignment (IA)
Group Project Assignment (TA)
Reading Assignment (R)
Event/Holiday
Lecture (L) Individual Assignment (IA)
Group Project Assignment (TA)
Reading Assignment (R)
Event/Holiday
Lecture (L)
R01: BRAINSTORMING
This is due: Thursday by classtime. Fill out your response in Canvas. http://cmsc434-f14.wikispaces.com/R01+Brainstorming
Individual Assignment (IA)
Group Project Assignment (TA)
Reading Assignment (R)
Event/Holiday
Lecture (L) Individual Assignment (IA)
Group Project Assignment (TA)
Reading Assignment (R)
Event/Holiday
Lecture (L)
Individual Assignment (IA)
Group Project Assignment (TA)
Reading Assignment (R)
Event/Holiday
Lecture (L)
TODAY’S KEY LEARNING TAKEAWAYS
1. The value of iteration in design
2. Thinking through doing
3. Thinking through materials
4. The value of trying and failing early
5. Course mechanics/logistics
NEXT TIME About you
About me (and my research)
What is HCI?
Design and Design Processes
Dark Palette
Light Palette
Smartsheet Gantt Palette
Light Palette