diff --git a/README.md b/README.md index a69e4ef..9dcd875 100644 --- a/README.md +++ b/README.md @@ -45,76 +45,6 @@ Most AI skill files are static instruction sheets. This one is a **living cognit ## 🖼️ Demo Showcase -### Premium UI Gallery - -

- - - - Premium Component 1 - -
- Premium Bento Layout Animation
- View Premium Demo Source -

- -

- - - - Premium Component 2 - -
- God-Tier Typography and Spacing
- View Premium Demo Source -

- -

- - - - Premium Component 3 - -
- Mathematical Motion and Easing
- View Premium Demo Source -

- -### AI Slop vs Anti-Slop (Premium) Visual Comparison - - - - - - - - - - -
- Standard AI Layout (Slop) - - Anti-Slop Design (Premium) -
- - - - Standard AI Layout - -
- Generic, unstructured, low contrast
- View Slop Demo Source -		 - - - - Premium AI Layout - -
- Structured, OKLCH colors, perfect density
- View Premium Demo Source -
- ### SVG Logo Generation Engine — Real Output Generated with `node skills/utils/svg-generator.js`. These are **real SVGs** from the engine, not mockups: @@ -396,15 +326,13 @@ This isn't blind token prediction. Agents using this skill understand the **math Every interface gets ONE motion personality. This drives all animation choices: -| Personality | Best For | Easing | Duration | Character | Preview | -|-------------|---------------------|-------------------------------------|-----------|------------------------------|---------| -| **Whisper** | Luxury, editorial | `cubic-bezier(0.25, 0.1, 0.25, 1)` | 400-600ms | Subtle fades, gentle slides | Whisper easing curve | -| **Breathe** | Wellness, lifestyle | `cubic-bezier(0.34, 1.56, 0.64, 1)` | 300-500ms | Organic expansions | Breathe easing curve | -| **Snap** | SaaS, fintech | `cubic-bezier(0.34, 1.56, 0.64, 1)` | 150-300ms | Quick, elastic | Snap easing curve | -| **Flow** | Creative agencies | `cubic-bezier(0.4, 0, 0.2, 1)` | 400-800ms | Liquid, connected | Flow easing curve | -| **Pulse** | Social, real-time | `cubic-bezier(0.4, 0, 0.6, 1)` | 200-400ms | Rhythmic, heartbeat | Pulse easing curve | - -*See all motion personalities combined in the [Premium Design Demo](test-premium-example.html).* +| Personality | Best For | Easing | Duration | Character | +|-------------|---------------------|-------------------------------------|-----------|------------------------------| +| **Whisper** | Luxury, editorial | `cubic-bezier(0.25, 0.1, 0.25, 1)` | 400-600ms | Subtle fades, gentle slides | +| **Breathe** | Wellness, lifestyle | `cubic-bezier(0.34, 1.56, 0.64, 1)` | 300-500ms | Organic expansions | +| **Snap** | SaaS, fintech | `cubic-bezier(0.34, 1.56, 0.64, 1)` | 150-300ms | Quick, elastic | +| **Flow** | Creative agencies | `cubic-bezier(0.4, 0, 0.2, 1)` | 400-800ms | Liquid, connected | +| **Pulse** | Social, real-time | `cubic-bezier(0.4, 0, 0.6, 1)` | 200-400ms | Rhythmic, heartbeat | --- diff --git a/SKILL.md b/SKILL.md index 4e58a1f..74e56ef 100644 --- a/SKILL.md +++ b/SKILL.md @@ -93,27 +93,6 @@ You must spend your first turn running the **L5 SWE Planning Protocol** and gene **Loads**: `skills/design-skill/SKILL.md` -**Reference Assets**: -- [3D Web Integration](skills/design-skill/references/3d-web-integration.md) -- [AI First UI Patterns](skills/design-skill/references/ai-first-ui-patterns.md) -- [AI Slop Banned](skills/design-skill/references/ai-slop-banned.csv) -- [Bento Grid Layouts](skills/design-skill/references/bento-grid-layouts.md) -- [Choreography Patterns](skills/design-skill/references/choreography-patterns.md) -- [CSS 2026 Features](skills/design-skill/references/css-2026-features.md) -- [Design Canvas Protocol](skills/design-skill/references/design-canvas-protocol.md) -- [Design Categories Directory](skills/design-skill/references/design-categories-directory.md) -- [Design Cognition Calculus](skills/design-skill/references/design-cognition-calculus.md) -- [Design Persona Tones](skills/design-skill/references/design-persona-tones.md) -- [Ethical Privacy UX](skills/design-skill/references/ethical-privacy-ux.md) -- [Hero Video CDN Resources](skills/design-skill/references/hero-video-cdn-resources.md) -- [Motion Timing Scale](skills/design-skill/references/motion-timing-scale.md) -- [Motionsites Analysis](skills/design-skill/references/motionsites-analysis.md) -- [Premium Award Winning Patterns](skills/design-skill/references/premium-award-winning-patterns.md) -- [Prompt Interpretation Guide](skills/design-skill/references/prompt-interpretation-guide.md) -- [Stunning Web Patterns](skills/design-skill/references/stunning-web-patterns.md) -- [Sustainable UX](skills/design-skill/references/sustainable-ux.md) -- [WCAG 3 Reference](skills/design-skill/references/wcag-3-reference.md) - --- ### Frontend Skill (web-dev-frontend-skill) diff --git a/assets/motion-breathe-dark.gif b/assets/motion-breathe-dark.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/motion-breathe-dark.gif and /dev/null differ diff --git a/assets/motion-breathe-light.gif b/assets/motion-breathe-light.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/motion-breathe-light.gif and /dev/null differ diff --git a/assets/motion-flow-dark.gif b/assets/motion-flow-dark.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/motion-flow-dark.gif and /dev/null differ diff --git a/assets/motion-flow-light.gif b/assets/motion-flow-light.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/motion-flow-light.gif and /dev/null differ diff --git a/assets/motion-pulse-dark.gif b/assets/motion-pulse-dark.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/motion-pulse-dark.gif and /dev/null differ diff --git a/assets/motion-pulse-light.gif b/assets/motion-pulse-light.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/motion-pulse-light.gif and /dev/null differ diff --git a/assets/motion-snap-dark.gif b/assets/motion-snap-dark.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/motion-snap-dark.gif and /dev/null differ diff --git a/assets/motion-snap-light.gif b/assets/motion-snap-light.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/motion-snap-light.gif and /dev/null differ diff --git a/assets/motion-whisper-dark.gif b/assets/motion-whisper-dark.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/motion-whisper-dark.gif and /dev/null differ diff --git a/assets/motion-whisper-light.gif b/assets/motion-whisper-light.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/motion-whisper-light.gif and /dev/null differ diff --git a/assets/premium-demo-1-dark.gif b/assets/premium-demo-1-dark.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/premium-demo-1-dark.gif and /dev/null differ diff --git a/assets/premium-demo-1-light.gif b/assets/premium-demo-1-light.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/premium-demo-1-light.gif and /dev/null differ diff --git a/assets/premium-demo-2-dark.gif b/assets/premium-demo-2-dark.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/premium-demo-2-dark.gif and /dev/null differ diff --git a/assets/premium-demo-2-light.gif b/assets/premium-demo-2-light.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/premium-demo-2-light.gif and /dev/null differ diff --git a/assets/premium-demo-3-dark.gif b/assets/premium-demo-3-dark.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/premium-demo-3-dark.gif and /dev/null differ diff --git a/assets/premium-demo-3-light.gif b/assets/premium-demo-3-light.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/premium-demo-3-light.gif and /dev/null differ diff --git a/assets/slop-vs-premium-dark.gif b/assets/slop-vs-premium-dark.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/slop-vs-premium-dark.gif and /dev/null differ diff --git a/assets/slop-vs-premium-light.gif b/assets/slop-vs-premium-light.gif deleted file mode 100644 index f191b28..0000000 Binary files a/assets/slop-vs-premium-light.gif and /dev/null differ