Design Engineer Roadmap

From designer to design engineer — build and ship with Claude Code.

A self-paced path, about an hour a day, across 28 days. Two arcs: Foundations first, then Design Engineering. You will not hand-write code — you will direct Claude Code, and understand what it builds.

Start — Day 1

The journey

Foundations

0 · Orient

1 · Operate

2 3

2 · Version control

4 5

3 · Claude Code core

6 7

Design Engineering

4 · Context engineering

8 9 10

5 · Web, guided

11 12 13

6 · See it running

14 15 16

7 · Design-to-code seam

17 18 19

8 · Extending Claude Code

20 21 22 23

9 · Orchestration and harness tools

24 25 26

10 · Capstone and deploy

27 28

How to use this site

macOS / Windows: Pick your system top-right — every command adapts to it.
Light / dark: Toggle top-right. Defaults to dark.
Search: Press Cmd/Ctrl-K to jump to any day or step.
Navigate: ← → arrow keys, or the buttons at the foot of each day.
Progress: Mark a day complete; the map above fills in.
Download: Grab any day as markdown, or the skills as zip files.
Share: Copy a link to any page from the header.
Glossary: Hover any jargon term for a plain definition.

Before you start

You will need a Claude Pro or Max account for Claude Code.
Grab the eight bundled skills — you install them in Phase 8.

View on GitHub