Slide 1

Slide 1 text

人工知能(AI)ってなに? こどもICT学級 キッズプログラミング塾

Slide 2

Slide 2 text

自己紹介 ੴڷ༞հ ISHIGO Yusuke 名古屋文理大学 Nagoya Bunri University -2011.3 岐阜県生活技術研究所 Gifu Pref. Research Institute for Human Life Technology -2012.3 情報科学芸術大学院大学[IAMAS] Institute of Advanced Media Arts and Sciences 2012.4- 公益財団法人ソフトピアジャパン SOFTOPIA JAPAN FOUNDATION -2017.3 日本総合ビジネス専門学校 Japan Professional Training College of Business 2017.4- 合同会社4D Pocket 4D Pocket LLC. 2017.4- 4D Pocket

Slide 3

Slide 3 text

人工知能とは? こんにちは

Slide 4

Slide 4 text

人工知能とは? こんにちは 人工知能はロボットのことじゃない

Slide 5

Slide 5 text

コンピュータを動かすには コンピュータはプログラミングしてあげないと何もできない ? プログラミング → 命令

Slide 6

Slide 6 text

コンピュータを動かすには コンピュータはプログラミングしてあげないと何もできない ! プログラミング → 命令 ボタンを押したら◯◯する

Slide 7

Slide 7 text

コンピュータを動かすには コンピュータはプログラミングしてあげないと何もできない !!! プログラミング → 命令 Aボタンを押したら◯◯する Bボタンを押したら◯◯する Cボタンを押したら◯◯する … 細かく指示を与えないといけない

Slide 8

Slide 8 text

コンピュータを動かすには コンピュータはプログラミングしてあげないと何もできない ? プログラミング → 命令 赤くて、 丸くて、 手のひらくらいのサイズで…

Slide 9

Slide 9 text

p5.js(ピーファイブ) グラフィカルなプログラムを簡単に作ることができる開発ツール https://editor.p5js.org/

Slide 10

Slide 10 text

p5.js(ピーファイブ) グラフィカルなプログラムを簡単に作ることができる開発ツール https://editor.p5js.org/ プログラムを書くところ プログラムの結果

Slide 11

Slide 11 text

プログラミングのルール function setup() { createCanvas(400, 400); } function draw() { background(220); } プログラミングの注意点 ・{}が処理のかたまりを表す ・大文字と小文字は区別される ・命令の後ろには「;」をつける

Slide 12

Slide 12 text

プログラミングのルール function setup() { createCanvas(400, 400); } function draw() { background(220); } setup → 最初に一度だけ実行される draw → 何度も呼び出される functionはイベントを表す

Slide 13

Slide 13 text

createCanvas(400, 400); 命令の書き方 命令の種類 内容1 (第1引数) 内容2 (第2引数) 画面幅 画面高さ 画面のサイズを決める 命令の最後には セミコロン 画面サイズを変えてみよう(例:幅→640、高さ→480)

Slide 14

Slide 14 text

プログラムの実行 クリックで実行する

Slide 15

Slide 15 text

変数 変数→データを入れるための箱 100 a = 100; a abc b = “abc”; b 文字列の場合は「”」もしくは「’」で囲う let a = 100; 箱を作る命令 (最初だけ)

Slide 16

Slide 16 text

変数を使ってみる 「w」という箱を作って、「640」を入れる 「h」という箱を作って、「480」を入れる w(640)とh(480)を使う

Slide 17

Slide 17 text

円を描いてみる 中心(幅と高さの半分の座標)に、幅300、高さ300の円を描く

Slide 18

Slide 18 text

円を描いてみる 枠線を消す

Slide 19

Slide 19 text

円を描いてみる クリックすると呼び出される 塗りつぶしの色を設定する fill(0, 0, 0); 塗りつぶしの色を設定する 赤(0〜255)、緑(0〜255)、青(0〜255) random(255) 0から指定した数までのランダムな数を作る 0〜255

Slide 20

Slide 20 text

音を鳴らしてみる https://bit.ly/38Cwdbx シンセサイザ(音を鳴らす機能)を用意する ド(C4)を8分音符の長さで鳴らす ド→C4 レ→D4 ミ→E4 ファ→F4 ソ→G4 ラ→A4 シ→B4 ド→C5 … …

Slide 21

Slide 21 text

Teachable Machine(ティーチャブルマシン) 人工知能を使って、かんたんにモノをコンピュータに覚えさせることができる https://teachablemachine.withgoogle.com/

Slide 22

Slide 22 text

Teachable Machine(ティーチャブルマシン) クリックする

Slide 23

Slide 23 text

Teachable Machine(ティーチャブルマシン) クリックする

Slide 24

Slide 24 text

Teachable Machine(ティーチャブルマシン) クリックする

Slide 25

Slide 25 text

Teachable Machine(ティーチャブルマシン) クリックしてBGMを録音する

Slide 26

Slide 26 text

Teachable Machine(ティーチャブルマシン) クリックする

Slide 27

Slide 27 text

Teachable Machine(ティーチャブルマシン) クリックする

Slide 28

Slide 28 text

Teachable Machine(ティーチャブルマシン) クリックして「ド」と言う

Slide 29

Slide 29 text

Teachable Machine(ティーチャブルマシン) クリックする 20以上作るまで録音を繰り返す

Slide 30

Slide 30 text

Teachable Machine(ティーチャブルマシン) 「ド」を入力する

Slide 31

Slide 31 text

Teachable Machine(ティーチャブルマシン) クラスを追加して「レ」を作る

Slide 32

Slide 32 text

Teachable Machine(ティーチャブルマシン) クリックする

Slide 33

Slide 33 text

Teachable Machine(ティーチャブルマシン) 「ド」「レ」を正しく認識するか 確認する

Slide 34

Slide 34 text

Teachable Machine(ティーチャブルマシン) クリックする

Slide 35

Slide 35 text

Teachable Machine(ティーチャブルマシン) クリックする

Slide 36

Slide 36 text

Teachable Machine(ティーチャブルマシン) クリックする

Slide 37

Slide 37 text

声を認識してみる https://bit.ly/35oY5Op 学習モデルを貼り付ける マイクで音声を取得する

Slide 38

Slide 38 text

声を認識してみる https://bit.ly/35oY5Op 「ド」を認識したとき 「レ」を認識したとき