GIT 540 · Master’s interaction design
Design History Timeline
A timeline experience with browsing, movement/artist indexes, search, filters, saved items, and a featured deep-dive branch (Alvin Lustig).
System
Design system
Editorial palette + type scale, components, states, and consistent motion patterns.
IA
Indexes + navigation
Timeline + Movements + Artists + Gallery + Search + Saved + Learn/Quiz.
Deep-dive
Featured artist branch
Spotlight experience for a single designer with works and context.
Most visual moments
- • Timeline browsing with “jump to timeline” behavior and cards.
- • Filter chips and search results layout.
- • Artist detail with works grid and save states.
- • Deep-dive branch presentation (featured artist).
Hero: Timeline page (desktop) showing movement cards + nav
Figma screenshot placeholder (replace with PNG export)
Recommended: 1600×900 PNG for desktop frames; 1200×900 for detail screens.
Deep-dive: Featured artist page (most portfolio-worthy)
Figma screenshot placeholder (replace with PNG export)
Recommended: 1600×900 PNG for desktop frames; 1200×900 for detail screens.
Search results page (query + results + filters visible)
Figma screenshot placeholder (replace with PNG export)
Recommended: 1600×900 PNG for desktop frames; 1200×900 for detail screens.
Saved items page (shows state + organization)
Figma screenshot placeholder (replace with PNG export)
Recommended: 1600×900 PNG for desktop frames; 1200×900 for detail screens.
What to screenshot from Figma
- 1) Home or Timeline hero with navigation visible.
- 2) Timeline view showing interaction affordances (jump, movement cards).
- 3) Movements index or Artists index (clean grid + filters).
- 4) Search results page (filters + results).
- 5) Featured artist deep-dive page (Lustig) with works.
- 6) Saved page (shows persistence/organization).
Export tip: Use desktop frame exports. Crop only if needed for clarity.
Prototype link placeholder
Add the Figma prototype link here later. The page is designed to look complete even without it.