mirror of
https://github.com/pbakaus/impeccable.git
synced 2026-09-12 22:26:38 +03:00
Paul BakausandClaude Opus 4.5
2181137d04
Major changes: - Consolidate 8 design skills into single frontend-design skill with 7 reference files - Add source/patterns.md as single source of truth for patterns/antipatterns - Patterns are merged into skill during build, served via API for website - Website now dynamically renders both "What TO Do" and "What NOT to Do" sections - Update build system to handle directory-based skills with references - Add /api/patterns endpoint to server - Refactor website with new Antidote section layout 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
102 lines
4.2 KiB
JavaScript
102 lines
4.2 KiB
JavaScript
// ============================================
|
|
// DATA: Skill focus areas, command processes, relationships
|
|
// ============================================
|
|
|
|
// Items that are fully complete and ready for public use
|
|
// All others will show "Coming Soon"
|
|
export const readySkills = [
|
|
'frontend-design' // Consolidated skill with all design domains
|
|
];
|
|
|
|
export const readyCommands = [
|
|
'normalize' // First command to be fully completed
|
|
];
|
|
|
|
// Consolidated frontend-design skill with reference domains
|
|
export const skillFocusAreas = {
|
|
'frontend-design': [
|
|
{ area: 'Typography', detail: 'Scale, rhythm, hierarchy, expression' },
|
|
{ area: 'Color & Contrast', detail: 'Accessibility, systems, theming' },
|
|
{ area: 'Spatial Design', detail: 'Layout, spacing, composition' },
|
|
{ area: 'Responsive', detail: 'Fluid layouts, touch targets' },
|
|
{ area: 'Interaction', detail: 'States, feedback, affordances' },
|
|
{ area: 'Motion', detail: 'Micro-interactions, transitions' },
|
|
{ area: 'UX Writing', detail: 'Clarity, voice, error messages' }
|
|
]
|
|
};
|
|
|
|
// Reference domains within the frontend-design skill
|
|
export const skillReferenceDomains = [
|
|
'typography',
|
|
'color-and-contrast',
|
|
'spatial-design',
|
|
'responsive-design',
|
|
'interaction-design',
|
|
'motion-design',
|
|
'ux-writing'
|
|
];
|
|
|
|
export const commandProcessSteps = {
|
|
'audit': ['Scan', 'Document', 'Prioritize', 'Recommend'],
|
|
'normalize': ['Analyze', 'Identify', 'Align', 'Verify'],
|
|
'polish': ['Review', 'Refine', 'Verify'],
|
|
'optimize': ['Profile', 'Identify', 'Improve', 'Measure'],
|
|
'harden': ['Test', 'Handle', 'Wrap', 'Validate'],
|
|
'clarify': ['Read', 'Simplify', 'Improve', 'Test'],
|
|
'quieter': ['Analyze', 'Reduce', 'Refine'],
|
|
'bolder': ['Analyze', 'Amplify', 'Impact'],
|
|
'simplify': ['Audit', 'Remove', 'Clarify'],
|
|
'animate': ['Identify', 'Design', 'Implement', 'Polish'],
|
|
'colorize': ['Analyze', 'Strategy', 'Apply', 'Balance'],
|
|
'delight': ['Identify', 'Design', 'Implement'],
|
|
'extract': ['Identify', 'Abstract', 'Document'],
|
|
'adapt': ['Analyze', 'Adjust', 'Optimize'],
|
|
'onboard': ['Map', 'Design', 'Guide']
|
|
};
|
|
|
|
export const commandCategories = {
|
|
'audit': 'diagnostic',
|
|
'normalize': 'quality',
|
|
'polish': 'quality',
|
|
'optimize': 'quality',
|
|
'harden': 'quality',
|
|
'clarify': 'adaptation',
|
|
'quieter': 'intensity',
|
|
'bolder': 'intensity',
|
|
'simplify': 'adaptation',
|
|
'animate': 'enhancement',
|
|
'colorize': 'enhancement',
|
|
'delight': 'enhancement',
|
|
'extract': 'system',
|
|
'adapt': 'adaptation',
|
|
'onboard': 'system'
|
|
};
|
|
|
|
// Skill relationships - now consolidated into frontend-design skill
|
|
// The frontend-design skill contains all domains as reference files
|
|
export const skillRelationships = {
|
|
'frontend-design': {
|
|
description: 'Comprehensive design intelligence with progressive reference loading',
|
|
referenceDomains: ['typography', 'color-and-contrast', 'spatial-design', 'responsive-design', 'interaction-design', 'motion-design', 'ux-writing']
|
|
}
|
|
};
|
|
|
|
export const commandRelationships = {
|
|
'audit': { leadsTo: ['normalize', 'harden', 'optimize', 'adapt', 'clarify'], flow: 'Diagnostic: Start here to find issues' },
|
|
'normalize': { combinesWith: ['clarify', 'adapt'], flow: 'Quality: Align with design system' },
|
|
'polish': { flow: 'Quality: Final pass before shipping' },
|
|
'optimize': { flow: 'Quality: Performance improvements' },
|
|
'harden': { combinesWith: ['optimize'], flow: 'Quality: Error handling & edge cases' },
|
|
'clarify': { combinesWith: ['normalize', 'adapt'], flow: 'Adaptation: Improve UX copy' },
|
|
'quieter': { pairs: 'bolder', flow: 'Intensity: Tone down bold designs' },
|
|
'bolder': { pairs: 'quieter', flow: 'Intensity: Amplify timid designs' },
|
|
'simplify': { combinesWith: ['quieter', 'normalize'], flow: 'Adaptation: Strip to essence' },
|
|
'animate': { combinesWith: ['delight'], flow: 'Enhancement: Add motion' },
|
|
'colorize': { combinesWith: ['bolder', 'delight'], flow: 'Enhancement: Add strategic color' },
|
|
'delight': { combinesWith: ['bolder', 'animate'], flow: 'Enhancement: Add personality' },
|
|
'extract': { flow: 'System: Create design system elements' },
|
|
'adapt': { combinesWith: ['normalize', 'clarify'], flow: 'Adaptation: Different devices/contexts' },
|
|
'onboard': { flow: 'System: Onboarding & empty states' }
|
|
};
|
|
|