Art Director

Help art directors turn references, taste and samples into a shareable project pack, then guide teammates and agents to create, review and deliver consistent components. Use for art-direction setup, visual systems, multi-category production and revisions in games, UI and campaigns.

5 stars 1 forksFrontend & Design

Install

skills CLI (Claude Code, Cursor, Codex and more)

npx skills add NewenergyEric/art-director-skill --skill art-director

Manual install

git clone --depth 1 https://github.com/NewenergyEric/art-director-skill.git /tmp/art-director-skill
mkdir -p ~/.claude/skills
cp -r /tmp/art-director-skill/. ~/.claude/skills/art-director

Personal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.

From the SKILL.md

# Art Director

**One team, one visual memory.** Make the art director's judgment reusable, so teammates and agents can create coherent components without asking the director to explain the project again.

Preserve the reasons behind the work: its mood, playfulness and expressive choices. Rules should help another person make a good design decision, not reduce the project to a checklist or make every asset look the same.

For a first handoff or a multi-category trial, use [cross-category handoff](references/cross-category-handoff.md). Include the game's own UI artwork, editable type and state behavior; check assets together at the target viewport, including crop safety. A relocated-directory self-test by one agent is not an independent team trial.

Help the design lead establish direction, samples and component requirements, then connect them to assigned work, creation, review and delivery. Directors and teammates work in design language; the agent handles organization, tool use and versions. A solo creator may perform both roles. Public materials are English-first with Chinese editions. Replies and project documents follow the user's language and project needs.

Read the full skill on GitHub

Details

Skill name: art-director
Repository: NewenergyEric/art-director-skill
License: MIT
Repo updated: 30 October 2026

FAQ

What does the Art Director skill do?

How do I install the Art Director skill?

skills CLI (Claude Code, Cursor, Codex and more): npx skills add NewenergyEric/art-director-skill --skill art-director. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.

Is Art Director popular?

It lives in NewenergyEric/art-director-skill, which has 5 GitHub stars and 1 forks.

Related skills

Frontend

adamholter/frontend-skill

Always read anytime you're making any UI the user will see, whether that's a one-off HTML file or a tool they're building. Any visual artifact at all.

Frontend & Design

Screenshot to Design System

WCF900905/screenshot-to-design-system

Extracts color tokens and component styles from UI screenshots by reading each control region individually (not full-page layout). Generates a complete design system demo with tokens.css and components.html. Ignores backgrounds and icons. Use when the user uploads a UI screenshot, asks for design tokens, color palette extraction, or component library generation from a reference image.

Frontend & Design

Mente Designer

eulucasduty/mente-designer

DNA de design de 20 sites premium (engenharia reversa via DevTools) — a fórmula Webflow/HTML + Lenis + GSAP/ScrollTrigger destilada em leis, calibres medidos e 22 efeitos nomeados com código. Use ao criar landing pages animadas, sites com scrollytelling, heroes tipográficos, vídeo-fundo, marquees, pin/scrub ou qualquer página que precise de "feel" de agência de elite.

Frontend & Design

Salgadoia Web Design Engineer Pro

Luispitik/salgadoia-web-design-engineer-pro

Skill end-to-end para construir webs y landings profesionales con Next.js 16, React 19, Tailwind CSS v4, shadcn/ui y Framer Motion. Pensada para que un usuario sin conocimientos técnicos pueda PREVISUALIZAR estilos en su navegador antes de elegir, y completar la página de principio a fin (intake, brief, diseño, build, QA, deploy). Combina 8 direcciones visuales narrativas (Editorial Serif, Swiss Minimal, Luxury Dark Warm, Corporate Bold, Understated Elegance, Neo-Brutalist, Playful Gradient, Retro Terminal) con 10 paletas y 10 emparejamientos tipográficos en un sistema mix-and-match con build-

Frontend & Design

Sprite Forge

isabellagreco1997/sprite-forge

Turn any pixel-art image (real or AI-generated) into clean game sprites, new poses and animations (idle, walk) that keep the character consistent. Use when asked to extract a character from a screenshot, make a sprite, re-pose a sprite, animate a pixel character, build a walk/idle cycle, or put an animated sprite back into its scene.

Frontend & Design

Quasar Vue3

felixyakubov91/claude-quasar

Comprehensive Quasar Framework (v2) and Vue 3 development assistance. Use this skill when working with Quasar projects, components, plugins, directives, composables, CLI configuration, or building apps (SPA, SSR, PWA, Electron, Capacitor, Cordova, Browser Extensions). Triggers on Quasar-specific questions, quasar.config.js, Q-prefixed components (QBtn, QInput, QTable, etc.), Quasar CLI commands, or Vue 3 Composition API with Quasar.

Frontend & Design

Browse the most popular Claude skills, all frontend & design skills, or write your own with the skills generator.