Juice up your game feel!

1,448 views
1,345 views

Published on

Simon explains how to add more feel to your game.

Published in: Entertainment & Humor
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,448
On SlideShare
0
From Embeds
0
Number of Embeds
838
Actions
Shares
0
Downloads
7
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Juice up your game feel!

  1. 1. Juice up your game feel Simon Weis Definitions Motivation Juice up your game feel Indie Outpost Juice up your Game Feel Music and SoundFX Simple pallets Know Your Math Foundations Simon Weis Tweening and Easing Shakes Flashes SpriteFX Particles February 13, 2014 Conclusion
  2. 2. Juice up your game feel Definitions Simon Weis Game Feel Definitions 1 Motivation Steve Swink : Game feel is real-time control of objects in a simulated space with interactions emphasized by polish. Juice up your Game Feel Music and SoundFX Simple pallets Know Your Math Foundations Tweening and Easing Shakes juicy Flashes SpriteFX 2 Martin Jonasson : Juicy things are things that wobble, squirt, bounce or make little cute noises. The things that make the game feel good to interact with. 1 Steve Swink. Game Feel, A gamer’s guide to virtual sensation. Elsevier, 2009 2 Martin Jonasson and Petri Purho. Youtube – juice it or loose it, 2012. http://www.youtube.com/watch?v=Fy0aCDmgnxg Particles Conclusion
  3. 3. Motivation Juice up your game feel Simon Weis Definitions Motivation Juice up your Game Feel Music and SoundFX How to create game feel and juicy objects? Simple pallets Know Your Math Exceeding pure functionality For any kind of game/style/genre/platform Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion
  4. 4. Motivation Juice up your game feel Simon Weis Definitions Motivation Juice up your Game Feel Music and SoundFX How to create game feel and juicy objects? Simple pallets Know Your Math Exceeding pure functionality Foundations Tweening and Easing For any kind of game/style/genre/platform Shakes Ready to use for everyone3 SpriteFX Flashes Particles Conclusion 3 Ok, almost. This talk is aiming for the one person indie gamedev studio
  5. 5. Music and SoundFX Juice up your game feel Simon Weis Definitions Motivation Juice up your Game Feel Music and SoundFX This is so important. Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion
  6. 6. Music and SoundFX Juice up your game feel Simon Weis Definitions Motivation Juice up your Game Feel Music and SoundFX This is so important. Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles SoundFX make your interactions feel real. Conclusion
  7. 7. Music and SoundFX Juice up your game feel Simon Weis Definitions Motivation Juice up your Game Feel Music and SoundFX This is so important. Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles SoundFX make your interactions feel real. Music conveys style, mood, spirit, feelings, . . . Conclusion
  8. 8. Music and SoundFX Juice up your game feel Simon Weis Definitions Motivation Juice up your Game Feel Music and SoundFX There are no excuses Simple pallets Know Your Math Easy to implement Foundations Tweening and Easing Shakes Almost no computational costs Flashes SpriteFX Feasible for everyone. It’s click and listen. Particles Conclusion
  9. 9. Juice up your game feel Music and SoundFX Simon Weis Definitions Motivation Juice up your Game Feel Tools of the trade Music and SoundFX SoundFX: SFXR4 , BFXR5 , Oscillators, . . . Simple pallets Know Your Math 6 7 Music: ProTools, Cubase, Audacity , LMMS , WolframTones8 , AudioSauna9 . . . Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion 4 Sfxr – simple sound effects generator, 2014. http://www.drpetter.se/project_sfxr.html 5 Bfxr, 2014. http://www.bfxr.net/ 6 Audacity, 2014. http://audacity.sourceforge.net/?lang=de 7 Lmms – linux multimedia studio, 2014. http://lmms.sourceforge.net/ 8 Wolframtones, 2014. http://tones.wolfram.com/ 9 Audiosauna – free software for making songs online, 2014. http://www.audiosauna.com/
  10. 10. Simple pallets Juice up your game feel Simon Weis Definitions Use just two or three colors . . . Motivation Juice up your Game Feel Music and SoundFX Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion 10 Wikipedia, 2014. http://www.de.wikipedia.org[Johannes Itten]
  11. 11. Simple pallets Juice up your game feel Simon Weis Definitions Use just two or three colors . . . Motivation Or a single color gradient . . . Juice up your Game Feel Music and SoundFX Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion 10 Wikipedia, 2014. http://www.de.wikipedia.org[Johannes Itten]
  12. 12. Simple pallets Juice up your game feel Simon Weis Definitions Use just two or three colors . . . Motivation Or a single color gradient . . . Juice up your Game Feel Or a subsection of the color circle10 Music and SoundFX Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion 10 Wikipedia, 2014. http://www.de.wikipedia.org[Johannes Itten]
  13. 13. Simple pallets Juice up your game feel Simon Weis Definitions Use just two or three colors . . . Motivation Or a single color gradient . . . Juice up your Game Feel Or a subsection of the color circle10 Music and SoundFX Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion Name some games doing this! 10 Wikipedia, 2014. http://www.de.wikipedia.org[Johannes Itten]
  14. 14. Simple pallets
  15. 15. Simple pallets
  16. 16. Simple pallets
  17. 17. Simple pallets
  18. 18. Simple pallets
  19. 19. Simple pallets
  20. 20. Simple pallets
  21. 21. Simple pallets Memorizable, unique Look Juice up your game feel Simon Weis Definitions Motivation Juice up your Game Feel Music and SoundFX Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion
  22. 22. Simple pallets Memorizable, unique Look Create a certain mood Juice up your game feel Simon Weis Definitions Motivation Juice up your Game Feel Music and SoundFX Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion
  23. 23. Simple pallets Juice up your game feel Simon Weis Definitions Motivation Tools of the trade Juice up your Game Feel Music and SoundFX Simple pallets ColorBlender11 Share your pallets12 Color Lovers13 Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion 11 Color blender, 2014. http://meyerweb.com/eric/tools/color-blend/ 12 tigsource – share your pallets, 2014. http://forums.tigsource.com/index.php?topic=25396.0 13 Colorlovers, 2014. http://www.colourlovers.com/palettes
  24. 24. Know your math Juice up your game feel Simon Weis Definitions Motivation Juice up your Game Feel Music and SoundFX Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion
  25. 25. Know your math It’s not that hard – Math is like dancing Juice up your game feel Simon Weis Definitions Motivation Juice up your Game Feel Music and SoundFX Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion
  26. 26. Tweening and Easing Juice up your game feel Simon Weis Definitions Motivation Term „in between“ Interpolation from 0 to 1 Robert Penner’s easing functions14 for JavaScript, ActionScript 1, 2, 3 , Java, Lua, C#, C++ Codepen equations for organic motion15 Juice up your Game Feel Music and SoundFX Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion 14 Robert penner’s easing functions – a collection of swappable functions that add flavor to motion, 2014. http://www.robertpenner.com/easing/ 15 Codepen – organic motions, 2014. http://codepen.io/soulwire/pen/kqHxB
  27. 27. Tweening and Easing Juice up your game feel Simon Weis Definitions Motivation Juice up your Game Feel Music and SoundFX Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion
  28. 28. Tweening and Easing Juice up your game feel Simon Weis Definitions Motivation Juice up your Game Feel Music and SoundFX Tween . . . Positions and velocities (mimic physics) Scaling Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Timing Behaviour Particles Conclusion
  29. 29. Juice up your game feel Shakes Simon Weis Definitions Motivation Game objects, camera Juice up your Game Feel Random or Drag Positions Music and SoundFX Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX y y x Feeling of impact and weight. Particles x Conclusion
  30. 30. Flashes Juice up your game feel Simon Weis Definitions Motivation Juice up your Game Feel Music and SoundFX Simple pallets Flash into a color/back to original color Game objects, whole screen, background (for contrast) Timing behaviour ⇒ tweening functions Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion
  31. 31. SpriteFX Juice up your game feel Simon Weis Definitions Motivation Sprites that serve as overlays or underlays for any graphical effect Juice up your Game Feel Music and SoundFX Simple pallets Combine with easing functions Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion
  32. 32. SpriteFX Juice up your game feel Simon Weis Definitions Motivation Sprites that serve as overlays or underlays for any graphical effect Juice up your Game Feel Music and SoundFX Simple pallets Combine with easing functions Know Your Math Foundations Linear – Look at that sky! Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion
  33. 33. SpriteFX Juice up your game feel Simon Weis Definitions Motivation Sprites that serve as overlays or underlays for any graphical effect Juice up your Game Feel Music and SoundFX Simple pallets Combine with easing functions Know Your Math Foundations Linear – Look at that sky! Radial – neon lamp Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion
  34. 34. SpriteFX Juice up your game feel Simon Weis Definitions Motivation Sprites that serve as overlays or underlays for any graphical effect Juice up your Game Feel Music and SoundFX Simple pallets Combine with easing functions Know Your Math Foundations Linear – Look at that sky! Radial – neon lamp Vignette & vintage Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion
  35. 35. SpriteFX Juice up your game feel Simon Weis Definitions Motivation Sprites that serve as overlays or underlays for any graphical effect Juice up your Game Feel Music and SoundFX Simple pallets Combine with easing functions Know Your Math Foundations Linear – Look at that sky! Radial – neon lamp Vignette & vintage Scanlines – retro Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion
  36. 36. SpriteFX Juice up your game feel Simon Weis Definitions Motivation Sprites that serve as overlays or underlays for any graphical effect Juice up your Game Feel Music and SoundFX Simple pallets Combine with easing functions Know Your Math Foundations Linear – Look at that sky! Radial – neon lamp Vignette & vintage Scanlines – retro Change the Draworder Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion
  37. 37. Particles Juice up your game feel Simon Weis Definitions One just can not have too many particles. Motivation Juice up your Game Feel Music and SoundFX Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion
  38. 38. Juice up your game feel Particles Simon Weis Definitions Motivation No drawing skills required – simple shapes or SpriteFX Change/modulate color/alpha 16 Many References Juice up your Game Feel Music and SoundFX Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion 16 Wikipedia, 2014. http://www.de.wikipedia.org[Partikelsystem] Daniel Shiffman. The Nature of Code. Magic Book Project, 2012 www.di.ubi.pt. Video game technologies – particle systems, 2014. http://www.di.ubi.pt/~agomes/tjv/teoricas/09-particles.pdf Daniel Church. Gamedevtuts – make your game pop with particle effects and quadtrees, 2014. http://gamedevelopment.tutsplus.com/tutorials/ make-your-game-pop-with-particle-effects-and-quadtrees--gamedev-2138 Mike McClelland. Gamedev.net – make a particle explosion effect, 2014. http://www.gamedev.net/page/resources/_/creative/visual-arts/ make-a-particle-explosion-effect-r2701
  39. 39. Particles – Physical Background and Code Juice up your game feel Simon Weis Movement – Newton-equations Definitions Motivation F =m·a Juice up your Game Feel t1 v= x= t0 t1 t0 a dt = a · t + v 0 Music and SoundFX Simple pallets Know Your Math Foundations 2 v dt = 1/2a · t + v 0 · t + x 0 Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion
  40. 40. Particles – Physical Background and Code Juice up your game feel Simon Weis Movement – Newton-equations Definitions Motivation F =m·a Juice up your Game Feel t1 v= x= t0 t1 t0 a dt = a · t + v 0 Music and SoundFX Simple pallets Know Your Math Foundations 2 v dt = 1/2a · t + v 0 · t + x 0 Tweening and Easing Shakes Flashes SpriteFX Stokes friction Particles F r = −6πr ηv = R · v Conclusion
  41. 41. Particles – Physical Background and Code Juice up your game feel Simon Weis Movement – Newton-equations Definitions Motivation F =m·a Juice up your Game Feel t1 v= x= t0 t1 t0 a dt = a · t + v 0 Music and SoundFX Simple pallets Know Your Math Foundations 2 v dt = 1/2a · t + v 0 · t + x 0 Tweening and Easing Shakes Flashes SpriteFX Stokes friction Particles F r = −6πr ηv = R · v Does this make sense to you? v = ( v * R + a * dt ) ; x = x + v * dt ; Conclusion
  42. 42. Particles Juice up your game feel Simon Weis Definitions Motivation Some possible applications: Juice up your Game Feel Music and SoundFX smoke, sparks, weather, wind, raindrops and rainspalesh, snow, flashes, clouds in the sky, bullets, fire, stars, explosions, fluids, falling leaves, lasers, bullet time trails, fog, sunrays, rocket exhaust, water, flying birds, bouncing balls, desintegrating asteroids, grass, mist and smoke, spell-Effects, even hair and feathers and many other effects Simple pallets Know Your Math Foundations Tweening and Easing Shakes Flashes SpriteFX Particles Conclusion
  43. 43. Juice up your game feel Conclusion Simon Weis Definitions Motivation Juice up your Game Feel Music and SoundFX Simple pallets Know Your Math Foundations Tweening and Easing Compare! Shakes Flashes SpriteFX Particles Conclusion
  44. 44. Game Over
  45. 45. References I Juice up your game feel Simon Weis Audacity, 2014. http://audacity.sourceforge.net/?lang=de. Audiosauna – free software for making songs online, 2014. http://www.audiosauna.com/. Bfxr, 2014. http://www.bfxr.net/. Codepen – organic motions, 2014. http://codepen.io/soulwire/pen/kqHxB. Color blender, 2014. http://meyerweb.com/eric/tools/color-blend/. Colorlovers, 2014. http://www.colourlovers.com/palettes. Lmms – linux multimedia studio, 2014. http://lmms.sourceforge.net/. Robert penner’s easing functions – a collection of swappable functions that add flavor to motion, 2014. http://www.robertpenner.com/easing/. Sfxr – simple sound effects generator, 2014. http://www.drpetter.se/project_sfxr.html. tigsource – share your pallets, 2014. http://forums.tigsource.com/index.php?topic=25396.0.
  46. 46. References II Juice up your game feel Simon Weis Wikipedia, 2014. http://www.de.wikipedia.org. Wolframtones, 2014. http://tones.wolfram.com/. Daniel Church. Gamedevtuts – make your game pop with particle effects and quadtrees, 2014. http://gamedevelopment.tutsplus.com/tutorials/ make-your-game-pop-with-particle-effects-and-quadtrees--gamedev-2138. Martin Jonasson and Petri Purho. Youtube – juice it or loose it, 2012. http://www.youtube.com/watch?v=Fy0aCDmgnxg. Mike McClelland. Gamedev.net – make a particle explosion effect, 2014. http://www.gamedev.net/page/resources/_/creative/visual-arts/ make-a-particle-explosion-effect-r2701. Daniel Shiffman. The Nature of Code. Magic Book Project, 2012. Steve Swink. Game Feel, A gamer’s guide to virtual sensation. Elsevier, 2009. www.di.ubi.pt. Video game technologies – particle systems, 2014. http://www.di.ubi.pt/~agomes/tjv/teoricas/09-particles.pdf.

×