ショート動画で話題のぴったり止めるゲームを作ろう！クミタテ式プログラミングドリル(p5JavaScript / Processing)

-チラ見せの強さ

今回作るのはぴったり止めるだけのゲームです。
動画ゲームとして利用され、TicTokやYouTubeなどで話題になっています。
面白さのポイントはやはりチラ見せでしょう。チラ見せさせることで、「どうなるんだろう？」というプレイヤーの好奇心を掻き立てます。
これ以上ないシンプルさでありながら、動画でゲームができるという非常に秀逸なゲームデザインになっています。
動画でのゲームですが、ここでは擬似的に通常のゲームとして実装します。それに、実行画面を動画で撮影することで動画ゲームにも応用が効きます。

デモアプリはこちらから。https://openprocessing.org/sketch/1561297
ショート動画はこちら。https://youtube.com/shorts/9eqs4M7u7Oc?feature=share

- クミタテ式プログラミングドリルとは？

クミタテ式は英語のコードを、日本語で書かれた図解（通称、図解くん）を使って解説し、プラモデルのように図解通りにコードを組み立てていきながら学習する、プログラミング教材です。
プログラミング的思考を学ぶよりも、コードの書き方を優先的に学習することを目的としています。

OpenProcessing基本コードの図解くん

- 動画を見ながら学習する

動画と並行しながら学習するとより効率的に学習できるようになっています。
たくさんのゲームジャンルのプログラミング方法をお伝えしているのでチャンネル登録もよろしくお願いします。

- 開発環境

OpenProcessingを使ったp5js、Processingを環境を前提としています。

---

■[ここからスタート！]画面のサイズを決める

画面サイズを600x400の固定サイズにしましょう。

---

■背景を黄色で塗りつぶし続ける

drawの中で背景を黄色で塗りつぶし続けましょう。drawの中で毎回背景を塗りつぶすことでアニメーションが実現できます。

---

■円を1つ表示する

プレイヤーとなる円を1つ、(300, 100)の固定の位置に表示します。

---

■変数を使ってプレイヤーを表示する

プレイヤーを動かすにあたって、プレイヤーの位置情報、座標を変数で管理する必要があります。

---

■プレイヤーを動かす

プレイヤーを下の方向に動かしてみましょう。

---

■後半は有料になりました。

後半ではテキストの他、後半動画を掲載しています。