Skip to main content

Cartograph

How it works section#13 of 37Mobile

About this design

How it works section for Mobile: cartograph tutorial lesson 2, 'Connect your first source,' with a 01:48 source-map preview.

  • Style: deep petrol-blue panels, cream text, orange and ice accents.

  • Layout: mobile column, a four-stop progress rail above a video lesson card and takeaway note.

  • Components: close button, four-step rail, poster with play scrubber, node badges, next dock.

  • Vibe: instructional, technical, dark — tutorial lesson screen.

More How it works sections

View all 37
How it works
How it works | Threadmark
How it works
How it works | Harborlane
How it works
How it works | Lanternpath
How it works
How it works | Cedarstack
How it works
How it works | Quarrynote
How it works
How it works | Postbridge