tag:crieit.net,2005:https://crieit.net/tags/%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%9F%E3%83%B3%E3%82%B0%E3%82%BC%E3%83%9F/feed Crieitでタグ「プログラミングゼミ」に投稿された最近の記事 2020-07-06T22:05:59+09:00 https://crieit.net/tags/%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%9F%E3%83%B3%E3%82%B0%E3%82%BC%E3%83%9F/feed tag:crieit.net,2005:PublicArticle/15998 2020-07-06T22:04:15+09:00 2020-07-06T22:05:59+09:00 https://crieit.net/posts/216e681746a57304b56fe3279da1c06d <p>プログラミングゼミというスマホ、タブレット用のプログラミングで遊べるアプリがあります。</p> <p><a target="_blank" rel="nofollow noopener" href="https://programmingzemi.com/">https://programmingzemi.com/</a></p> <p><a href="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f031c8b555ed.png" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f031c8b555ed.png?mw=700" alt="" /></a></p> <p>子どもも簡単に操作でき、最初は練習用のクエストをクリアしながら使い方をおぼえていくため簡単にプログラミングを学ぶことが出来て面白いです。Scratchを参考にしていると思われます。</p> <p>今回はこれで簡単なまとあてゲームを実際に作ってみます。</p> <h2 id="キャラを配置"><a href="#%E3%82%AD%E3%83%A3%E3%83%A9%E3%82%92%E9%85%8D%E7%BD%AE">キャラを配置</a></h2> <p>まずはキャラを配置します。左のキャラ一覧からドラッグ＆ドロップで配置できます。自分で画像を用意することも出来ますが、今回は簡単に作るため、プリセットの画像をそのまま使っていきます。</p> <p><a href="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f031d4f94da3.png" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f031d4f94da3.png?mw=700" alt="" /></a></p> <p>左側のキャラが石を投げ、ドラゴンにぶつけて倒す、というゲームにします。</p> <h2 id="ドラゴンを動かす"><a href="#%E3%83%89%E3%83%A9%E3%82%B4%E3%83%B3%E3%82%92%E5%8B%95%E3%81%8B%E3%81%99">ドラゴンを動かす</a></h2> <p>まずはドラゴンを上下に動かします。左側のキャラ一覧からドラゴンを選択し、ドラゴンのプログラムを作っていきます。具体的にはこのようにします。</p> <p><a href="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f031e92ce8ff.png" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f031e92ce8ff.png?mw=700" alt="" /></a></p> <p>「↑をむく」というのは実際に画像を動かすわけではなく、処理上上を向かせます。これにより、「３すすむ」の部分で向いている方向に動かすことが出来ます。また、画面の端にぶつかった場合に反対を向かせることで、ドラゴンは右側で上下に移動し続けます。これで的は完成です。</p> <p>ちなみにちょっと待つというのは、次の処理フレームまで待つということです。こうしないと、ひたすらループで移動距離がプラスされるので描画を待つことなく一瞬で遠くへ行ってしまいます。</p> <h2 id="石を投げる"><a href="#%E7%9F%B3%E3%82%92%E6%8A%95%E3%81%92%E3%82%8B">石を投げる</a></h2> <p>次にキャラに石を投げさせます。下記のようなプログラムを作ります。</p> <p><a href="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f031f11e06b3.png" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f031f11e06b3.png?mw=700" alt="" /></a></p> <p>簡単ですね。しかし石は止まったままです。</p> <p><a href="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f032018613c8.png" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f032018613c8.png?mw=700" alt="" /></a></p> <p>ここでは石を呼び出すだけです。石の動きは石の設定で行います。なんとなくコンポーネント思考プログラム的な要素が伺えるので面白いです。一つの場所に大量のコードを書くわけではなく、各コンポーネントに分けて必要なプログラムを書くということが意識できます。</p> <h3 id="石を動かす"><a href="#%E7%9F%B3%E3%82%92%E5%8B%95%E3%81%8B%E3%81%99">石を動かす</a></h3> <p>石は召喚されたら右に動くだけです。</p> <p><a href="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f031dfe34563.png" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f031dfe34563.png?mw=700" alt="" /></a></p> <p>これで石を右に飛ばせるようになりました。</p> <p><a href="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f032048958a0.png" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f032048958a0.png?mw=700" alt="" /></a></p> <h2 id="ドラゴンを倒す"><a href="#%E3%83%89%E3%83%A9%E3%82%B4%E3%83%B3%E3%82%92%E5%80%92%E3%81%99">ドラゴンを倒す</a></h2> <p>最後に、石とドラゴンがぶつかったらドラゴンが消えるようにします。これはドラゴンに処理を追加します。</p> <p><a href="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f032092ab9dd.png" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f032092ab9dd.png?mw=700" alt="" /></a></p> <p>おうちへかえるという処理をいれることで消すことが出来ます。</p> <p><a href="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f0320b8b74ca.png" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/6e2af66c610d88bc766649f72032893a5f0320b8b74ca.png?mw=700" alt="" /></a></p> <p>無事にドラゴンを倒して世界を救えました。</p> <h2 id="まとめ"><a href="#%E3%81%BE%E3%81%A8%E3%82%81">まとめ</a></h2> <p>このように、恐らく小学生以上であればだれでも簡単にゲームを作ったりすることが出来ます。スマホアプリのため操作もしやすいです。また、大人がちょっとしたゲームを作ってあげて子どもに改造させて遊ばせてあげるというのも良い勉強になると思います。</p> <p>作ったゲームはインターネット上に公開してみんなに遊んでもらうことも出来ます。たくさんのゲームが公開されているためそれをみるだけでも面白いです。是非試してみて下さい。</p> <p>ちなみにクエストをクリアしていくことで命令が増えていきます。どんどんすすめると変数を使ったり条件を増やしたりしてできることが増えていきます（つまりある程度進めないと作れないものもあります）</p> だら@Crieit開発者