Implement infographic system with automated AI filtering
## What Was Added:
1. **Infographics field** in ClaimData interface
- filename, alt text, optional caption
- Added to all 14 existing claims (empty arrays where no images)
2. **Dynamic template enhancement**
- Added Next.js Image component
- "Visual Evidence" section displays infographics
- Appears after Key Statistics, before Sources
3. **Automated image filtering**
- AI evaluates images against strict criteria:
- White background required
- Black text with red accents only
- NO photographs, screenshots, colored backgrounds
- Downloads only compliant images
4. **Claude Skills article**
- ✅ 3 infographics added (workflow, implementation, performance)
- Downloaded to /public/assets/
- All meet white/black/red criteria
5. **Vibe Coding article**
- No compliant infographics found (photos/banners only)
- Page created without images (per guidelines)
6. **Documentation updated**
- ADDING_NEW_CLAIMS.md includes infographic criteria
- Explains automated filtering process
## File Changes:
- src/data/claims.ts: Added infographics field to interface + all entries
- src/app/claims-library/[slug]/page.tsx: Added Image display section
- public/assets/*.png: 3 new Claude Skills infographics
- ADDING_NEW_CLAIMS.md: Documented infographic workflow
## Result:
✅ Infographics now part of automated extraction workflow
✅ Strict filtering ensures brand consistency
✅ No infographics = OK (many pages work fine without)
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
f40ada1aea
commit
e127f885ec
Binary file not shown.
|
After Width: | Height: | Size: 180 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 195 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 156 KiB |
Loading…
Reference in New Issue