6.S063 Design for the Web: Languages and User Interfaces

Course information

# General information - Lectures are Monday and Wednesday, at 2:30 - 4pm (3-333) - Lectures will be recorded, but a part of your grade is participation (see below) - Mandatory labs on Fridays, at 2:30 - 4pm (room TBD) - 12 units (3-2-7) - 6.009 (or equivalent experience programming) is a co-requisite - This subject can be used to satisfy the [CS12](https://eecsis.mit.edu/degree_requirements.html#CS12) and [EECS12](https://eecsis.mit.edu/degree_requirements.html#EECS12) electives - Fill in the [signup form](/go/signup), **otherwise you are not properly registered for the course**!! - *Enrollment may be limited* - **[*Here be dragons*](https://en.wikipedia.org/wiki/Here_be_dragons): This is the very second offering of this course. It will not go perfectly. While many issues were ironed out in the first iteration (in 2020, as 6.S082, with the same instructors), the course is still in active development and thus there may be mistakes in lecture, bugs in assignments etc. If you are not OK with this, maybe this course is not the right fit for you at this time.** # Course description This course will teach the principles and technologies for designing usable user interfaces for the Web. We will learn the key principles and methods of user interface design, including learnability, efficiency, safety, prototyping, and user testing. We will learn the core web languages of HTML, CSS, and Javascript, their different roles, and the rationales for the widely varying designs. We will use these languages to create usable web interfaces. We will also touch on the fundamentals of graphic design theory, as design and usability go hand in hand. # Grading - There will be **weekly assignments** that will account for 80% of your grade. - There is no exam, midterm, or longer project (though there are smaller projects that are built over several homework assignments). - 20% of your grade will be devoted to participation. *(We are still evaluating this and it is subject to change until the start of class)* - 3/4 of that (15%) will be devoted to lab/lab attendance and participation. - The rest (5%) will be devoted to general participation. Some lectures will include in-class activities that will count towards your participation grade, but you can also boost your participation through other means, such as asking & answering questions, or helping other students on [Piazza](https://piazza.com/mit/spring2022/6s063/). - Getting a perfect participation grade does not require perfect attendance/participation. - We will put participation requirements in abeyance during COVID spikes, and will make accommodations for student(s) isolating.

Schedule

Here is the tentative lecture schedule for 6.S063. **This schedule is subject to radical change.** Spring 2022 is only the second time this class is being offered, so we may need to make significant adjustments to the schedule depending on a variety of factors. This schedule will be updated throughout the semester, and generally speaking, the further from present the topic is, the more likely it is to change.
Mondays Wednesdays Fridays
Introduction & Overview Web Page Structure: HTML Pre-doing Lab Pre-lab
Learnability Graphic Design Pre-reading Lab
Efficiency Foundational Concepts of CSS Pre-doing Lab
Tuesday Safety More Foundational Concepts of CSS Pre-doing Lab
Heuristic Evaluation Layout Lab
Prototyping and User Testing Universal Web Design Lab
Introduction to modern JS Pre-reading Events Pre-reading Lab
No class (Spring break) No class (Spring break) No lab (Spring break)
Design Patterns Functional JS Pre-reading Lab
Asynchronous JS Typography Pre-reading Lab
Web APIs Color Lab
No class (Patriots' Day) Animation & Feedback Lab
Data Visualization Component-driven Development Lab
Web Standards (remote, optional) No class Lab
Course Reflection

Staff

Name Role Email Office Office Hours
David Karger Instructor karger 32G-592 By appointment
Lea Verou Instructor leaverou 32G-598 By appointment
Tarfah Alrashed TA tarfah Virtual Mondays 12-2pm (find the Zoom link for OH in Piazza)
Soya Park TA soya Virtual Mondays & Tuesdays 9-10am (find the Zoom link for OH in Piazza)
Elaine Xiao LA eyxiao 34-301 Mondays 7-8pm
Thanh Nguyen LA thanh_n 34-301 Tuesdays 7-8pm

Course logistics

# Lateness and extensions To give you some flexibility for periods of heavy workload, minor illness, absence from campus, job interviews, and other occasional (but often predictable) circumstances, you may use limited extensions on problem set deadlines, called slack hours. Each slack hour is a 1-hour extension on the deadline. You have a budget of **5 × 24 slack hours for the entire semester**, which you may apply to any combination of individual assignments. Using any part of a slack hour consumes the entire hour. E.g. uploading an assignment 62 minutes late uses up 2 slack hours. You can use **at most 36 slack hours (1.5 days) for a given assignment**. Assignments more than 36 hours late will not be accepted. Slacks are **not** to support random procrastination. Late submissions should only occur in exceptional circumstances (conference travel, illness, etc.). Slacks just avoid the hassle of submitting a justification. If you exhaust your slacks and seek further extensions, you will first need to provide acceptable justifications for **all** the slacks you used. All special circumstances extension requests must be documented by an authoritative note (e.g. doctor's note) or photographic evidence (e.g. selfie of you holding your smashed laptop). # Textbook and resources - Recommended textbook: *The Design of Everyday Things: Revised and Expanded Edition*, Don Norman - [MDN Web Docs](https://developer.mozilla.org/en-US/) - [CSS specifications](https://www.w3.org/Style/CSS/specs.en.html) - [HTML specification](https://html.spec.whatwg.org/multipage/) - [Javascript (ECMAScript) specification](https://www.ecma-international.org/ecma-262/10.0/index.html#Title) # Collaboration policy - Covered in detail [here](collaboration.html).