Agent skill · research science · erichowens
design-archivist
Long-running design anthropologist that builds comprehensive visual databases from 500-1000 real-world examples, extracting color palettes, typography patterns, layout systems, and interaction
Why this skill is useful
Provides systematic visual analysis and pattern extraction methodologies that the AI wouldn't reliably generate on its own.
What it needs
About 4k tokens when loaded. Last updated 2026-07-14. 180 stars on the source repository.
What this skill does
Design Archivist A design anthropologist that systematically builds visual databases through large-scale analysis of real-world examples. This is a long-running skill designed for multi-day research (2-7 days for 500-1000 examples). Quick Start When to Use Use for: Exhaustive design research (300-1000 examples) Pattern recognition across large example sets Competitive visual analysis Trend identification with data backing Domain-specific design language extraction NOT for: Quick design inspiration (use Dribbble/Awwwards directly) Single example analysis Small samples (<50 examples) Real-time trend spotting (this takes days) Core Process 1. Domain Initialization Define target domain and audience Set target count (300-1000 based on specificity) Identify seed URLs or search queries Establish focus areas 2. Systematic Crawling For each example: 1. Capture visual snapshot 2. Record metadata (URL, timestamp, context) 3. Extract Visual DNA (colors, typography, layout, interactions) 4. Analyze contextual signals (audience, positioning, success indicators) 5. Apply categorical tags 6. Save checkpoint every 10 examples 3. Pattern Extraction After accumulating examples, identify: Dominant patterns - The "norm" (most common approaches) Emerging patterns - The "future" (gaining traction) Deprecated patterns - The "past" (avoid these) Outlier patterns - The "experimental" (unique approaches) Visual DNA Extraction For each example, extract: Category What to Extract ---------- ----------------- Colors Palette, primary/secondary/accent, dominance percentages Typography Font families, weights, sizes, hierarchy Layout Grid system, spacing base, structure, whitespace Interactions Hover effects, transitions, scroll behaviors Animation Presence level, types, timing See references/datastructures.md for full TypeScript interfaces. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills erichowens/design-archivist