interaction-physics

Vibe Creator's Skills is a complete, production-ready system of Claude Skills built on the philosophy of focus and care — designing and building with deep intention, reducing until it's clear, and refining until it's right.

This repository contains:

• 10 Marketing Skills — Direct response marketing, SEO, email, content strategy
• 8 Creative Skills — AI-powered image generation with nanobanana pro, video planning, Remotion scripts, social graphics
• 13 Frontend Design Skills — Design systems, responsive layouts, typography, interactions, performance, accessibility
• Complete Documentation — Philosophy, research, implementation guides, code examples
• Automation Tools — Python CLI for creative asset generation with FAL.ai nanobanana pro

Total: 32 professional skills + comprehensive guidance + automation tools

Skills by Category

#### Marketing Skills (10 skills)

Transform your marketing from generic to direct response, from scattered to strategic.

1. orchestrator — Diagnose your marketing situation and sequence skills optimally
2. brand-voice — Define your unique voice and positioning
3. positioning-angles — Find your differentiation with 8 frameworks
4. keyword-research — The 6 Circles Method for keyword strategy
5. lead-magnet — Create compelling free offers
6. direct-response-copy — Write copy that converts
7. seo-content — Create ranking content
8. newsletter — 6 newsletter formats
9. email-sequences — Welcome, nurture, conversion, launch sequences
10. content-atomizer — Repurpose content 15 ways
11. seo-strategy — Plan complete SEO strategy for your product
12. tweet-writer — Search for suitable viral tweet format for the purpose and writes tweets accordingly

Path: Start with orchestrator to assess your situation, then follow the recommended sequence.

#### Creative Skills (8 skills + automation)

Generate professional creative assets with AI, powered by FAL.ai nanobanana pro.

1. orchestrator — Coordinate all creative skills
2. creative-strategist — Define your visual direction
3. image-generation — Generate images with nanobanana pro
4. product-photography — Create professional product shots
5. product-video — Plan animated product videos
6. social-graphics — Platform-optimized social content
7. brand-asset — Logos, icons, patterns, brand elements
8. talking-head — Presenter and UGC-style videos
9. remotion-script-writer — Generate detailed video scripts for Remotion

Plus: Python automation system for CLI-based and Claude Code asset generation

Path: Start with creative-strategist to define your visual direction, then use orchestrator to sequence remaining skills.

#### Frontend Design Skills (13 skills) ✨ ENHANCED

Build design systems and interfaces that feel timeless and loved. Now with 5 additional skills based on research insights.

Foundation Layer (2 skills):

1. frontend-orchestrator — Assess design maturity and sequence all 13 skills optimally
2. design-foundation — Design tokens, principles, component structure

Visual Layer (4 skills):

1. layout-system — Responsive layouts, Flexbox, Grid, Container Queries
2. typography-system — Type scales, hierarchy, readability
3. color-system — Color theory, accessibility, theming, dark mode
4. visual-hierarchy-refactoring — NEW! Size, weight, contrast, whitespace, Gestalt principles

Component Layer (1 skill):

1. component-architecture — Reusable components, atomic design

Interaction Layer (4 skills):

1. interaction-physics — Animations, momentum, gesture physics, feedback
2. loading-states — NEW! Skele