User Interaction Software#

Course Overview#

Welcome to INF 133: User Interaction Software. Here you will find all learning materials for the course including: assignment descriptions, lecture recordings, lecture notes, references to external material, and quiz results.

This website is built with Jupyter Book because it provides a rich format for sharing, viewing, and consuming technical information. In the upper right side of this website you will find a link that allows you to download the entire book in Markdown or PDF format. Feel free to use this feature if you need an offline copy of course materials. I will be updating this website frequently as we work our way through the class. So be sure to check back at least once a week. However, when major updates do occur, an announcement will be sent to the class mailing list.

Course Description#

From the catalog:

Introduction to human-computer interaction programming. Emphasis on current tools, standards, methodologies for implementing effective interaction designs. Widget toolkits, Web interface programming, geo-spatial and map interfaces, mobile phone interfaces.

In practice, every instructor takes a slightly different bend to these topics. I focus on covering modern technologies for web and mobile development and how device capabilities can impact interface design and software architecture.

Learning Objectives#

At the end of this course, students should be able to:

  • Program web applications in HTML, CSS, and JavaScript which are sensitive to screen size and a person’s abilities

  • Leverage external data sources and APIs via asynchronous HTTP requests Develop hybrid mobile applications which take advantage of on-device utilities

  • Describe affordances of different screen modalities and input techniques

  • Choose an appropriate web or mobile development framework for a given task

  • Implement and articulate best practices for authentication, storage, and communication in web and mobile

Required Text and Materials#

Given the rapid changes in web and mobile development, any materials relying on a particular technology will quickly lose their value as a reference material. Articles online serve as a great resource, and all required materials will be made available. Check the resources section for some pointers, and feel free to send the course staff any resources you find useful as the course progresses.

Assignments#

Assignment details will be posted as the quarter progresses. When a new assignment overview page is posted a link to the page will appear in the navigation bar to the left.

Note

For a breakdown of grade percentages and due dates please see the Canvas course page.

Assignments:

  • A0: Ramping Up

  • A1: Responsive Portfolio in HTML and CSS

  • A2: Runkeeper Tweet Report in JavaScript and TypeScript

  • A3: Spotify Browser using a Web Framework

  • A4: Sleep Tracker for Mobile

  • Final Project

Exams#

Due to the inherent difficulty of proctoring an exam remotely, and our need to support some remote students, for this quarter we will not have midterm and final exams. Instead, you will complete one additional assignment (Final Project, required to pass the course) that will require you to bring together the learning objectives for the course.

Participation#

Participation grades will be based on your individual activity across the various activities and tools used in the course. To earn full participation credit, you must complete all of the Socrative quiz sessions (taken during lecture) and demonstrate engagement with the class in some capacity. Engagement can occur through discussion during in-person class time, regular attendance in class and at your assigned discussion section, and helpful activity in the class communication tool, Zulip. A participation rubric is available in the Assignments section on the Canvas course page.

Attendance#

There will be times where you are unable to attend class. You might be sick, travelling, or simply exhausted. Missing a few classes throughout the quarter is understandable. All we ask is that you inform us before class that you are unable to attend. To request an absence, simply send a message to the Attendance Bot in Zulip. A brief explanation will suffice. There is no need to provide evidence of your reason! NOTE: You will still need to make up the quiz (see next section)!

Quizzes#

In-class quizzes will occur at various points througout the lecture on Monday and Wednesday. Quiz length will vary anywhere from 1 to 10 questions. Quizzes are not graded, so as long as you participate in the quiz you will earn full credit. If you miss a quiz, you can make it up by submitting a one page summary (bullet points are fine) of the topics covered in lecture directly to the professor via Zulip.

Schedule#

Note

The following schedule is subject to change throughout the quarter.

Quarter at a Glance#

Week 0

Introduction

Week 1

HTML

Accessibility

CSS

Week 2

Responsive Design

Javascript

Week 3

DOM Manipulation

Package Management

TypeScript

Data Visualization Tools

Week 4

Network Communication

Security

Week 5

Web Frameworks

Week 6

Mobile Design

Hybrid Architectures

Week 7

Mobile Frameworks

Week 8

Mobile Resources & Sensors

Databases & Local Storage

Week 9

Alternative Input and User Interaction

Week 10

Future of User Interfaces

Wrap up