Game art skill
Game art principles.
by davila7·MIT license·★ 32,299 Stars on the repo·GitHub ↗
Use now
npx degit davila7/claude-code-templates/cli-tool/components/skills/creative-design/game-development/game-art#main ~/.claude/skills/game-artChecked ·commit main
Files of Game art
SKILL.md
Show the full text186 lines
Game Art Principles
Visual design thinking for games - style selection, asset pipelines, and art direction.
1. Art Style Selection
Decision Tree
What feeling should the game evoke?
│
├── Nostalgic / Retro
│ ├── Limited palette? → Pixel Art
│ └── Hand-drawn feel? → Vector / Flash style
│
├── Realistic / Immersive
│ ├── High budget? → PBR 3D
│ └── Stylized realism? → Hand-painted textures
│
├── Approachable / Casual
│ ├── Clean shapes? → Flat / Minimalist
│ └── Soft feel? → Gradient / Soft shadows
│
└── Unique / Experimental
└── Define custom style guide
Style Comparison Matrix
| Style | Production Speed | Skill Floor | Scalability | Best For |
|---|---|---|---|---|
| Pixel Art | Medium | Medium | Hard to hire | Indie, retro |
| Vector/Flat | Fast | Low | Easy | Mobile, casual |
| Hand-painted | Slow | High | Medium | Fantasy, stylized |
| PBR 3D | Slow | High | AAA pipeline | Realistic games |
| Low-poly | Fast | Medium | Easy | Indie 3D |
| Cel-shaded | Medium | Medium | Medium | Anime, cartoon |
2. Asset Pipeline Decisions
2D Pipeline
| Phase | Tool Options | Output |
|---|---|---|
| Concept | Paper, Procreate, Photoshop | Reference sheet |
| Creation | Aseprite, Photoshop, Krita | Individual sprites |
| Atlas | TexturePacker, Aseprite | Spritesheet |
| Animation | Spine, DragonBones, Frame-by-frame | Animation data |
| Integration | Engine import | Game-ready assets |
3D Pipeline
| Phase | Tool Options | Output |
|---|---|---|
| Concept | 2D art, Blockout | Reference |
| Modeling | Blender, Maya, 3ds Max | High-poly mesh |
| Retopology | Blender, ZBrush | Game-ready mesh |
| UV/Texturing | Substance Painter, Blender | Texture maps |
| Rigging | Blender, Maya | Skeletal rig |
| Animation | Blender, Maya, Mixamo | Animation clips |
| Export | FBX, glTF | Engine-ready |
3. Color Theory Decisions
Palette Selection
| Goal | Strategy | Example |
|---|---|---|
| Harmony | Complementary or analogous | Nature games |
| Contrast | High saturation differences | Action games |
| Mood | Warm/cool temperature | Horror, cozy |
| Readability | Value contrast over hue | Gameplay clarity |
Color Principles
- Hierarchy: Important elements should pop
- Consistency: Same object = same color family
- Context: Colors read differently on backgrounds
- Accessibility: Don't rely only on color
4. Animation Principles
The 12 Principles (Applied to Games)
| Principle | Game Application |
|---|---|
| Squash & Stretch | Jump arcs, impacts |
| Anticipation | Wind-up before attack |
| Staging | Clear silhouettes |
| Follow-through | Hair, capes after movement |
| Slow in/out | Easing on transitions |
| Arcs | Natural movement paths |
| Secondary Action | Breathing, blinking |
| Timing | Frame count = weight/speed |
| Exaggeration | Readable from distance |
| Appeal | Memorable design |
Frame Count Guidelines
| Action Type | Typical Frames | Feel |
|---|---|---|
| Idle breathing | 4-8 | Subtle |
| Walk cycle | 6-12 | Smooth |
| Run cycle | 4-8 | Energetic |
| Attack | 3-6 | Snappy |
| Death | 8-16 | Dramatic |
5. Resolution & Scale Decisions
2D Resolution by Platform
| Platform | Base Resolution | Sprite Scale |
|---|---|---|
| Mobile | 1080p | 64-128px characters |
| Desktop | 1080p-4K | 128-256px characters |
| Pixel art | 320x180 to 640x360 | 16-32px characters |
Consistency Rule
Choose a base unit and stick to it:
- Pixel art: Work at 1x, scale up (never down)
- HD art: Define DPI, maintain ratio
- 3D: 1 unit = 1 meter (industry standard)
6. Asset Organization
Naming Convention
[type]_[object]_[variant]_[state].[ext]
Examples:
spr_player_idle_01.png
tex_stone_wall_normal.png
mesh_tree_oak_lod2.fbx
Folder Structure Principle
assets/
├── characters/
│ ├── player/
│ └── enemies/
├── environment/
│ ├── props/
│ └── tiles/
├── ui/
├── effects/
└── audio/
7. Anti-Patterns
| Don't | Do |
|---|---|
| Mix art styles randomly | Define and follow style guide |
| Work at final resolution only | Create at source resolution |
| Ignore silhouette readability | Test at gameplay distance |
| Over-detail background | Focus detail on player area |
| Skip color testing | Test on target display |
Remember: Art serves gameplay. If it doesn't help the player, it's decoration.
| 1 | |
| 2 | name game-art |
| 3 | description Game art principles. Visual style selection, asset pipeline, animation workflow. |
| 4 | allowed-tools Read, Glob, Grep |
| 5 | |
| 6 | |
| 7 | # Game Art Principles |
| 8 | |
| 9 | > Visual design thinking for games - style selection, asset pipelines, and art direction. |
| 10 | |
| 11 | |
| 12 | |
| 13 | ## 1. Art Style Selection |
| 14 | |
| 15 | ### Decision Tree |
| 16 | |
| 17 | |
| 18 | What feeling should the game evoke? |
| 19 | │ |
| 20 | ├── Nostalgic / Retro |
| 21 | │ ├── Limited palette? → Pixel Art |
| 22 | │ └── Hand-drawn feel? → Vector / Flash style |
| 23 | │ |
| 24 | ├── Realistic / Immersive |
| 25 | │ ├── High budget? → PBR 3D |
| 26 | │ └── Stylized realism? → Hand-painted textures |
| 27 | │ |
| 28 | ├── Approachable / Casual |
| 29 | │ ├── Clean shapes? → Flat / Minimalist |
| 30 | │ └── Soft feel? → Gradient / Soft shadows |
| 31 | │ |
| 32 | └── Unique / Experimental |
| 33 | └── Define custom style guide |
| 34 | |
| 35 | |
| 36 | ### Style Comparison Matrix |
| 37 | |
| 38 | | Style | Production Speed | Skill Floor | Scalability | Best For | |
| 39 | |-------|------------------|-------------|-------------|----------| |
| 40 | | **Pixel Art** | Medium | Medium | Hard to hire | Indie, retro | |
| 41 | | **Vector/Flat** | Fast | Low | Easy | Mobile, casual | |
| 42 | | **Hand-painted** | Slow | High | Medium | Fantasy, stylized | |
| 43 | | **PBR 3D** | Slow | High | AAA pipeline | Realistic games | |
| 44 | | **Low-poly** | Fast | Medium | Easy | Indie 3D | |
| 45 | | **Cel-shaded** | Medium | Medium | Medium | Anime, cartoon | |
| 46 | |
| 47 | |
| 48 | |
| 49 | ## 2. Asset Pipeline Decisions |
| 50 | |
| 51 | ### 2D Pipeline |
| 52 | |
| 53 | | Phase | Tool Options | Output | |
| 54 | |-------|--------------|--------| |
| 55 | | **Concept** | Paper, Procreate, Photoshop | Reference sheet | |
| 56 | | **Creation** | Aseprite, Photoshop, Krita | Individual sprites | |
| 57 | | **Atlas** | TexturePacker, Aseprite | Spritesheet | |
| 58 | | **Animation** | Spine, DragonBones, Frame-by-frame | Animation data | |
| 59 | | **Integration** | Engine import | Game-ready assets | |
| 60 | |
| 61 | ### 3D Pipeline |
| 62 | |
| 63 | | Phase | Tool Options | Output | |
| 64 | |-------|--------------|--------| |
| 65 | | **Concept** | 2D art, Blockout | Reference | |
| 66 | | **Modeling** | Blender, Maya, 3ds Max | High-poly mesh | |
| 67 | | **Retopology** | Blender, ZBrush | Game-ready mesh | |
| 68 | | **UV/Texturing** | Substance Painter, Blender | Texture maps | |
| 69 | | **Rigging** | Blender, Maya | Skeletal rig | |
| 70 | | **Animation** | Blender, Maya, Mixamo | Animation clips | |
| 71 | | **Export** | FBX, glTF | Engine-ready | |
| 72 | |
| 73 | |
| 74 | |
| 75 | ## 3. Color Theory Decisions |
| 76 | |
| 77 | ### Palette Selection |
| 78 | |
| 79 | | Goal | Strategy | Example | |
| 80 | |------|----------|---------| |
| 81 | | **Harmony** | Complementary or analogous | Nature games | |
| 82 | | **Contrast** | High saturation differences | Action games | |
| 83 | | **Mood** | Warm/cool temperature | Horror, cozy | |
| 84 | | **Readability** | Value contrast over hue | Gameplay clarity | |
| 85 | |
| 86 | ### Color Principles |
| 87 | |
| 88 | **Hierarchy:** Important elements should pop |
| 89 | **Consistency:** Same object = same color family |
| 90 | **Context:** Colors read differently on backgrounds |
| 91 | **Accessibility:** Don't rely only on color |
| 92 | |
| 93 | |
| 94 | |
| 95 | ## 4. Animation Principles |
| 96 | |
| 97 | ### The 12 Principles (Applied to Games) |
| 98 | |
| 99 | | Principle | Game Application | |
| 100 | |-----------|------------------| |
| 101 | | **Squash & Stretch** | Jump arcs, impacts | |
| 102 | | **Anticipation** | Wind-up before attack | |
| 103 | | **Staging** | Clear silhouettes | |
| 104 | | **Follow-through** | Hair, capes after movement | |
| 105 | | **Slow in/out** | Easing on transitions | |
| 106 | | **Arcs** | Natural movement paths | |
| 107 | | **Secondary Action** | Breathing, blinking | |
| 108 | | **Timing** | Frame count = weight/speed | |
| 109 | | **Exaggeration** | Readable from distance | |
| 110 | | **Appeal** | Memorable design | |
| 111 | |
| 112 | ### Frame Count Guidelines |
| 113 | |
| 114 | | Action Type | Typical Frames | Feel | |
| 115 | |-------------|----------------|------| |
| 116 | | Idle breathing | 4-8 | Subtle | |
| 117 | | Walk cycle | 6-12 | Smooth | |
| 118 | | Run cycle | 4-8 | Energetic | |
| 119 | | Attack | 3-6 | Snappy | |
| 120 | | Death | 8-16 | Dramatic | |
| 121 | |
| 122 | |
| 123 | |
| 124 | ## 5. Resolution & Scale Decisions |
| 125 | |
| 126 | ### 2D Resolution by Platform |
| 127 | |
| 128 | | Platform | Base Resolution | Sprite Scale | |
| 129 | |----------|-----------------|--------------| |
| 130 | | Mobile | 1080p | 64-128px characters | |
| 131 | | Desktop | 1080p-4K | 128-256px characters | |
| 132 | | Pixel art | 320x180 to 640x360 | 16-32px characters | |
| 133 | |
| 134 | ### Consistency Rule |
| 135 | |
| 136 | Choose a base unit and stick to it: |
| 137 | Pixel art: Work at 1x, scale up (never down) |
| 138 | HD art: Define DPI, maintain ratio |
| 139 | 3D: 1 unit = 1 meter (industry standard) |
| 140 | |
| 141 | |
| 142 | |
| 143 | ## 6. Asset Organization |
| 144 | |
| 145 | ### Naming Convention |
| 146 | |
| 147 | |
| 148 | [type]_[object]_[variant]_[state].[ext] |
| 149 | |
| 150 | Examples: |
| 151 | spr_player_idle_01.png |
| 152 | tex_stone_wall_normal.png |
| 153 | mesh_tree_oak_lod2.fbx |
| 154 | |
| 155 | |
| 156 | ### Folder Structure Principle |
| 157 | |
| 158 | |
| 159 | assets/ |
| 160 | ├── characters/ |
| 161 | │ ├── player/ |
| 162 | │ └── enemies/ |
| 163 | ├── environment/ |
| 164 | │ ├── props/ |
| 165 | │ └── tiles/ |
| 166 | ├── ui/ |
| 167 | ├── effects/ |
| 168 | └── audio/ |
| 169 | |
| 170 | |
| 171 | |
| 172 | |
| 173 | ## 7. Anti-Patterns |
| 174 | |
| 175 | | Don't | Do | |
| 176 | |-------|-----| |
| 177 | | Mix art styles randomly | Define and follow style guide | |
| 178 | | Work at final resolution only | Create at source resolution | |
| 179 | | Ignore silhouette readability | Test at gameplay distance | |
| 180 | | Over-detail background | Focus detail on player area | |
| 181 | | Skip color testing | Test on target display | |
| 182 | |
| 183 | |
| 184 | |
| 185 | > **Remember:** Art serves gameplay. If it doesn't help the player, it's decoration. |
| 186 |
Discussion
Browse more free Claude skills.