IXD414, 'Design Systems', Spring 2025
MW / 3:20-05:50pm / Chalmers 307
Matt Kirkland / mattk@ku.edu

IXD414 - Designing with Systems

This is a studio course about designing digital products for the screen, with an emphasis on designing with systems in mind. This syllabus will be updated with more information throughout the semester. I'll let you know in class about updates.

Questions? mattk@ku.edu.

Calendar / Clock / Compass

A new tool for orienting ourselves in time or space


In this intro project, we're going to design a small but useful tool that helps the user orient themselves in time or space. We're making a new kind of calendar or clock or compass.

Your Client

For this project we won't concern ourselves with a specific imaginary client; your solution will need to be broadly understandable even if the use case is specific. It's OK to make this about you: what would you like to be more oriented towards (in space, or in time)? We'll be able to test with any person-on-the-street to validate basic interactions.

Deliverables

The calendar / clock / compass should be a digital product for screens; an app, website, signboard, kiosk, etc; thus your final deliverable will be an interactive figma prototype, embedded on your course site. See details below for our intermediate steps.

Inspo


Session 1: Introduction & Ideation

  • Project Brief: Designing a new type of calendar, clock, or compass
  • Discussion: How do we experience and orient within time? space?
  • Quick ideation exercise: Generate and share initial ideas as a class.
  • Homework: be ready to pitch us 10 conceptual ideas for a new calendar / clock / compass to share in the next class. Have a single-screen sketch for each.

Session 2: Problem Definition & Concept Critique

  • Pitch us your concepts
  • Class critique & workshopping: what makes sense? What questions do we have?
  • Prototypes: low-fi vs hi-fi. What's a prototype good for?
  • Homework: Low-fi prototype. Pick one approach, sketch out a full set of user actions. (eg: start up, configuration, use over time/space, etc.) These should be wireframes. Can be hand-drawn, figma, whatever works for you. Put them in figma and prototype.

Session 3: Prototypes, Testing, & Design System thoughts

  • Review prototypes
  • Talk about User Testing options
  • Let's talk about where a design system fits in here!
  • Take a first-pass revision at improving your prototype based on in-class feedback.

Session 4: User Testing & adding visual styling.

  • User testing!
  • Iterate!
  • Viz styling as time permits!!

Session 5: Test Reports & Adjustments.

  • What did we learn from user testing?
  • Where does it make sense to think about a design system here?

Session 6: Final Deliverables.

  • Show us your work, reflect on process.