| Section | 1 |
|---|---|
| Instructor(s) | — |
| Location | None |
| Meeting Times | Wednesday 5:30pm - 7:30pm |
| Fulfills | Elective Specialization - Application Development (APP-2) |
This course teaches advanced UI/UX design through building. You'll develop visual design systems, implement polished interfaces in code, and experiment with generative UI—interfaces created dynamically at runtime. Tools include Claude Code and Figma for design implementation; Midjourney for rapid visual exploration. Beyond technical skills, we discuss creativity, imagination, and the habits that sustain them.
This class welcomes students from any background who are interested in design—no prior design experience required. However, the topics covered are not introductory.
By the end of this course, you will be able to:
Discussion
Each class includes discussion on design thinking, creativity, and the evolving role of tools in creative work. We critique real interfaces, debate tradeoffs, and build shared vocabulary for talking about design.
Workshop
Hands-on sessions introducing techniques for the current project—visual design principles, prototyping in code, working with generative tools.
Build & Critique
Time to work on projects with direct support, followed by brief demos and peer feedback. What's working? What isn't? What surprised you?
Design Foundations
- Visual design systems
- Responsive & adaptive design
- Accessibility
Building
- Implementing UI in code
- Component libraries & Tailwind
- Rapid iteration with Claude Code
Generative
- Visual exploration with generative AI tools
- Generative UI & dynamic interfaces
Practice
- Design critique & feedback
- Creativity, imagination, and creative habits
Weeks 1 - 2: Visual Design
Develop a sense for visual design by studying and curating a diversity of styles. Use generative AI alongside traditional research to explore visual directions. Create mood boards that capture distinct aesthetics—one pioneered (your own synthesis), one existing—then apply those styles to static posts and mobile app screens.
Weeks 3 - 4: Web Design
Build and deploy a live, responsive website using Claude Code. Use generative AI for branding and assets, Figma for exploration if needed. AI can produce polish quickly—the real skill is making intentional decisions along the way. Learn to navigate constraints across screen sizes. When someone asks "Can you make me a website?" the answer will be yes after this project.
Weeks 5 - 6: Generative UI
Explore interfaces that aren't just built with AI—they're generated by AI at runtime. Design applications where the UI adapts dynamically based on user input, data, or context. Learn when this approach makes sense, how to design useful constraints, and how to maintain usability when the interface isn't fully predetermined.
Weeks 7 - 10: Project
Build something of your own. This can extend earlier work, tackle a new problem, or explore an idea you've been sitting on. Use the skills you've developed—visual design, rapid prototyping, generative UI—in whatever combination needed. Make something you’re proud of.
Must have completed MPCS 51036, 51040, 51042, 51046, 51100, CAPP 30122, MACS 30122, or have a Core Waiver for Programming. MPCS 51230 User Interface and User Experience is highly recommended.
This class welcomes students from any background who are interested in design. Prior design experience is recommended (e.g. MPCS 51230 UI UX Design), but not required. Please note that the topics covered are not introductory.
This course requires competency in Unix and Linux. If you attended the MPCS Unix Bootcamp you covered the required material. If you did not, please review the UChicago CS Student Resource Guide here: https://uchicago-cs.github.io/student-resource-guide/.
Course request information for non-MPCS students: https://masters.cs.uchicago.edu/student-resources/non-mpcs-student-course-requests/
This class is scheduled at a time that conflicts with these other classes: