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

Exams#

There will be an open book final exam that will take place during the assigned exam time for the course: Wednesday, March 20th. The exam will largely focus on non-programming related materials covered throughout the quarter.

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, Slack. A participation rubric is available in the Assignments section on the Canvas course page and in the course Syllabus.

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 via Slack DM. A brief explanation will suffice. There is no need to provide evidence of your reason!

Quizzes#

In-class quizzes will occur at various points througout the lecture every Monday. Quiz length will vary anywhere from 1 to 5 questions. Quizzes will be graded, but will be based on materials covered in lecture for that class and therefore be ‘open book.’ Quizzes are intended to ensure that you are actively attending and engaged in the class. As long as you earn a cummulative score of 50% on your quizzes, you will receive full credit. If you miss a quiz and notified course staff of your absence, you can make it up by submitting a one page summary of the topics covered in lecture. If you need to write a summary, reach out to Prof. Mark on Slack for guidance on how to format your summary.

Schedule#

Note

The following schedule is subject to change throughout the quarter.

Quarter at a Glance#

Week 1

History of User Interfaces and Introduction

HTML

CSS

Javascript

Accessibility

Week 2

Responsive Design

DOM Manipulation

Week 3

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