Week 7: The Rough Cut

week-7/

"Can your story work before JavaScript starts moving it?"

Curriculum content for this week is coming soon.

Translate Figma section designs into semantic HTML structure (hero + story chapters + closing)
Apply design tokens from `tokens.css` to layout, type, and color decisions
Build reusable section layout patterns in `layout.css` (spacing, containers, rhythm)
Establish visual rhythm across sections in the browser (contrast in layout, density, pacing)
Adjust layouts for mobile and desktop readability
Test that the site remains readable and functional with JavaScript disabled
Write real content for the majority (or all) of their sections
Prepare a complete rough cut for next week's animation work
Integrate Project 1 theme toggle (dark mode tokens, localStorage, system preference detection) into the scrollytelling project
Implement GSAP entrance animations using timelines, easing, and stagger for hero and 2+ story sections

Translate Figma section designs into semantic HTML structure (hero + story chapters + closing)
Apply design tokens from `tokens.css` to layout, type, and color decisions
Build reusable section layout patterns in `layout.css` (spacing, containers, rhythm)
Establish visual rhythm across sections in the browser (contrast in layout, density, pacing)
Adjust layouts for mobile and desktop readability
Test that the site remains readable and functional with JavaScript disabled
Write real content for the majority (or all) of their sections
Prepare a complete rough cut for next week's animation work
Integrate Project 1 theme toggle (dark mode tokens, localStorage, system preference detection) into the scrollytelling project
Implement GSAP entrance animations using timelines, easing, and stagger for hero and 2+ story sections