おうちで作ろう! オリジナル携帯型ゲーム...4 導入...

41
室蘭工業大学 地域共同研究開発センター おうちで作ろう! オリジナル携帯型ゲーム

Transcript of おうちで作ろう! オリジナル携帯型ゲーム...4 導入...

Page 1: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

室蘭工業大学 地域共同研究開発センター

おうちで作ろう!オリジナル携帯型ゲーム

Page 2: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/2

2

ロボットは・・・

ひとは・・・

コンピュータ

あたま

指示し じ

アクチュエータ

きんにく

動作ど う さ

ほね

機構き こ う

構造こうぞう

センサ

め・みみなど

感覚かんかく

バッテリ-など

たべもの

エネルギー源 げん

ロボットの基本要素

Page 3: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/3

導入

あらゆるものにコンピュータが搭載

Page 4: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/4

導入

コンピュータの動作にはプログラムが必要

プログラムとは

やってほしいことを書いた指示書

プログラミングとは

コンピュータがわかるように指示書を書くこと

Page 5: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/5

導入

micro:bit

C#include<stdio.h>

int main(void){

int a, b, tmp;

printf("a = ");

scanf("%d", &a);

printf("b = ");

scanf("%d", &b);

いろいろな書き方(言語)があります

機械語(6502 ファミコンCPU)

A9 0A 8D 00 50 …

Pythonimport math

def bisection_method(a, b, eps):

s = 0

for i in range(1000):

if(abs(a-b)<eps): break

s = (a+b)/2.0

if(f(s) * f(a)<0): b = s

else: a = s

return s

...

Page 6: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/6

導入

プログラミングで大切なこと

コンピュータがわかるように書く

なので、思った通りに動かないこともある

それでも、頑張って作るとできる(かも)

Page 7: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/7

導入

今日の流れ

1. プログラミングの準備

2. 基本的な使い方を学ぼう

3. ゲームを作ってみよう

Page 8: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/8

1.プログラミングの準備

ブラウザを起動

https://makecode.microbit.org/

micro:bitのページを開く

Page 9: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/9

1.プログラミングの準備

「micro:bit」と検索

micro:bitの公式サイトをクリック

検索してページを開く場合

Page 10: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/10

1.プログラミングの準備

micro:bitの公式ホームページのバージョンが、この説明書で使われているものと違う場合があります。

ご了承ください。

Page 11: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/11

1.プログラミングの準備

もし英語のみの画面になったら画面上部の「Language」をクリックして

日本語を選択してください

Page 12: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/12

1.プログラミングの準備

「Language」を日本語にするとこの画面になります

Page 13: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/13

1.プログラミングの準備

「プログラムしましょう」をクリックすると下の画面になる

Page 14: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/14

1.プログラミングの準備

画面を下にスクロールしていくと、MakeCodeエディターの

「プログラムしましょう」があるので、それをクリック

Page 15: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/15

1.プログラミングの準備

新しいプロジェクトをクリック

Page 16: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/16

1.プログラミングの準備

新しいプロジェクトをクリック

プロジェクトに名前をつけないままでOK

右下の作成をクリック

Page 17: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/17

1.プログラミングの準備

この画面になったら準備完了!

Page 18: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/18

2.使い方を学ぼう

micro:bitがどんな動きをするか確認する画面

プログラムブロックを選ぶ画面

画面の見かた

プログラムを組みたてる画面

Page 19: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/19

2.使い方を学ぼう

「基本」や「入力」を押すと、プログラムのブロックが出てくる

「高度なブロック」を押すと「関数」や「配列」が出てくる

ブロックの出し方

Page 20: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/20

2.使い方を学ぼう

使いたいブロックをクリックしたまま(ホールド)

ホールドしたまま右側に移動してはなす、もしくはブロックの上ではなす

クリックしたままマウスを移動させて目的の場所ではなすことを

「ドラッグ&ドロップ」といいます

ブロックプログラミングのやり方

Page 21: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/21

2.使い方を学ぼう

実際にプログラムを作って使い方を学んでみよう!

Page 22: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/22

2.使い方を学ぼう

micro:bitにハートを表示してみよう!

①「基本」をクリック

②『アイコンを表示』をクリックしたまま、プログラムを組み立てていく画面(右側)にマウスを移動

Page 23: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/23

2.使い方を学ぼう

③『ずっと』のブロックに重なる位置で『アイコンを表示』をはなすと

④ハートが表示される!

Page 24: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/24

2.使い方を学ぼう

micro:bitに作ったプログラムをインストールしよう!

Page 25: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/25

2.使い方を学ぼう

実際のmicro:bitにもハートを表示させてみよう!1

準備するもの・パソコン・USBケーブル(Type-A、MICRO Type-B)充電用ケーブルではデータの送信ができません。データの送受信が可能なものをご用意ください

・電池の入っていないmicro:bit

もしくは電池が入っていて電源がOFFの状態のmicro:bit

Page 26: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/26

2.使い方を学ぼう

実際のmicro:bitにもハートを表示させてみよう!2

電池が入っていないまたは

電池が入っていて電源がOFFの状態であることを確認しよう

電池が入っていて電源がONの状態でパソコンと接続すると、micro:bitが壊れてしまう可能性がある!

Page 27: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/27

2.使い方を学ぼう

実際のmicro:bitにもハートを表示させてみよう!3

①micro:bitとパソコンをUSBケーブルで接続しよう

差し込む向きに注意しよう!

Page 28: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/28

2.使い方を学ぼう

実際のmicro:bitにもハートを表示させてみよう!4

③左下の『ダウンロード』をクリック

④『フォルダを開く』をクリック

②micro:bitとパソコンをUSBケーブルで接続しよう

Page 29: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/29

2.使い方を学ぼう

実際のmicro:bitにもハートを表示させてみよう!4

⑤ダウンロードしたプログラムにカーソルを合わせて右クリック

⑥コピーを選んで左クリック

Page 30: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/30

2.使い方を学ぼう

実際のmicro:bitにもハートを表示させてみよう!5

⑦MICROBITを左クリックして開く

⑧適当な場所を右クリックし貼り付けを選ぶ

Page 31: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/31

2.使い方を学ぼう

右クリックでホールドしたまま『MICROBIT』の上ではなす

実際のmicro:bitにもハートを表示させてみよう!~別のやり方~

Page 32: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/32

2.使い方を学ぼう

スピーカーを取り付けよう

準備するもの

・micro:bit

・スピーカー

Page 33: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/33

2.使い方を学ぼう

遊ばないときは電池ボックスから電池を取っておこう!

Page 34: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/34

2.使い方を学ぼう

スピーカーを取り付けよう

右の写真のようにクリップをはさもう

スピーカーを使わないときや、音を出したくないときは取り外しておこう

Page 35: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/35

2.使い方を学ぼう

カバーを取り付けよう

準備するもの

・micro:bit

・カバー(前面、背面)

前面

背面

Page 36: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/36

2.使い方を学ぼう

カバーを取り付けよう

micro:bitのボタンが飛び出るようにしっかりはめ込む

前面パーツを写真のようにmicro:bitに取り付ける

Page 37: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/37

2.使い方を学ぼう

カバーを取り付けよう

裏返して背面パーツを下の写真のように

micro:bitに取り付ける

赤い丸で囲った場所どうしをはめ込む緑の四角で囲った場所どうしをはめ込む

Page 38: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/38

2.使い方を学ぼう

カバーを取り付けよう

完成!

Page 39: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/39

2.使い方を学ぼう

電池ボックスに取り付けよう

両面テープを電池ボックスの電源ボタンがある側に

貼り付けます

Page 40: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/40

2.使い方を学ぼう

電池ボックスに取り付けよう

カバーの裏に、電源ボタンが被らないように取り付けよう

Page 41: おうちで作ろう! オリジナル携帯型ゲーム...4 導入 コンピュータの動作にはプログラムが必要 プログラムとは やってほしいことを書いた

http://www.muroran-it.ac.jp/robot-arena/41

3.ゲームを作ってみよう

プログラミング例をもとにゲームを作ってみよう!