spark

The whole course, in order.

Most designers can prompt their way to an app. Few can start from an empty file. These modules take you there, one line at a time.

19 modules · 5 phases · no code needed to begin

Start here01 Make a real file yoursSection 1 of 12 · 9 minBegin
Phase 0

Foundations

5 modules
  1. 01Make a real file yoursRead every line of a real shipped file and say what it does and why.9 min
  2. 02How the web runsKnow what happens between saving a file and seeing it in a browser.7 min
  3. 03HTML, the languageHand-write semantic, accessible HTML, and start designing in the browser.9 min
  4. 04CSS as a systemBuild responsive layouts and fluid type without a framework.18 min
  5. 05CSS CraftRecreate a real design pixel for pixel, then add a transition only where it helps someone follow the change.5 min
Phase 1

JavaScript and React

5 modules
  1. 06JavaScript fundamentalsSolve UI problems in plain JavaScript.14 min
  2. 07Intermediate JavaScript: Fetch and Real DataFetch and work with real data in the UI.9 min
  3. 08TypeScript for UIType component props and data confidently.3 min
  4. 09React FundamentalsBuild a small React app and reason about state8 min
  5. 10Testing React UIWrite the test before the component, then refactor without fear of breaking it.9 min
Phase 2

Design engineer core

4 modules
  1. 11Design Systems in CodeTurn a design system into a coded, themed component library. Move tokens both directions and build components that designers and engineers both respect.11 min
  2. 12Motion & Interaction EngineeringBuild motion that communicates, and know when to leave it out.12 min
  3. 13Shipping UI, Next.js + Desktop/ElectronShip a real Next.js app to a live domain, and know what runs where.23 min
  4. 14Designing AI-native interaction patternsInvent interaction patterns for AI products where no precedent exists.10 min
Phase 3

Full stack

4 modules
  1. 15Data & APIs in depthDesign and build the endpoint that powers your own interface.9 min
  2. 16Databases & ORMStore data that survives a restart, and read the SQL running underneath.10 min
  3. 17Auth: Gating Pages Behind LoginGate something behind login and understand sessions vs. tokens.5 min
  4. 18Professional Practice & DeployWork the way an engineer on a team works: branches, reviews, and deploys.16 min
Phase 4

Capstone

1 modules
  1. 19CapstoneDesign, build, and deploy one polished product integrating tokens, motion, AI, and accessibility. Your portfolio piece.24 min