Hack23 Advanced Data Visualization Skill
🔴 AI FIRST Quality Principle
Apply the AI FIRST principle: never accept first-pass quality. Minimum 2 iterations. Read all output, improve every section. No shortcuts.
Purpose
Expert knowledge in creating interactive, accessible data visualizations using Chart.js and D3.js for complex political intelligence data.
Core Principles
- Accessibility First - WCAG 2.1 AA compliant
- Responsive Always - Mobile-first design
- Performance Critical - Optimize for large datasets
- Clarity Over Complexity - Clear data storytelling
- Interactive Insight - Enable user exploration
Enforces
- Chart.js bar/line/scatter/pie charts
- D3.js network/force/geo diagrams
- Interactive tooltips and legends
- Responsive chart design
- Screen reader compatibility
- Performance optimization (lazy loading, canvas vs SVG)
Chart Types
- Election Forecasting: Confidence intervals, seat predictions
- Risk Heat Maps: Multi-dimensional risk scoring
- Network Diagrams: Influence and power structures
- Time Series: Historical trends (50+ years)
- Scatter Plots: Correlation and clustering
- Sankey Diagrams: Coalition flows
When to Use
- Creating interactive dashboards
- Visualizing complex datasets
- Building political intelligence displays
- Network/influence mapping
- Time series analysis
References
Version: 1.0 | Last Updated: 2026-02-06 | Category: UI/UX & Design