# S01: Homepage Hero & Value Proposition — UAT

**Milestone:** M009
**Written:** 2026-03-31T05:38:05.139Z

## UAT: Homepage Hero & Value Proposition

### Preconditions
- Chrysopedia stack running (web UI accessible at configured URL)
- At least one topic with sub-topics exists in the database (for popular topics to render)

### Test 1: Hero Content Visible
1. Navigate to the homepage (/)
2. **Expected:** Page shows heading "Production Knowledge, Distilled"
3. **Expected:** Below the heading, a paragraph explains what Chrysopedia does — mentions extracting techniques from creator tutorials
4. **Expected:** Search bar remains visible and prominent

### Test 2: How-It-Works Grid
1. On the homepage, locate the how-it-works section
2. **Expected:** Three steps displayed in a row (desktop): (1) Creators Share Techniques, (2) AI Extracts Key Moments, (3) You Find Answers Fast
3. **Expected:** Each step has a numbered circle with cyan accent color and a short description
4. Resize browser to <640px width
5. **Expected:** Steps stack vertically

### Test 3: Start Exploring CTA
1. On the homepage, locate the "Start Exploring" button
2. Click the button
3. **Expected:** Navigates to /topics page

### Test 4: Popular Topics Pills
1. Navigate back to homepage (/)
2. **Expected:** A "Popular Topics" section appears with up to 8 pill/chip links
3. **Expected:** Pills are ordered by technique count (most popular first)
4. Click any topic pill
5. **Expected:** Navigates to /search?q={topic_name}&scope=topics with relevant results

### Test 5: Popular Topics — Empty State
1. If no topics exist in the database (or API is down), navigate to homepage
2. **Expected:** Popular Topics section is completely hidden — no heading, no empty container, no error message

### Test 6: Visual Hierarchy
1. On desktop (>768px), load the homepage
2. **Expected:** Hero title and search bar are visible without scrolling
3. **Expected:** How-it-works section and CTA are below but reachable with minimal scroll
4. **Expected:** Popular topics pills visually complement but don't compete with the search bar
