Course catalog
Learn to see what makes a page look designed, then brief your agent to build it.
Your agent can build a working page in minutes, and it will look like every other generated page: a purple gradient, a centered hero, six emoji cards. This course teaches you to see what makes a page look designed (hierarchy, spacing, type and color) with live examples you can drag and adjust. Then you learn to brief like a designer: references with notes instead of adjectives, design tokens instead of guesses, and screenshots that point at one problem. You'll run critique passes for accessibility, motion, small screens and empty or error states, and finish with a design system your agent reads every session: a tokens file, component rules and a short DESIGN.md. No design or coding background needed.
Section 1
Learn the four things that make a page look designed instead of generated: a clear first stop, deliberate spacing, a short type scale and colors that each have a job.
Section 2
Turn taste into instructions an agent can follow: name the generic defaults, brief with references instead of adjectives, hand over your design tokens and send screenshots that point at one problem.
7-day free trial on every plan for first-time members · Cancel anytime
Get startedSection 3
Polish a page in short critique loops: check contrast, targets and focus, cut motion that has no job, build phone first and ask for the empty, loading and error screens agents skip.
Section 4
Write your decisions down where every session will find them: a two-layer tokens file, checkable component rules, a short DESIGN.md wired into your agent's instruction file and habits that stop drift.