$30 off During Our Annual Pro Sale. View Details »

Don’t just buy a new video game,
 make one! in JS!

yomotsu
November 21, 2014

Don’t just buy a new video game,
 make one! in JS!

at JSONC Asia 2014

yomotsu

November 21, 2014
Tweet

More Decks by yomotsu

Other Decks in Programming

Transcript

  1. 1
    Don’t just buy a new video game,

    make one! in JS!
    Presented by Akihiro Oyamada (@yomotsu)
    Frontend Engineer at PixelGrid, Inc.
    Nov 21, 2014

    View Slide

  2. 2
    Don’t just buy a new video game,

    make one! in JS!
    Presented by Akihiro Oyamada (@yomotsu)
    Frontend Engineer at PixelGrid, Inc.
    Nov 21, 2014

    View Slide

  3. 3
    Hello!

    from Japan
    Frontend Engineer
    at PixelGrid, Inc.
    @yomotsu

    View Slide

  4. 4

    View Slide

  5. 5

    View Slide

  6. How dose it work?
    Why do glitches appear?
    6

    View Slide

  7. I wanna make it!
    7

    View Slide

  8. 8
    https://yomotsu.github.io/walkthrough

    View Slide

  9. 9
    https://www.youtube.com/watch?v=ABPyWx8puzs
    in IE 11 with touch

    View Slide

  10. 10
    https://www.youtube.com/watch?v=xn8k0lEmKoU
    in Mobile Firefox
    on Android

    View Slide

  11. 11
    iPhone6 or
    iPhone5s /w iOS8

    View Slide

  12. 12
    https://www.youtube.com/watch?v=8qRwpHhD_hY

    View Slide

  13. http://goo.gl/xXOJNV
    13

    View Slide

  14. 14

    View Slide

  15. 15
    plus…
    a game collision lib I made

    View Slide

  16. 16
    while moving on a slope…

    View Slide

  17. 17
    Actual

    View Slide

  18. 18
    Expect

    View Slide

  19. 19
    http://0.0.0.0:8888/example/5_terrain.html

    View Slide

  20. 20
    https://github.com/yomotsu/threefield.js
    • Collision detection /w Octree
    • Height field via THREE.js mesh
    • Camera vs walls collistion

    View Slide

  21. video games are

    not just for fun
    21

    View Slide

  22. 22
    https://www.youtube.com/watch?v=6XvmhE1J9PY
    “Don’t just buy a new video game,

    make one”
    ʔ President Obama asks America to learn computer science

    View Slide

  23. Wanna make a game,

    in JS ?
    23

    View Slide

  24. 24
    Thank you!
    @yomotsu

    View Slide