UI is the saddle, the stirrups, and the reins. UX is the feeling you get being able to ride the horse.
— Dain Miller (Web Developer)

Instructor:             Lorie Loeb
Office:                   Sudikoff 163
Email:                    lorie.loeb@dartmouth.edu
Office Phone:       603.686.8726
Office Hours:        Thursdays 12:30-2:30pm
X-hours:                All x-hours are mandatory

This two-term course is funded by the DCAL Experiential Learning Seed Grant because of the innovative approach to mixing classroom and applied learning.

Classroom: Carson 61

Course Description

Every digital interface/interaction (e.g. web and mobile application, car dashboard, smart appliance) was designed to solve a problem or to make our lives better, easier, more successful. User Interface (UI) design refers to the way the interface looks (the actual layout of its elements). User Experience (UX) design tackles how it feels to use the product (what do we do? how do we feel?). This course teaches the principles and practice of UI/UX design through weekly exercises and homework (team and individual), student blogs and toolkits, class discussions, a field trip to a design firm and museum, presentations, and projects.

This is a two-term course sequence. CS25.01 and CS25.02 are hands-on, projects-based courses that teach the history, principles, tools, and practice of User Interface (UI) and User Experience (UX) Design. The first term (CS25.01) is open to First Year and Sophomore students with an interest in human centered design, product design, UI/UX design, interaction design, graphic design, or any other related field. No previous experience needed. We focus on design for digital screens, but will also explore design for installations and physical spaces.

CS25.01 will be structured as other projects-based courses, with weekly assignments that build on each other and are intended to teach the foundational skills and thinking of UI/UX design. Students who successfully complete the first term are expected to take CS25.02 (offered in the following Summer, Fall, or Winter terms) as a designer in the DALI Lab, where students will design a digital tool as part of a team of designers, developers, and a project manager. Both terms count toward the HCD or Digital Arts minors.

 

How to Succeed in this Course

Evaluation of student success will be based on assignments that include observation, brainstorming, sketching and prototyping, computer-generated low and hi res mock-ups, user testing, and analysis. There are a mix of short--skill-building--assignments and a long-term project designed to put learning into practice. In addition, students are expected to participate in discussions and reflections, generate regular entries to their blogs, build a personal website and portfolio, and do a final presentation of their work. Students will work alone and in teams.

 

Learning Objectives

  • Understand the definition and principles of UI/UX Design in order to design with intention.

  • Achieve a deep understanding of the entire life-cycle of design—the process, purpose, and tools.

  • Learn the basics of HCI (human-computer interaction) and the psychology behind user decision-making.

  • Discover the industry-standard tools and specific project deliverables in UI/UX.

  • Increase impact by being able to explain why you made the choices you made, and learning how to be an effective and persuasive communicator.

  • Improve presentation skills, including presentations of homework, portfolio building, process pages, and a poster at the end of the term, help you demonstrate skills, aesthetic viewpoint, UI/UX process.

 

Grading

  • Weekly Homework - 25%

  • Weekly Exercises - 20%

  • Weekly Reflections and Toolkit - 20%

  • Class Attendance, Teamwork, and Participation - 15%

  • Final Project and Presentation - 20%

    More than one unexcused absence will result in a lowering of your grade.

Exercises and Homework Grading

Exercises are generally assigned on Tuesdays and due on Thursdays. Grading is out of 4 points as follows:

  • 1 point for turning it in on time

  • 1 point for completion of all elements of the exercise

  • 2 points for effort and craft

Homework is generally assigned on Thursdays and due on the following Tuesday. Homework is graded on a 10 point scale, based on two factors:

  • 6 points for completion of the assignment

    • Incomplete homework (turned in on time) results in a loss of 2 points

    • Late homework results in a loss of 4 points

  • 4 points for effort and craft

  • Bonus Points: 1-2 points awarded for particularly creative thinking, strong demonstration of craft, extra effort

Homework and exercises are due one hour before class on the day it is due.

Notebook is due every Tuesday. Students are expected to have two reflections/observation in their notebook per week plus one response to assigned reading. Reflections/Observations are a way to keep your eye open for design principles in practice and allows you to use the vocabulary you are developing.

  • 2 points for each reflection

  • 1 point for response to reading

Toolkit is a place to collect and curate tools you use and like along with links to resources you’ve read and benefitted from. The toolkit is due at the end of the term and there will be a mid-term check in to help you know you are on track.

  • 2 points for the resources

  • 1 points for the tools

The Final Project is where it all comes together. Teams of four are given a design brief and then follows the UX and UI process to design a digital solution. Work is shown in two ways: (1) at a poster session during Technigala, and (2) a design case study report.

  • 10 points for the quality of work

  • 10 points for the quality of the poster and presentation at the poster session

  • 10 points for the quality of the case study report (late reports will not be accepted)

Dartmouth Policies

Student Accessibility and Accommodations

Students with disabilities who may need disability-related academic adjustments and services for this course are encouraged to see me privately as early in the term as possible. Students requiring disability-related academic adjustments and services must consult the Student Accessibility Services office in Carson Hall 125 or by phone: 646-9900 or email: Student.Accessibility.Services@Dartmouth.edu.

Once SAS has authorized services, students must show the originally signed SAS Services and Consent Form and/or a letter on SAS letterhead to me. As a first step, if you have questions about whether you qualify to receive academic adjustments and services, you should contact the SAS office. All inquiries and discussions will remain confidential.

Religious Observances

Some students may wish to take part in religious observances that occur during this academic term. If you have a religious observance that conflicts with your participation in the course, please meet with me before the end of the second week of the term to discuss appropriate accommodations.

Honor Principle

The faculty, administration, and students of Dartmouth College recognize the Academic Honor Principle as fundamental to the education process. Any instance of academic dishonesty is considered a violation of the Academic Honor Principle.  Please see the full set of policies in the Student Affairs Guidelines.



Course Schedule

Unless otherwise noted:

  • Exercises are due on Thursdays, one hour before class.

  • Homework, Reflections, and Reading are due on Tuesdays, one hour before class.

Week 1: UI/UX Overview

  • 3/26: Intro to UI/UX

    • EX: Finding bad UI/UX design

  • 3/28: Design Thinking | Project 1 “Introduction”

    • HW: Team Design Sprint (Empathize > Define > Sketch)

    • Reading: Empathy Fieldguide

  • X-hour 4/1: Design Toolkit and UI/UX Notebook

Week 2: User Research

  • 4/2: How to identify stakeholders | Project 2 “Stakeholders”

    • EX: Defining stakeholders

  • 4/4: How to identify user needs

    • HW: Needfinding

    • Reading: Interdisciplinary Interaction Design

  • X-hour 4/8: Creating UX Flows

Week 3: User Journeys

  • 4/9: Mapping the user journey | Project 3 “The UX Project”

    • EX: Making a user journey

  • 4/11: Finding solutions & constraint cards

    • HW: Sketching solutions

    • Reading: Don’t Make Me Think

  • X-hour 4/15: intro to Figma

Week 4: UX Principles

  • 4/16: Present Sketches, UX Principles

    • EX: Converting Sketches to Grayscales

  • 4/18: Psychology of UX

    • HW: Figma grayscales

    • Reading: Design of Everyday Things

  • X-hour 4/22: refining grayscales in Figma

Week 5: User Testing

  • 4/23: Understanding user testing

    • EX: Prepare grayscales for user testing

  • 4/25: Design for Inclusion

    • HW: User Testing

    • Reading: UI Design for the Human Eye

  • X-hour 4/29: Figma UI

Week 6: UI Principles

  • 4/30: UI Principles: layout and alignment | Project 4 “The UI Project”

    • EX: Finding good UI

  • 5/2: UI Principles: color and text

    • HW: UI Design

    • Reading: Visual Design Specification

  • X-hour 5/6: Dynamic: prototyping interactions

Week 7: Topics in UI

  • 5/7: UI Components: buttons, icons, controls

    • EX: Style Guide Analysis

  • 5/9: Responsive Design

    • HW: UI Component Library

    • Reading: Design Trends

  • X-hour 5/13: Presentation Activity

Week 8: Field trip & Final Project

  • 5/14: Field trip to Boston - visit design firm

    • (field trip, no assignment)

  • 5/16: Present UI Designs | Final Project

    • Reading: Visual Display of Quantitative Information

  • X-hour 5/20: Portfolio Workshop

Week 9: Special Topics & Final Project

  • 5/21: Information Visualization

    • Continue final project: UX

  • 5/23: Delight and Impact Design

    • Continue final project: UI

Week 10: Check-ins & Presentations

  • X-hour 5/27: Final project check-ins

  • 5/28: Final project check-ins

    • Design Toolkit Due

  • 5/29: Final Presentations at Technigala