Upgrade to Pro — share decks privately, control downloads, hide ads and more …

20200708_おやこテックLT_MakeCodeで神隠し

 20200708_おやこテックLT_MakeCodeで神隠し

MakdeCode Arcadeで自作ゲームをつくってみました。

pentake

July 08, 2020
Tweet

More Decks by pentake

Other Decks in Programming

Transcript

  1. MakeCodeで神隠し

    View Slide

  2. ぺんたけ
    webエンジニア / デザイナーの狭間
    ⚙ Noodl / HTML / CSS / JavaScript
    Noodlコミュニティ運営 / Noodler
    Twitter:@pentake_de

    Qiita:@pentake


    View Slide

  3. MakeCode Arcade の紹介
    ‍ 実際につくってみた話
    STEAM教育に良さそうなツール!

    View Slide

  4.  オリジナルゲームをつくる...!? 

    View Slide

  5. つくってみたい!!

    View Slide

  6. 参加できず...

    View Slide

  7. 後日、一人ハンズオン。

    View Slide

  8. View Slide

  9. 懐かしい雰囲気...

    View Slide

  10. View Slide

  11. 英語

    View Slide

  12. Google Chromeの翻訳機能をありがたく使わせていただく

    View Slide

  13. View Slide

  14. View Slide

  15. View Slide

  16. View Slide

  17. View Slide

  18. 1時間くらいでシューティング
    ゲームが完成!

    View Slide

  19. 物足らない...

    もっとオリジナルな何かを作りたい...

    View Slide

  20. View Slide

  21. ❗❗

    View Slide

  22. 砂金だ!!!!!!
    さ きん

    View Slide

  23. View Slide

  24. View Slide

  25. View Slide

  26. 砂金を撒き散らすカオナシから
    逃げ続けるゲーム
    ルール
    15秒間、ライフがゼロにならなければ
    プレイヤー(アヒル)の勝ち!

    View Slide

  27. View Slide

  28. https://makecode.com/_cdYDaeDkWHe3
    (PCだと音が出ます)
    ↓ 遊んでみてね ↓

    View Slide

  29. つくったものをシェアしやすい!
    オリジナルのデザインがつくれる!楽しい!
    ブロックを組み合わせて数学的な論理を学べる!
    かつ(and)/ または(or)/ 否定(not)...
    MakeCode Arcade のココが良い!

    View Slide

  30. View Slide

  31. MakeCode Arcade のココが良い!
    JavaScript (TypeScript) で書ける
    Github連携できる

    アドバンス編

    View Slide

  32. ブロックに対応したJavaScript (TypeScript) での記述

    View Slide

  33. Google翻訳機能を使っていると
    コードも翻訳してしまうので注意!

    View Slide

  34. Githubと連携するとMakeCode Arcade画面から
    コミット&プッシュやプルができる

    View Slide

  35. 今後の日本語対応に期待!
     

    View Slide

  36. この夏はおやこで
    MakeCode Arcade

    View Slide

  37. View Slide