Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Ogdc 2013 spine anim20131

436 views

Published on

Published in: Technology, Business
  • Be the first to comment

Ogdc 2013 spine anim20131

  1. 1. Awesome 2D game animations with Spine ALVISS HA Lead Designer, VINOVA Pte. Ltd alviss@vinova.sg
  2. 2. “Here comes the greatest creative beast Let’s tame it, my brave warriors!!!”
  3. 3. Anime studio 9 “A precious 2D animation charm we’ve mastered thousand years ago In combat, it generates frame-based animation”
  4. 4. Train, team needs to train Here, my warriors, practice with these cute monsters You gotta be Kidding me
  5. 5. 1st game: Gasboy
  6. 6. Gasboy Animations • 1 character • 1 animation • 15 frames • Size on disk: 90KB
  7. 7. 2nd Game: God’s Rage
  8. 8. God’s Rage Animations • 1 character • 17 animations • 402 frames • Size on disk: 1.3MB Happy with frame-based animation
  9. 9. Dozen of characters, smooth animations
  10. 10. BOSSes EAT Too much disk & RAM!
  11. 11. “One boss and we’re starving already. Frame-based animation won’t make it” Bosses EAT Too much disk & RAM!
  12. 12. Frame-based animation vs Modular animation • “Old-time” technique • Easy to produce • Inflexible – Changes require recompile – Take more space as animation gets more complex • Expensive trick used in 2D games with bigger budgets • Flexible – Animations compiled as plain text – Smooth animation with little disk usage • No public tool for 2D games yet :(
  13. 13. “Spine, We’ve been watching you” “Your Majesty, the charm named Spine by Nathan Sweet got ready to produce 2D skeletal animations for game which is modular animation bonus programmable ability”
  14. 14. Spine does one thing and does it perfectly Feature Spine Anime Studio Flash Easy to master v Separate Rotate, Translate, Scale v v Key-framing at bone level v Interpolation curve v v Import PSD layers v v Work with Vector image v v Inverse Kinematics (planed ) v v
  15. 15. Animators love it! Interpolation curveBone-level key-framing Great key-framing system Clean, elegant UI
  16. 16. JSO N 1 2 3 4 5 6 workflow
  17. 17. but, does it solve the proble m of storage & memory usage
  18. 18. Yes, it does! FRAME-BASED animation SPINE animation Smoother animation with half storage & memory usage! 700KB on disk 2.5MB on RAM 300KB on disk 1.2MB on RAM
  19. 19. Oh, it’s also FLEXIBLE & PROGRAM MABLE
  20. 20. FLEXIBLE: Run-time auto-generated animation transition Without transition With transition
  21. 21. Programmable: animation procedural Captured from project http://github.com/EsotericSoftware/spine-workshop
  22. 22. Programmable: Combine with physic engine
  23. 23. Cool! But here comes the trade off
  24. 24. Need more computation at run-time Benchmark: display a walking character multiple times on screen • Environment: XCode 4.5, cocos2d-x 2.1.2 • Device: iPhone 4S running iOS 6
  25. 25. Need more computation at run-time 0 50 100 150 200 250 300 25 50 75 100 125 150 175 200 Framepersecond(FPS) Number of characters on screen Frame-based animation Skeletal-based animation 60FPS
  26. 26. Doesn’t replace frame-based animation • Spine is great 2D skeletal animation tool • Flexible, programmable, smooth & small • But need more computation at run-time Should use both animation methods in game
  27. 27. Should use both animation methods in game Frame-based animation for small characters Skeletal-based animation for huge characters and/or those need detailed, complex animations
  28. 28. Thank you It’s Q/A time ;) info@vinova.sg
  29. 29. Why choose spine over spriter? • Right tool: – Slicker & friendlier GUI – Export format: JSON (Spine) vs XML (Spriter) – Interpolation curve • Right time: – Spine app works great when we try it out (March 2013) – Usable cocos2d-x runtime right when we needed it (April 2013) • Right team: – Nathan Sweet is also the author of libGDX – Fast development: • Spine started 1 year later (early 2013 vs early 2012) • But ecome usable sooner, support more platforms faster: cocos2d-x, cocos2d-iPhone, Unity, libGDX, Starling, XNA, Flash… – Open to the community: very fast pull-request merging cycle (within hours)

×