Frontend Atlas

Courses

The path

Fourteen courses in four acts, sequenced so early wins come from your strengths and the capstone spends everything earned along the way. The recommended path is linear – the dependency notes show what a skip costs. 3 of 14 built so far – each lands here as it ships.

Act 1

Seeing

Starts at your strength – judgment first, vocabulary attached.

  1. 01The EyeStartWhat good design is doing
  2. 02The JourneyStartUI vs UX, user journeys
  3. 03The SystemStartTokens, components, states – and building one
  4. 04TasteQueuedStyles, trends, human vs generic

Act 2

Building

The from-zero engineering track – outcomes first, internals second.

  1. 05The MaterialQueuedHTML, CSS, JS, TS, frameworks, testing
  2. 06The FeedQueuedFront end ↔ back end, rendering, content
  3. 07FastQueuedPerformance as experience

Act 3

Experiencing

Where judgment and engineering meet the person using the thing.

  1. 08The StageQueuedMobile vs desktop, viewports, touch · Needs 01
  2. 09EveryoneQueuedAccessibility · Needs 01 & 03
  3. 10AliveQueuedMotion and animation · Needs 01 & 05
  4. 11The CeilingQueued3D and advanced visuals · Needs 05 & 10

Act 4

Directing

The practice layer – tools, process, and the capstone that spends every vocabulary earned above.

  1. 12The WorkshopQueuedFigma, DevTools, AI tooling · Needs 03 & 05
  2. 13The ProcessQueuedHow designs come to being · Needs 01 & 02
  3. 14The DirectorQueuedPrompting agents for UI – the capstone · Needs everything above