Game art skill

Game art principles.

by davila7·MIT license·★ 32,299 Stars on the repo·GitHub ↗

Use now

Files of Game art

davila7/main1 file shown
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---
2name: game-art
3description: Game art principles. Visual style selection, asset pipeline, animation workflow.
4allowed-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```
18What 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 
136Choose 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 
150Examples:
151spr_player_idle_01.png
152tex_stone_wall_normal.png
153mesh_tree_oak_lod2.fbx
154```
155 
156### Folder Structure Principle
157 
158```
159assets/
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