Makecode arcade はいかがですか?

この講座は何なのか?

「ゲームを作ってみたいなー」
「作るのむずかしそう」
「ゲーム作りって大変だよね。無理」

と思っている人々に、ゲームプログラミングを面白さを広めたいと思っています。
しかも「プログラミングって知らないよ」という未経験な方にも広めたい。

そんな訳で、誰でもできると思うような題材で学習していきます。

 

開発には Microsoft MakeCode Arcade(メイクコード アーケード)を使います。
初心者向けに作られているので、プログラミング初体験でも大丈夫です。

はじめは小さなゲームを作りながら学習します。
プログラミングができればゲームが作れる、という訳ではありません。
プログラミングのための脳とゲーム制作のための脳が必要になります。
この講座ではこの2つを同時に鍛えていきます。
(なんて欲張りなんだ…)

 

学習に大切なこと

2つあります。

実際に入力して、実行しましょう

初心者が楽譜だけをみてピアノが上達しないように、説明を読むだけではプログラミングスキルは身につきません。
自分で動かす(体験する)ことが大切です。

さらに、説明を読みながら「ここを変更したらどうなる?」という感じに、いろいろ試しながら進めるとベストです。

 

分からないことは検索しよう

学生のときのように、しっかり記憶する必要はありません。
忘れたり、分からないことは検索すればいいんです。
どちらかと言えば検索する習慣をしっかりつけましょう。
覚えているやり方よりも、簡単で便利な方法がスタンダードになっているかもしれません。
情報の更新が早い業界ですから、検索しながら新しい情報を取り込んでいきましょう。

 

MakeCode Arcade をやってみよう

MakeCode Arcade はブラウザがあれば使えます。
初心者にありがちな環境構築でつまづくこともありません。
基本、オンライン(ネットに接続した状態)で行います。
(オフラインで使う場合、オフラインアプリをダウンロードする必要があります)

それでは下のリンクをクリックしてサイトを開きましょう。
MakeCode Arcade 公式サイト

 

次のようなページが表示されます。

MakeCodeArcade公式サイト

 

もし、すべて英語で表示されているなら日本語に設定しましょう。
ページの右上にある歯車アイコンをクリックし、Language をクリックします。

Languageの変更をする

 

日本語をクリックします。

Languageを日本語に設定する

これで日本語になります。しかし、すべて対応していません。
チュートリアルは英語の部分も多く、正しく翻訳されていないこともあります。

 

新しいプロジェクトを作成しよう

いきなりですがゲームを作りましょう。
アカウント登録もせずゲーム制作が始められるのは MakeCodeArcade の良いところです。
(アカウントの話はまた後でします)

それでは 新しいプロジェクト と書かれたボタンをクリックします。

新しいプロジェクトを作る

 

プロジェクトの名前を入力します。ここでは「りんご狩り」にしました。
そして、作成ボタンをクリックします。

プロジェクトの名前を付ける

 

次のようなエディタ画面が開きます。

MakeCodeArcadeのエディタ画面

ここでゲームを作っていきます。

 

スプライトを用意しよう

下の画像を見ながら作業してください。
まず スプライト をクリックします。
いくつものブロックが表示されます。黄色い枠で囲ったブロックをドラッグします。

スプライトのブロックをドラッグする

 

はじめの画面に戻ったら 最初だけ ブロックにはめ込みます。

最初だけブロックにはめ込む

 

スプライトの文字の横のマスをクリックします。
するとスプライトエディタが開きます。

スプライトエディタを開く

 

ここでは好きな絵を描くことができます。
しかし、今回は用意された絵を使います。ギャラリータブをクリックしましょう。
この中からアヒルを探してクリックしてください。

ギャラリーから絵を選ぶ

 

エディタに戻ったら右下にある完了をクリックします。

エディタに戻ったら完了をクリック

 

はじめの画面に戻るとクリックしたマスの中にアヒルが表示されます。
ここまでの作業で、スプライトとして使う絵を用意したことになります。

スプライトの絵を決めた状態

ちなみにスプライトとは、キャラクタ(画像)を表示(操作)する機能のことです。
他の絵に影響されずに自由に動かすことができて、エフェクトを付けたりすることも可能です。

 

背景色を変更しよう

背景色を変えたいと思います。
まず シーン をクリックしてください。

そして 背景色を に設定ブロックをドラッグします。

背景色を変更する

 

はじめの画面に戻ったら 最初だけ にはめ込みます。

最初だけブロックにはめ込む

 

背景色を に設定マスをクリックしてください。色見本が表示されます。
そして好きな色をクリックします。ここでは緑を選びました。

背景色の色を変更する

 

クリックしたマスとシミュレーター画面を見てください。
選んだ色になっています。

背景色の色を変更する

シミュレーターの真ん中には、スプライトのアヒルも表示されていますね。

 

「あれ?シミュレーターの画面が表示されない」という場合はリセットしましょう。

シミュレーターのリセットボタン

リセットしても画面が表示されない時があります。その時は次の作業に進みましょう。
画面の表示に時間が掛かっている時はリセットすることを覚えておいてください。

 

プレイヤーキャラを操作しよう

スプライトのアヒルをプレイヤーキャラとして操作できるようにします。
まず コントローラー をクリックしてください。

そして mySprite をボタンで動かす をドラッグします。

mySprite をボタンで動かす

 

はじめの画面に戻ったら 最初だけ にはめ込みます。

mySpriteをボタンで動かすをはめ込む

 

これでシミュレーターの十字キーで操作できるようになりました。

シミュレーターの十字キーで操作

 

キーボードのカーソルキーや、WASDキーでも操作できます。
シミュレーターよりこちらの方が操作しやすいです。

カーソルキーやWASDキーでも操作可能

「あれ? 動かない」

という人はシミュレーターのパネルの色を確認してください。
パネルが薄暗くなっている(右側)と操作できません
マウスカーソルを載せたりタッチすれば、アクティブな状態(左側)になります。

シミュレーターのパネルがグレイだと操作不可

 

それから、操作中にキャラクターが画面外へ出てしまって戻せない時はリセットしましょう。
リセットボタンは2箇所ありますよ。

シミュレーターのリセットボタン

 

… 次回に続きます。

 

MakeCode Arcade

  1. MakeCodeはいかが
  2. りんご狩りゲーム
  3. りんご狩りゲーム(完)
  4. ピザを避けてゲーム
  5. ピザを避けて 2
  6. ピザを避けて(完)
  7. アカウント登録
  8. ケーキ早食いゲーム
  9. ケーキ早食い 2
  10. ケーキ早食い(完)
  11. 危険ドライブ
  12. 危険ドライブ 2
  13. 危険ドライブ(完)
  14. 15秒シューティング
  15. 15秒Shooting 2
  16. 15秒Shooting(完)
  17. ブロック崩し
  18. ブロック崩し 2
  19. ブロック崩し(完)
  20. ヘビキングを撃て
  21. ヘビキング(完)
  22. ちょびっと迷路
  23. ちょびっと迷路 2
  24. ちょびっと迷路(完)
  25. でんでんジャンプ
  26. でんでんJump 2
  27. でんでんJump(完)
  28. ミニダンジョン
  29. ミニダンジョン 2
  30. ミニダンジョン 3
  31. ミニダンジョン 4
  32. ミニダンジョン(完)