Story about implementation of small game based on KiwiJS and graphics from Enigma game. Exploring technologies like Angular2 and Visual Studio. Explained game mechanics included in the game.

1. Story behind PF 2016
Juraj Michálek
Y Soft - Brno
10.2. 2016

2. PF 2010
http://georgik.sinusgear.com/2009/12/26/pf-2010/

3. PF 2011
http://georgik.sinusgear.com/2010/12/23/pf2011/

4. PF 2012
HTML5 Canvas
http://georgik.sinusgear.com/2011/12/31/pf-2012/

5. PF 2013
Webfonts
http://georgik.sinusgear.com/2012/12/22/pf-2013/

6. PF 2014
Phonegap
http://georgik.sinusgear.com/2013/12/28/pf-2014/

7. PF 2015
http://www.ysofters.com/2014/12/30/pf2015/

8. PF 2016
http://www.ysofters.com/2015/12/30/pf-2016/
https://github.com/ysoftdevs/pf2016

9. Constraints
Limited time to deliver final product (end of year)
Many interruptions
Only small chunks of time available

10. Creative process
Start with idea

11. Creative process
Start with idea
Try to implement

12. Creative process
Start with idea
Try to implement
Capture idea along
the way

13. Creative process
Start with idea
Try to implement
Capture idea along
the way
too long time
>1h

14. Creative process
Start with idea
Try to implement
Capture idea along
the way
too long time
Relax :-)
Take a break

15. Creative process
Start with idea
Try to implement
Capture idea along
the way
too long time
Relax :-)
Take a break
How do you feel?
Nah...

16. Creative process
Start with idea
Try to implement
Capture idea along
the way
too long time
Relax :-)
Take a break
How do you feel?
Nah...
Prioritize

17. Creative process
Start with idea
Try to implement
Capture idea along
the way
too long time
Relax :-)
Take a break
How do you feel?
Nah...
Prioritize

20. Hexagonal grids
http://www.redblobgames.com/grids/hexagons/

21. Reuse graphics from Wesnoth

22. Troubles - with graphic
Graphic is not limited just to tile.
Tile graphic is changing based on context.

23. Troubles - with Angular.io
Missing features
Work in progress
Simple HTML stuff is too complex
New architecture, different principles

24. Experience with TypeScript
Relatively fast (still takes some time to compile)
Compiler could watch directory for changes.
But…
Cloud C9.io significant deplay - 2-5 seconds
Structure and type system is great for libraries, but it
slows down hacking ;-)

25. Feeling?
Combination Angular2 + Hexagon + Adaptive graphics + TypeScript
Like driving with hand brake...

26. Nah...
Start with idea
Try to implement
too long time
Relax :-)
Take a break
How do you feel?
Nah...

27. Kiwi.JS
Like a Wordpress for building games :)

29. Kiwi.JS written in TypeScript
You can code in TypeScript
or in JavaScript

30. Do you remember? PF 2010 - Flixel physics engine
2015 physics ported to Kiwi.JS

31. Inspiration - Enigma open source game

32. Tiled Map Editor
http://www.mapeditor.org

33. JSON format of map

34. Spritesheet - support in Kiwi.JS

35. Edit sprites - GIMP configuration

36. Game mechanics

37. Progress
Let user know that he’s moving forward
He should peceive the goal as
achievable.

38. Guidance
Provide instructions.
Not everything is clear to new player.
Simple and quick.

39. Progressive disclosure
Start with basic stuff
Then show more stuff to user
Do not overload user

40. Graceful failure
Penalty for failure should not be too high.
Failure should be source for learning, not for damnation
Try to avoid pattern with loosing life. It could be very stressful.

41. Surprise
New element or rule can bring positive surprise.
E.g. teleport

42. Google Analytics Live view

43. Google Analytics

44. Troubles?
Storage plugin was not working on iPhone
- result: resetting lock on levels
NTB with touch displays were not able to process mouse event
- Kiwi switched automatically only to touch resource
- https://github.com/gamelab/kiwi.js/issues/230

45. Want to learn more about mechanics?
Some books and video trainings are available also on Safari
Gabe
Zichermann

46. Want to learn about yourself? ;-)
http://www.gamerdna.com/quizzes/bartle-test-of-gamer-psychology

47. Summary