Quality Checklists

Pre-Flight Checklist

Verify BEFORE writing each slide.

The 3-Second Scan Test (VERIFY FIRST)

Can a student understand the slide's key point in 3 seconds?

If not, it's too cluttered. Remove content until it passes.

Conciseness Checks

  • NO explanatory subtitles (no "First, let's figure out...")
  • Problem reminder <= 15 words (e.g., "30 nuggets total. 6 per student. How many students?")
  • CFU question: ONE question, <= 12 words (no two-part questions!)
  • Answer box <= 25 words (1-2 sentences only)
  • Left/Right columns are COMPLEMENTARY (text left, visual right - NO duplication)
  • No redundant info boxes (no "Reading the graph: ..." boxes)
  • Visuals are self-explanatory (no text boxes explaining what's already shown)

The Duplication Test (two-column layouts)

If using two-column, verify you're not duplicating:

  • Left column says something DIFFERENT than the visual on the right
  • If left explains "meanings" and right shows "meanings" boxes → use centered instead
  • If left describes groups and right shows those same groups → use centered instead

Ask: "Am I saying the same thing twice?" If yes, switch to centered and let the diagram be the content.

Technical Requirements (Deck Visual TSX)

  • Visual component renders a 640x360 SVG viewport (viewBox="0 0 640 360")
  • All visual elements wrapped in SVG <g> groups with data-element-id attributes
  • Each slide ID has a corresponding fixture in contract.test.ts with visibleElements and hiddenElements
  • Progressive reveal uses show() predicate from SlideSystem
  • Elements that appear/disappear are wrapped in <Animated> component
  • Colors use 6-digit hex only (e.g., #ffffff) — never rgb/rgba/named colors

Slide IDs and Structure

  • Slide IDs follow convention: "title", "problem-setup", "step-1", "step-1-cfu", "step-1-answer", etc.
  • CFU and Answer use separate slide IDs (not stacked on the same slide)
  • CFU/Answer rendered via CfuAnswerCard TSX component

If SVG Visual

  • SVG container uses 640x360 viewport
  • SVG container in SAME position as other step slides (visual consistency)
  • Each distinct element group has its own <g> with a unique data-element-id

If Slide Has CFU/Answer (Step Slides)

  • CFU and Answer have separate slide IDs ("step-N-cfu" and "step-N-answer")
  • CFU rendered via CfuAnswerCard component
  • Answer rendered via CfuAnswerCard component
  • CFU question references strategy verb
  • Answer is direct, <= 25 words
  • Problem reminder is at bottom of slide