Setting up mesh deformations for 2D graphics in Spine

Our video game development company runs independent projects, jointly creates games with the client and provides additional operational services. Expertise of our team allows us to cover all gaming platforms and develop an amazing product that matches the customer’s vision and players preferences.
Showing 1 of 1 servicesAll 242 services
Setting up mesh deformations for 2D graphics in Spine
Medium
~3 business days
FAQ
Our competencies
What are the stages of Game Development?
Latest works
  • image_games_mortal_motors_495_0.webp
    Game development for Mortal Motors
    663
  • image_games_a_turnbased_strategy_game_set_in_a_fantasy_setting_with_fire_and_sword_603_0.webp
    A turn-based strategy game set in a fantasy setting, With Fire and Sword
    859
  • image_games_second_team_604_0.webp
    Game development for the company Second term
    490
  • image_games_phoenix_ii_606_0.webp
    3D animation - teaser for the game Phoenix 2.
    533

Spine 2D Mesh Deformation Setup

Mesh deformation in Spine is the difference between a "drawn puppet" and a "living character." Without deformation, clothing moves like rigid plastic, hair doesn't sway, capes don't react to running. With properly configured meshes the same set of sprites starts behaving organically — through vertex deformation bound to bones with smooth weights.

Mesh setup is the most time-consuming technical part of working in Spine, and most mistakes happen exactly here.

Types of deformation and when they're needed

Skinned mesh (bone binding). Mesh vertices bind to one or several bones through weights. As bone moves, vertices follow proportionally to weight. Used for: clothing, hair, tails, capes, any soft body elements.

Free-form mesh deformation (FFD). Deformation directly through key frames — mesh vertices move in animation without bone binding. Used for: face (mimicry through morph targets), non-standard deformations which bones won't reproduce.

Combination. Most complex characters use both: skeleton controls limb movement, FFD controls mimicry and additional organic detail.

Mesh density and performance

Main mistake when creating meshes — excessive density. More vertices means higher CPU load in runtime (Spine Runtime recalculates all vertex positions every frame). On mobile devices this is noticeable.

Practical density guidelines:

  • Simple deformation (clothing without folds, basic sway): 4–8 vertices sufficient
  • Medium deformation (cape with several folds, organic limbs): 12–20 vertices
  • Detailed deformation (face, complex clothing): 30–50 vertices maximum

Meshes with 100+ vertices per element usually excessive for game. Such density justified in prerendered animation, but not game runtime.

Triangulation. Spine automatically triangulates mesh from vertex set. Automatic triangulation not always optimal: long thin triangles create deformation artifacts. Manual vertex placement with even triangulation — better result. Spine allows adding internal edges for triangulation control.

Weight setup

Weight of each vertex shows how strongly it follows specific bone. Sum of all vertex weights = 1.0. Vertex with weight 1.0 to bone_A moves strictly with this bone. Vertex with 0.5/bone_A + 0.5/bone_B — exactly between them.

Spine weight brush. Tool works like in Blender — select bone, paint influence on mesh with radius and strength adjustment. For organic transitions (joints, neck, waist), weights should smoothly decrease from influence center to periphery.

Typical mistake: all cape vertices bound with weight 1.0 to one bone. Cape moves as monolithic slab, doesn't deform. Correct: upper part bound to spine bone, lower part to additional tip-bone with own animation, transition — smooth weight gradient.

Path constraint for hair and capes. For long hanging elements (tail, hair, multi-section cape), bone chain with Path Constraint creates needed dynamics. Path Constraint forces bones to follow along curve (Spine Path) animated through control points. Result — organic sway without physics, full animator control.

Inherit Transform and double-transform problem

Spine allows configuring Inherit Transform for each bone: whether to inherit rotation and scale from parent. For cape or hair bones often need inherit_rotation = false — so when body rotates cape doesn't rotate rigidly with it, stays gravity-oriented, responding only through Path Constraint or animation.

Wrong Inherit Transform setup — cause of "double transform": bone rotates twice, once through parent and again through own animation. Result — chaotic movement looking like bug, though just wrong checkbox setting.

Mesh deformation setup stages

  1. Asset analysis — which parts need deformation, deformation type
  2. Mesh creation — manual vertex placement with needed density
  3. Bone binding — creating additional bones for deformation (if needed)
  4. Weight painting — smooth gradients, movement test
  5. Path Constraints — for dynamic elements
  6. Runtime test — checking performance, correctness in engine
Scale Timeline
Simple character mesh deformation (2–3 deformable elements) 2–4 days
Full mesh setup for character with complex clothing 1–2 weeks
Mesh setup + deformation animation for entire character 3–5 weeks

Cost determined by number of deformable elements and character complexity.