Instructor: Amy J. Ko, Ph.D.
Teaching Assistant: Greg Nelson (Ph.D. Student, CSE)
Office hours: Tuesdays 2:50-3:20, Alumni House
Whether you're a software designer, engineer, or user experience researcher, understanding what user interfaces are, how they're built, and what kinds of interfaces can exist is a critical literacy for collaboration and creativity. After all, user interfaces are a medium, like any other: painters need to understand paint, writers need to understand words, and anyone involved in designing, building, or understanding interactions with software needs to understand user interfaces.
By end of the course you will:
- Be able to describe major user interface concepts and paradigms
- Use a theory of user interfaces to describe, analyze, and critique user interface technology
- Describe major classes of inventions in user interface software and technology
- Identify open questions in user interface software and technology
- Conduct detailed assessments of product opportunities for user interface innovations
Norms
Here is how I expect you to behave in this class:
-
Respect each other's humanity. We all have lives, struggles, fears, and goals. You're more than a student, I'm more than a professor, your TAs are more than TAs, and your classmates more more than classmates. Start every conversation remembering that.
-
Respect each other's differences. Technology is for people and people are different: learn about each other's different perspectives, experiences, and ideas.
-
Focus on learning, not grades. Having knowledge and skills is what gets you into majors, internships, jobs, and graduate school. Grades are imprecise, narrow measures of what you know and can do, so if you optimize for them instead of skills, you'll end up with narrow knowledge and skills.
-
Be demanding. I want this course to be great. If you don't like how it's going, give me feedback. The only way I can make it better is if you tell me what's wrong.
-
Be skeptical. If you don't believe something I say, demand evidence or a better argument. If you hear about some exciting new technology, probe closely to understand it's true merits.
-
Be constructive. Don't just critique ideas; use your knowledge of their limitations to make them better. This is especially important when you collaborate with other people.
-
Don't deceive. Tell the truth, even it's hard to share. You didn't do your homework? Admit it, and let's find a way for you get future assignments done on time. You don't understand something? Admit it, and let's help you understand it. You don't want to learn something? Admit, and let's find a way to make it more interesting to you.
These class norms also have some important implications.
-
If you cannot easily access material because of a disability, let me know, because that is my failure to respect the broad diversity of abilities that people have, whether you're different in physical, mental, or learning ways.
-
If you have a concern about a teammate or classmate not following the norms above, raise it with me.
-
Do not plagiarize, as that puts grades before learning and deceives. If you commit any of the following forms of plagiarism in this class, I will use my discretion to either give you no credit for an assignment or in some cases, for the entire class.
- Copying content you did not author and presenting it as your own.
- Copying content and tweaking it to seem like your own, even though it is the same ideas.
- Reusing content you wrote previously, but presenting it as original.
- Citing sources as evidence, even when those sources do not present such evidence.
- Copying someone's answer on a test rather than arriving at the answer yourself.
- Violating copyright law by reusing content without complying with the license on that content.
Workload
Your weeks look like this:
-
Monday: Do Tuesday reading
-
Tuesday: Come to class ready for discussion and activity
-
Wednesday: Do your Thursday reading, finalize homework
-
Thursday: Come to class ready for discussion and activity
-
Thursday-Sunday: Reading and homework
Stay on top of reading so you have time to focus on homework.
Office Hours
I'm available to talk about jobs, careers, graduate school, research, class, and anything else. My office hours will be after class on Tuesdays until 3:20pm. You can always schedule an appointment with me for other times.
Reading
There are two types of reading you should read before each class: required and selected.
Required readings come from the textbook. There aren't many textbooks on the subject of User Interface Software and Technology, so I wrote one for this class called User Interface Software and Technology. It's meant to be concise, accessible, and living, incorporating the latest research. As I teach the course, I'll work on revising the course to improve each chapter before you read it.
Come to class ready to demonstrate your knowledge of everything in the chapter (including any video under 10 minutes) by answering a reading quiz question. Each reading quiz will be free response and submitted on Canvas. If you miss class, you can makeup the missed quiz credit by submitting a response to the quiz with a critique of the chapter containing at least three ideas for improvements. Critiques are due no later than one week after the quiz was due. There's no limit on the number of critiques you write; if you don't ever want to submit a reading quiz response, you can just choose to submit critiques for the chapter.
Selected readings are your choice. You can choose any of the articles cited in the "Further reading" section of a chapter based on your interests, or any other academic article or book you find on the topic of the chapter. Read the article (or if it's a book, a chapter of the book), and distill the key insights of the paper into three sentences:
- Sentence 1: Accurately and succinctly describe the big idea in the paper
- Sentence 2: Explain how the big idea changed your thinking about interfaces
- Sentence 3: Speculate on what impact you believe the big idea might have on society.
Each submission should include the cited paper and then three sentences like this:
This paper described a new pointing device called a "mouse" that maps the movement of a physical device on a flat surface onto the movement of a virtual on-screen cursor. The idea made me realize that input devices can greatly determine what types of interfaces are possible; for example, the idea of pointing has shaped nearly everything in graphical user interfaces. I predict the mouse will lead to many people sitting in front of flat surfaces staring at screens pointing at virtual things.
For selected readings, we will be evaluating the pithiness of your writing ("pith" is the essence of something; pithy writing means the summary concisely and forcefully distills the key idea of a paper into a small number of words. The example above is pithy enough for full credit. We will grade the readings on this scale:
-
2.0 points. The summary concisely communicates the core idea of the paper.
-
1.5 points. The summary communicates the core idea of the paper, but could have been much more concise.
-
1.0 points. The summary does communicate a key idea from the paper, but not the core one.
-
0.5 points. The summary is incomprehensible.
If you plagiarize from the paper, your summary doesn't follow the three sentence structure, you do not submit a summary, or your summary of the idea is severely incorrect, you will receive 0 points.
To discuss readings in class, the first 30 minutes of each class is organized as follows:
- Required reading (from User Interface Software and Technology)
- I ask the class if there are any clarifications they'd like about the chapter.
- I provide clarifications.
- After there are no more questions, I present the reading quiz question.
- After the reading quiz, I discuss the correct answer and resolve any questions.
- Selected reading
- You organize into groups of 3-4, with the goals of 1) describing what you read to each other, and 2) identifying insights, opinions, or questions that you'd like to share with the class
- After 5 minutes, I bring the class back together
- I ask for insights, opinions, or questions, and facilitate a discussion about the topic.
Homeworks
Whereas the readings in the course will give you a strong conceptual foundation for user interfaces, the homeworks will help you practice two key skills in interaction design, user experience research, and front-end engineering: analyzing and communicating design opportunities. You'll do this over the course of several homeworks:
By the end of the course, you'll have deeply analyzed a user interface innovation for product viability.
We will grade homeworks no later than 7 days after they are submitted (sometimes sooner).
To access readings off campus, you can use the UW Libraries Proxy.
Grading
I'm a strong believer that one of the only benefits of quantitative grades is to motivate unmotivated students to learn. Otherwise, I view grades as mostly harmful to learning: they cause students to obsess over optimizing a narrow measurement of their knowledge, rather than all of the knowledge that might matter. Because this is a graduate course, and you're here to learn, I want you to therefore think of the points in this class as just an accounting of the learning you've done and a record of what you have left to learn. I don't expect most of you to receive a 4.0; that would imply that throughout the quarter, you had nothing left to learn. But there's no need to worry: no employer cares about your grade in this class, they care about what you know and what you can do.
To keep the grading scheme from distracting you too much, the grading in this class is simple. There are 100 points you can earn, each reflecting your ability to read and synthesize technical ideas about interface implementation and design:
-
Readings. These ensure you read and test your ability to explain the ideas in the reading.
- Required reading quizzes (16 quizzes, 1 point each, 16 points). Extra readings are extra credit.
- Selected reading summary (16 summaries, 2 points each, 32 points). Extra summaries are extra credit.
-
Homework (52 points): due each Thursday before class. These evaluate a range of skills in understanding and synthesizing interface ideas.
I'll map your 100 points according to the grading scale in Canvas.
Late work receives 0 points unless you arrange with me in advance or you had some circumstances clearly outside your control. However, our goal is for you to learn the material and skills, so if you're not happy with a reading or homework grade, you can read our feedback and resubmit it for a regrade at any time. We'll give you up to 50% of the credit you lost on your first submission. Or, if you received a 0 for a late submission, we will grade and give you up to 50% of the original points.
Schedule
Below is a rough outline of what will happen in each of our class meetings. Everything here is tentative aside from reading assignments; I may revise our discussion topics and activities as late us just before class.
Week 1
|
Tuesday, Jan 7 – WELCOME
|
-
Welcome (60 min)
- Who am I?
- How I will teach you?
- Why is this class required?
- Learning outcomes and grading
- About you
|
Thursday, Jan 9 – HISTORY
|
- Required reading (10 min): The history of user interfaces
- Selected reading group discussion (15 min)
- Based on your reading, how much of modern computer interfaces has its origins in the earliest ideas in computing? Can you think of modern interfaces that weren't conceived in the mid-20th century?
- Class discussion (10 min)
- How do prior generations of interface ideas shape new ideas?
- How does science fiction and interface ideas interact?
- Activity (45 min): Analyze the implications of alternative visions
-
5 min: Pair up
-
5 min: Read Bush's vision of the Memex's linked documents and searching
-
20 min: Create an alternative vision based on something other than documents, links, and searching. Try to imagine fundamentally different ways of interacting with data, algorithms, etc. (Your vision should start from today, not the 1940's).
-
10 min: Share your vision with as many pairs as you can in 10 minutes
-
10 min: What's the most compelling vision you heard? We'll discuss how would our interactions with computing be different if it had been the foundation of computing.
-
Homework 1 overview (5 min)
|
Week 2
|
Tuesday, Jan 14 – THEORY
|
- Required reading (10 min): A theory of user interfaces
- Selected reading group discussion (15 min)
- Based on your reading, do you think theories are helpful to design? Why or why not?
- Discussion (10 min)
- How are theories about people and their goals embedded in designs?
- How do our personal theories about human behavior shape our beliefs about good design?
- Activity (45 min): Use interface theory to reason about user interfaces
-
5 min: Form an ad hoc group of two (5 min)
-
20 min: Deconstruct a single function of a user interface you use regularly
- Reverse engineer a description of the interface's affordances
- Identify the gulfs of execution for each affordance and what signifies them
- Identify the gulfs of evaluation for each affordance and the feedback the interfaces uses to bridge them.
-
10 min: Present the most surprising gulf you found
|
Thursday, Jan 16 – MEDIATION
|
-
Homework 1 due
- Required reading (10 min): How user interfaces mediate
- Selected reading group discussion (15 min)
- Based on your reading, which of the three types of mediated things do you believe are the most difficult to design for?
- Class discussion (10 min)
- What's hard about designing for automation?
- What's hard about designing for information?
- What's hard about designing for communication?
- Activity (45 min): Reverse engineer how an interface is mediating something
-
5 min: Form ad hoc group of two (5 min)
-
5 min: Choose an interface you both use regularly that mediates some form of automation, information, or communication
-
10 min: Analyze how the interface mediates. What affordances does it provide? What affordances does it not provide? How does this influence what kinds of automation, searching/browsing, and communication are possible? Pick the insight you believe is most compelling from your analysis.
-
20 min: Share your most compelling insight.
-
Homework 2 overview (10 min)
|
Week 3
|
Tuesday, Jan 21 – DECLARATIVE INTERFACES
|
- Required reading (10 min): Declarative interfaces
- Selected reading group discussion (15 min)
- Based on your reading, do you think researchers have adequately bridged the massive gulfs of execution and evaluation in declarative interfaces?
- Class discussion (10 min)
- Programming requires anticipating many possible futures
- Programming requires specifying how to respond to these futures
- Specifying these responses requires abstraction
- Activity (40 min): Analyze a programming interface's gulfs
-
Rationale: Programming interfaces have tradeoffs; articulating them is key to deciding whether to allow something to be programmable.
- Form ad hoc groups of two.
- Create an animation in the Scratch programming environment. It doesn't matter what the animation is; focus on something you think would be fun!
- What gulfs of execution do you see?
- What gulfs of evaluation do you see?
- Present the gulfs you discovered.
|
Thursday, Jan 23 – INTERACTIVE INTERFACES
|
-
Homework 2 due
- Required reading (10 min): Interactive interfaces
- Selected reading group discussion (15 min)
- Based on your reading, is there anything interesting left to invent about WIMP interfaces? Or is everything left small refinements of old ideas?
- Class discussion (10 min)
- Interfaces for new types of data
- Interfaces for new types of commands
- Activity (45 min): Analyze a game interface's gulfs
-
Rationale: While most interactive interfaces leverage design conventions from the original Xerox Star, video games are decidedly unconventional in their interaction designs.
- Form ad hoc groups of two.
- Find a game (web, mobile, desktop, etc.)
- Learn to play it, finding non-WIMP user interface elements.
- For each non-WIMP interface element:
-
- What gulfs of execution do you see?
- What gulfs of evaluation do you see?
- To what extent is interface at the heart of the game’s challenge or fun?
- Present the gulfs you discovered.
-
Homework 3 overview (10 min)
|
Week 4
|
Tuesday, Jan 28 – ARCHITECTURE
|
- Required reading (10 min): User interface software architecture
- Selected reading group discussion (15 min)
- Based on your reading, how do you think the ideas in toolkits shape the experiences that people have with interfaces?
- Class discussion (10 min)
- Are there other ways to organize interfaces other than MVC?
- Are there other ways to organize input other than events?
- Activity (45 min): Identify how MVC is realized in code
-
Rationale: Identifying the links between specific parts of a program and its MVC elements will help make MVC more concrete.
- Form groups of two. Find someone who either has much more or much less web development experience than you. The person with the most expertise will be the teacher, the other the learner.
- Visit this MVC CodePen example.
- The teacher should explain how each line of HTML, CSS, and JavaScript in the works and what role it plays in implementing the model-view-controller architecture.
- We'll discuss each line of code as a class.
|
Thursday, Jan 30 – ACCESSIBILITY
|
-
Homework 3 due
- Required reading (10 min): Accessibility
- Selected reading group discussion (10 min)
- Based on your reading, how universal do you think interfaces can be?
- Class discussion (10 min)
- Is there a market incentive to make interfaces accessible?
- Is it possible to make interfaces accessible after they've been designed?
- Activity (20 min): Identify accessibility defects in a user interface
-
Rationale: Accessibility defects are invisible unless you know how to see them
- Form groups of two.
- Activate your operating system's screen reader (OS X, Windows, iOS, and Android)
- Select an iOS, Android, OS X, or Windows application to test for accessibility defects.
- Find at least 5 major defects, where a defect is a complete inability to provide input or interpret output for any disability.
- As a class, each group will share the most severe defect they detected.
-
Homework 4 overview (10 min)
|
Week 5
|
Tuesday, Feb 4 – POINTING
|
- Required reading (10 min): Pointing
- Selected reading discussion (15 min)
- Based on your reading, is pointing all about speed and errors, or are there other aspects of pointing you think researchers should be evaluating?
- Class discussion (10 min)
- What are all of the interface activities to which pointing applies?
- What are the limitations of pointing as a form of interaction?
- Activity (35 min)
-
Objective: Use Fitts' law to design
- Fitts' law has two big implications for design: reduce the distance to travel and increase the size of the target.
- Imagine you are going to design a wall-sized display that needs to support selecting and operating on virtual objects (e.g., a virtual desktop in a wall).
- In groups, generate several ideas for how to accelerate accurate pointing while reducing fatigue. Use body-storming to test low-fidelity prototypes.
- Select one to present at the end of class.
|
Thursday, Feb 6 – TEXT ENTRY
|
-
Homework 4 due
- Required reading (10 min): Text entry
- Selected reading discussion (15 min)
- Based on your reading, is text entry all about speed and errors, or are there other aspects of text entry you think researchers should be evaluating?
- Class discussion (10 min)
- What are all of the interface activities to which text entry applies?
- What role does natural language play in shaping text entry interfaces?
- Activity (25 min)
-
Objective: Push the limits of speech-based text entry
- More people are entering text via speech recognition than ever, especially in contexts requiring hands-free interaction such as driving.
- Support for error correction in such interfaces is quite poor. (Try it on a device).
- In groups of 2-3, envision a speech-based interface for quickly and accurate correcting text entry errors while driving. Assume the goal is character level accuracy.
- Prepare to user test your interaction in front of the class.
-
Homework 5 overview (10 min)
|
Week 6
|
Tuesday, Feb 11 – HANDS
|
- Required reading (10 min): Hands
- Selected reading discussion (15 min)
- Based on your reading, what limitations do you think recognition error places on the future viability of hand-based input?
- Class discussion (10 min)
- Will gesture or pen-based input ever be a ubiquitous form of input, or always niche for specific applications?
- What are other ways of using our hands for input that might be more ubiquitous?
- Activity (45 min)
-
Objective: Understand the limitations of state of the art gestures.
-
Rationale: Gestures are increasingly ubiquitous ways of expressing commands.
- Find a partner.
- Visit the $1 recognizer demo page and try to demonstrate every gesture in the demo. Do you notice patterns in which gestures are harder to perform?
- Define your own custom gesture in the demo, then have at least two others try to perform it. What kinds of mistakes do they make?
- Review the iOS gesture set, watching each video. Which gestures are harder to perform than others and why?
- Devise a new iOS gesture that you believe would be generally useful.
- Review Apple's documentation on the iOS gesture recognition state machine. Draw the state machine for your custom iOS gesture.
|
Thursday, Feb 13 – BODIES
|
-
Homework 5 due
- Required reading (10 min): Bodies
- Selected reading discussion (15 min)
- Based on your reading, what kinds of applications of body-based input do you find most compelling?
- Class discussion (10 min)
- What social and physical contexts do you find most suitable for body-based input?
- How does recognition error limit the applicability of body-based input?
- Activity (30 min)
-
Objective: Understand the challenges of body-based input.
-
Rationale: Ubiquitous computing contexts will increasingly recognize skeletons and gestures.
- Find a partner.
- Imagine a room instrumented with so many cameras that it can perfectly model the skeletal posture of every person.
- Devise an interaction that uses body-based gestures to operate some part of the room.
- Prototype the interaction with bodystorming, where one of you acts as the user, the other as the recognition system and interface.
- When your “prototype” is ready, find another pair to test with. Teach them the interaction and identify successful and failing aspects of the interaction.
- As a class, we’ll discuss the strengths and weaknesses you discovered.
-
Homework 6 overview (25 min)
|
Week 7
|
Tuesday, Feb 18 – 2D OUTPUT
|
- Required reading (10 min): 2D visual output
- Selected reading discussion (15 min)
- Based on your reading, how do you think innovations in displays, graphics, and animation will shape future interface experiences?
- Class discussion (10 min)
- Do you think bringing displays closer to our bodies is a good idea?
- Do you think integrating displays in our built environment is a good idea?
- Activity (45 min)
-
Objective: Homework 6 ideation
- If you're working together, find your partner; if you're working alone, find someone who's working with a similar technology.
- Your goal for the day is to generate concepts for your homework 6, or if you already have one, use the time to get feedback on your concept.
- Seek guidance from me and your TA
|
Thursday, Feb 20 – 3D OUTPUT
|
- Required reading (10 min): 3D visual output
- Selected reading discussion (15 min)
- Based on your reading, is VR ready for the consumer market? If so, why isn't it taken off? If not, what's missing?
- Class discussion (10 min)
- What is your best guess at what the killer apps for VR and AR will be?
- Does anyone believe that VR and AR shouldn't exist?
- Activity (45 min)
-
Objective: Homework 6: feedback on your outline
- Find at least three people to give feedback on your outline
- While they read your outline, you read theirs
- Read them from the perspective of an engineer: is there enough detail to know what to build, or are parts of the design ambiguous?
- Ask the instructor and TA for targeted feedback on specific details
|
Week 8
|
Tuesday, Feb 25 – PHYSICAL OUTPUT
|
- Required reading (10 min): Physical output
- Selected reading discussion (15 min)
- Do you want to use any of these physical interactions? Why or why not?
- Class discussion (10 min)
- Do you want to live in a tangible bits world?
- What are the killer apps for physical output?
- Activity (45 min)
-
Objective: Homework 6: feedback on your draft
- Like the previous class, find three people for feedback about ambiguities and your document's organization.
- Depending on how much you wrote and what you're uncertain about, have them focus on a section or cover the entire draft.
- Ask the instructor and TA for targeted feedback on specific details
|
Thursday, Feb 27 – HELP
|
- Required reading (10 min): Help
-
Selected reading discussion (15 min)
- Based on your reading, what types of help systems do you think are most helpful and why?
- Class discussion (10 min)
- What is the most effective way to minimize the burden on learning in design: closely supporting tasks, simplicity, or high quality help systems?
- What kinds of help systems will new media require?
- Activity (45 min)
-
Objective: Homework 6: commit to a concept
- Determine what mockups you'll need to clearly convey the concept
- Determine what technical details you'll need to define
- Use these details to outline your draft
- Consult your TA for guidance on both
|
Week 9
|
Tuesday, Mar 3 – INTELLECTUAL PROPERTY
|
- Required reading (10 min): Intellectual property
- Selected reading discussion (15 min)
- Based on the reading, do you think that U.S. intellectual property law has a net positive effect on on product innovation?
- Class discussion (10 min)
- How do you think copyright law should work for interfaces?
- How do you think patent law should work for interfaces?
- Activity (45 min)
-
Objective: homework 6: refine
- Quietly write and design
- If you're uncertain whether something is clear, ask a peer for feedback
- If you're uncertain how to approach an explanation, ask the instructor or TA for feedback.
|
Thursday, Mar 5 – TECHNOLOGY TRANSFER
|
- Optional Homework 6 pre-submission due
- Required reading (10 min): Technology transfer
- Selected reading discussion (15 min)
- Based on the reading, does a startup sound exciting, exhausting, or both relative to a smaller role in an established business?
- Panel: what questions do you have about the experience of technology transfer? (15 min)
- Class discussion (10 min)
- How would business have to change to accelerate innovation?
- How would government have to change to accelerate innovation?
- How would academia have to change to accelerate innovation?
- Activity (30 min)
-
Objective: homework 6: polish
- Seek critique from your peers on the coherence and clarity of your writing.
- While they read your draft, read theirs.
- Read closely and critically, from the perspective of someone being asked to make your design a reality.
|
Week 10
|
Tuesday, Mar 10 – ETHICS
|
- Join via Zoom: https://washington.zoom.us/my/amyjko. Ensure you have a good headset to isolate background noise, and come prepared to do our last quiz, small group discussions, and class discussions.
- Required reading (10 min): Ethics
- Selected reading discussion (15 min)
- Are designers really responsible for these choices, or someone else?
- Class discussion (40 min)
- What ethical choices have you been faced with in business?
- How do you balance ethical choices against business priorities?
- Course evaluation (10 min)
|
Thursday, Mar 12 – CANCELLED
|
- Amy and Greg are in Portland, Oregon at SIGCSE 2020
- Finalize those design specifications! Make us proud.
|
Finals week
|
No final exam. Homework 6 is due Monday at 5 pm, then you're done!
|