Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
【子ども向けハンズオン】 ゲームで学ぼう、プログラミング!
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
Java女子部
October 29, 2017
Technology
880
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
【子ども向けハンズオン】 ゲームで学ぼう、プログラミング!
2017.10.29 @仙台IT文化祭
Java女子部
October 29, 2017
More Decks by Java女子部
See All by Java女子部
モダンJava再入門ハンズオン Java in Education For JUGs
javawomen
0
180
デザインパターン勉強会(Facade&Mediator)
javawomen
0
220
デザパタ勉強会!Bridgeパターン
javawomen
0
140
みんな大好きJava 8から9月リリースJava 17まで!最近のJava事情あれこれ / Java catch up from 8 to 17
javawomen
2
1.2k
お客様の中にJava女子部とお付き合いしてくださる方はいませんか?
javawomen
0
360
Java女子部について
javawomen
1
96
Other Decks in Technology
See All in Technology
[AWS Summit Japan 2026]迷っているあなたへ_小さな一歩が、やがて自分を助けてくれる
sh_fk2
1
200
iAEONの段階的リアーキテクト戦略 / iAEON's_Gradual_Re-architecture_Strategy
aeonpeople
0
230
OTel × Datadog で 「AI活用」を計測し、改善に繋げる
shihochan
2
450
FPGAの開発コンペでZephyrを使ってみた
iotengineer22
0
150
就職⽀援サービスにおけるキャリアアドバイザーのシフトスケジューリング
recruitengineers
PRO
1
150
2026TECHFRESH畢業分享會 - 葬送的通靈師:化系統與用戶雜訊成行動訊號
line_developers_tw
PRO
0
1.3k
Oracle AI Database@Azure:サービス概要のご紹介
oracle4engineer
PRO
6
2k
Claude Codeをどのように キャッチアップしているか
oikon48
13
8.6k
Oracle AI Database@Google Cloud:サービス概要のご紹介
oracle4engineer
PRO
6
1.6k
現地で盛り上がった WWDC26 Keynote
zozotech
PRO
1
270
小さく始める AI 活用推進 ― 日経電子版 Web チームの事例/nikkei-tech-talk47
nikkei_engineer_recruiting
0
310
AI時代のコスト管理を考えよう〜明日から使える実践AWSノウハウ~
yoshimi0227
0
340
Featured
See All Featured
Code Reviewing Like a Champion
maltzj
528
40k
The Illustrated Guide to Node.js - THAT Conference 2024
reverentgeek
1
390
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.8k
技術選定の審美眼(2025年版) / Understanding the Spiral of Technologies 2025 edition
twada
PRO
118
120k
The Cost Of JavaScript in 2023
addyosmani
55
10k
[SF Ruby Conf 2025] Rails X
palkan
2
1.1k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
17k
How to Ace a Technical Interview
jacobian
281
24k
KATA
mclloyd
PRO
35
15k
Optimising Largest Contentful Paint
csswizardry
37
3.7k
Documentation Writing (for coders)
carmenintech
77
5.4k
Large-scale JavaScript Application Architecture
addyosmani
515
110k
Transcript
【子ども向けハンズオン】 ゲームで学ぼう、プログラミング! 2017/10/29 Java女子部
名ふだ作成タイム テーブルにあるペンとシールで 名ふだを作りましょう! ※時間は5分です。
じこしょうかいタイム 作った名ふだを見せながら グループ内で じこしょうかいしましょう!
1. はじめに 2. ハンズオン 1. チャットをしてみよう! 2. へんすうを学ぼう! 3. ざひょうを学ぼう!
4. くりかえしを学ぼう! 5. じょうけんを学ぼう! 6. はいれつを学ぼう! 3. まとめ ★もくじ★
はじめに プログラミングって なんだろう?
プログラミングとは きかい(コンピューター)に わかることば(プログラム)を かくこと
プログラミングとは 日本語 プログラム あしたのてんきは? String parameter = city=70&day=”tomorrow"
世界から『プログラム』が消えたなら スマホが使えない →電話やアプリ(LINE)が使えない のでれんらくをとるのが大変 ゲームができない →楽しいことがすくなくなる 他にもたくさんプログラムが あるからきょうみがあればどこに 使われているかしらべてみよう!
今日のゴール ▪ プログラムが何か知ろう ▪ 作る楽しさ・おもしろさをたいけんしよう
1. はじめに 2. ハンズオン 1. チャットをしてみよう! 2. へんすうを学ぼう! 3. ざひょうを学ぼう!
4. くりかえしを学ぼう! 5. じょうけんを学ぼう! 6. はいれつを学ぼう! 3. まとめ ★もくじ★
チャットをしてみよう チャットとは、 インターネット上でたくさんの人と 文字を入力して会話すること。
チャットをしてみよう ブラウザ(Chrome:クローム) をひらいてください
チャットをしてみよう
チャットをしてみよう この画面を 「トップ画面」という のでおぼえておい てね!
チャットをしてみよう 今日のスライドは ここをクリック すると見れるよ!
チャットをしてみよう クリック
チャットをしてみよう
チャットをしてみよう ①なまえを入れよう ②メッセージを 入れよう ③「そうしん」 ボタンをクリック
チャットをしてみよう ここにそうしんした メッセージがひょうじ されるよ!
チャットをしてみよう ほかの子がそうしんした メッセージも見れるよ!
チャットをしてみよう ▪ ハンズオン中の好きなときに しつもんやかんそうをチャットで そうしんしてみてね! ※ちゅうい ▪ ハンズオン中はチャット画面は閉じないでね! ▪ スマホからも使えるのでお父さんお母さんも
ぜひ使ってくださいね!
1. はじめに 2. ハンズオン 1. チャットをしてみよう! 2. へんすうを学ぼう! 3. ざひょうを学ぼう!
4. くりかえしを学ぼう! 5. じょうけんを学ぼう! 6. はいれつを学ぼう! 3. まとめ ★もくじ★
へんすうを学ぼう! トップ画面 「モンスターを たおそう!」 をクリック
へんすうを学ぼう! 「START」クリックで ゲームがはじまるよ!
へんすうを学ぼう! キーボードの「←」と 「→」をおしてモンスターに近 づこう!
へんすうを学ぼう! モンスターを たおそう! 近づいたらキーボード の「スペース」を おしてモンスターを こうげきしよう!
へんすうを学ぼう! 「もう一度遊ぶ」クリックで また遊べるよ! 「もう一度遊ぶ」クリックで また遊べるよ!
へんすうを学ぼう! モンスター たおせたかな?
へんすうを学ぼう! 「エディタをひらく」をクリッ ク
へんすうを学ぼう! ①「モンスターの 体力=」に 「5」を入力 ②「へんこう」 ボタンをクリック
へんすうを学ぼう! もういちどゲームをやってみよう! こんどはモンスターたおせたかな?
へんすうを学ぼう! へんすうとは、 すうじや文字を入れるハコ。 なまえをつけてわかりやすくできるよ へんすうのなまえ
へんすうを学ぼう! あたい(値)をへんすうに一時的にほぞんす ることを「代入」という。 へんすう あたい
へんすうを学ぼう! ほかの「へんすう」のあたいを いろいろな数にかえて あそんでみよう!
時間がある人は 「モンスターをよけよう!」 でもあそんでみよう! へんすうを学ぼう!
へんすうを学ぼう! トップ画面 「モンスターを よけよう!」 をクリック
上下キー(↑↓)でくまを動かしてモンスターをよけてゴー ルまでたどりつこう! へんすうを学ぼう! モンスターの動きが早くて クリアできないばあいはあ たいを小さくしてみよう!
1. はじめに 2. ハンズオン 1. チャットをしてみよう! 2. へんすうを学ぼう! 3. ざひょうを学ぼう!
4. くりかえしを学ぼう! 5. じょうけんを学ぼう! 6. はいれつを学ぼう! 3. まとめ ★もくじ★
「ざひょう」って何だろう? →画面の中の「場所」をあらわすもの。 ざひょうを学ぼう!
ざひょうを学ぼう!
くまのいる場所 をどうやって表す? ざひょうを学ぼう!
画面に「たて」「よこ」のマス 目があると考えるよ。 1 2 3 4 5 6 7 8
9 10 1 2 3 4 5 6 7 8 9 10 よこ たて ざひょうを学ぼう!
1 2 3 4 5 6 7 8 9 10
1 2 3 4 5 6 7 8 9 10 よこ たて ざひょうを学ぼう!
1 2 3 4 5 6 7 8 9 10
1 2 3 4 5 6 7 8 9 10 よこ たて ざひょうを学ぼう!
1 2 3 4 5 6 7 8 9 10
1 2 3 4 5 6 7 8 9 10 よこ たて ざひょうを学ぼう! 「よこ5、たて5の場所に くまがいる」と表せられたね!
1 2 3 4 5 6 7 8 9 10
1 2 3 4 5 6 7 8 9 10 よこ たて ざひょうを学ぼう! 「よこ5、たて5の場所に くまがいる」と表せられたね!
トップ画面 「ざひょうを 数で見てみう!」 をクリック ざひょうを学ぼう!
「START」クリックで ゲームがはじまるよ! ざひょうを学ぼう!
くまはクリックしているあいだ いどうするよ ざひょうを学ぼう!
くまさんをうごかして、 りんごをあつめよう! くまはクリックしているあいだ いどうするよ ざひょうを学ぼう!
クリア できたかな? ざひょうを学ぼう!
あそびながら、 くまの場所(ざひょう)も かくにんしよう。 ざひょうを学ぼう!
トップ画面 「だっしゅつ しよう!」 をクリック ざひょうを学ぼう!
「START」クリックで ゲームがはじまるよ! ざひょうを学ぼう!
ゴール ざひょうを学ぼう!
ゴール やじるしキーを使って 動かせるよ! ざひょうを学ぼう!
ゴール 通れない。。。 ざひょうを学ぼう!
キャラクターが一番はじめにいる ざひょうを変更してみよう! 動かせるはんい よこ:1〜20 たて:1〜20 ざひょうを学ぼう!
たとえば よこ:6 たて:10 の場所はここ ざひょうを学ぼう!
たとえば よこ:11 たて:5 の場所はここ ざひょうを学ぼう!
たとえば よこ:11 たて:5 の場所はここ ゴールに行くにはどの場所にいれ ばいいかな? ざひょうを学ぼう!
ゴールにたどりつ けたかな? ざひょうを学ぼう!
1. はじめに 2. ハンズオン 1. チャットをしてみよう! 2. へんすうを学ぼう! 3. ざひょうを学ぼう!
4. くりかえしを学ぼう! 5. じょうけんを学ぼう! 6. はいれつを学ぼう! 3. まとめ ★もくじ★
くりかえしとは、 かいだん のぼる くりかえしを学ぼう!
くりかえしとは、 すべる くりかえしを学ぼう!
くりかえしとは、 もういっかい! くりかえしを学ぼう!
くりかえしとは、 かいだん のぼる くりかえしを学ぼう!
くりかえしとは、 すべる くりかえしを学ぼう!
くりかえしとは、 もういっかい! くりかえしを学ぼう!
くりかえしとは、 すべる もういっかい! かいだん のぼる くりかえしを学ぼう!
くりかえしを学ぼう! トップ画面 「くりかえしを使って 図を作ってみよう!」 をクリック
クリック! くりかえしを学ぼう!
「3」を入れて みよう! くりかえしを学ぼう!
「へんこう」を クリック! くりかえしを学ぼう!
線が3回 まがったかな? くりかえしを学ぼう!
「まがれ!」という命令を3回くりかえした まがれ! まがれ! まがれ! くりかえしを学ぼう!
くりかえしで こいつを ふやすことも できるぜ! どーん ひとりぼっち なの くりかえしを学ぼう!
虫の絵を 書く くりかえしを学ぼう!
ゲームに 表示させる Timer: 6 あと1匹! くりかえしを学ぼう!
Timer: 6 あと1匹! もういっぴき 表示したいな! くりかえしを学ぼう!
もういっぴき 表示したいな! Timer: 6 あと1匹! ゲームに 表示させる 虫の絵を 書く くりかえしを学ぼう!
くりかえすことで、 たくさん 虫さんを作れるよ! くりかえしを学ぼう!
トップ画面 「ふやした虫を けそう!」 をクリック くりかえしを学ぼう!
ここに入れた数だけ 虫さんがくりかえし によって作られるよ! くりかえしを学ぼう!
あそび方 虫をクリックして 10秒以内に 全部消せたらクリア くりかえしを学ぼう!
「START」を クリックで ゲームスタート!! くりかえしを学ぼう!
くりかえしを学ぼう! 全部消せたかな?
きゅうけい
1. はじめに 2. ハンズオン 1. チャットをしてみよう! 2. へんすうを学ぼう! 3. ざひょうを学ぼう!
4. くりかえしを学ぼう! 5. じょうけんを学ぼう! 6. はいれつを学ぼう! 3. まとめ ★もくじ★
じょうけんを学ぼう! じょうけんとは、 ということ ◦◦したら ◦◦する
じょうけんってなんだろう? ▪ にちじょう生活だと 雨がふったら かさをさす じょうけんを学ぼう!
じょうけんってなんだろう? ▪ ゲームだと 敵にぶつかったら ゲームオーバー じょうけんを学ぼう!
じょうけんを学ぼう! トップ画面 「ゴールに たどりつこう!」 をクリック
まずは「右」のままで やってみよう! じょうけんを学ぼう!
「START」を クリックで ゲームスタート!! じょうけんを学ぼう!
じょうけんを学ぼう! かいだんまで たどり着けたかな?
今回のゲームでは、 かべにあたったら 右にまがる 右 じょうけんを学ぼう!
じょうけんを 「左」に変えて、 やってみよう! じょうけんを学ぼう!
じょうけんを学ぼう! 「START」を クリックで ゲームスタート!!
今度は かいだんまで たどり着けたかな? じょうけんを学ぼう!
今回のゲームでは、 かべにあたったら 左にまがる 左 じょうけんを学ぼう!
じょうけんを学ぼう! トップ画面 「ぶたさんを じゆうにうごかそう!」 をクリック
ぶたに 当たったら ゲームオーバー になる じょうけんを学ぼう!
じょうけんを学ぼう!
じょうけんを学ぼう!
はやさ じょうけんを学ぼう!
大きさ じょうけんを学ぼう!
じょうけんを学ぼう! 「START」を クリックで ゲームスタート!!
ゴールできたかな? じょうけんを学ぼう!
1. はじめに 2. ハンズオン 1. チャットをしてみよう! 2. へんすうを学ぼう! 3. ざひょうを学ぼう!
4. くりかえしを学ぼう! 5. じょうけんを学ぼう! 6. はいれつを学ぼう! 3. まとめ ★もくじ★
はいれつを学ぼう! へんすうには1つのあたいしか 代入できない。
はいれつを学ぼう! 1つのハコに 1つのおかし 1つじゃ たりない!
はいれつを学ぼう! ふくすう入るハコを作ろう
はいれつを学ぼう! ふくすうのおかしを入れられた!
はいれつを学ぼう! 1つのへんすうにふくすうの あたいを代入したい →「はいれつ」を使う おかし= キャンディー、たいやき、 ケーキ、チョコレート
はいれつを学ぼう! マップをクリックして すきながぞうをえらぼう。 クリック
はいれつを学ぼう! がぞうをえらんだら、 おきたい場所をクリックしよう クリック
はいれつを学ぼう! マップを作りおわったら 「はいれつをかくにん」をクリックしよう。 クリック
はいれつを学ぼう! よこのマス目は「,」で区切られているよ。
はいれつを学ぼう! マス目の場所とはいちしたがぞうの番号を 確認してみよう。
はいれつを学ぼう! マップを作りおわったら 「マス目のひょうじ」のチェックをはずそう。 クリック
はいれつを学ぼう! マップがきれいに表示されるので なまえをつけてほぞんしよう。 ②クリック ①マップの なまえを いれよう
はいれつを学ぼう! マップができたら となりの子と見せあったり おかあさん、おとうさんにしゃしんを とってもらったりしよう! しゃしんは良かったらTwitterで #javajoを付けてつぶやいてください! #sendaiitfes #s2910523
まとめ (きょうべんきょうしたこと) ▪ プログラミングってなに?わかる人〜?
まとめ (きょうべんきょうしたこと) ▪ プログラミングってなに? ▪ きかい(コンピューター)に わかることば(プログラム)をかくこと
プログラムは、きょうべんきょうした ・へんすう ・ざひょう ・くりかえし ・じょうけん ・はいれつ をくみあわせて作るよ。おさらいしてみよう。 まとめ (きょうべんきょうしたこと)
まとめ (きょうべんきょうしたこと) ▪ へんすう ▪ へんこうできるあたいを入れるもの。 ▪ れい:モンスターの体力 ▪ ざひょう
▪ 「場所」をあらわすかずのこと。 ▪ れい:キャラクターのいち
▪ くりかえし ▪ おなじうごきをくりかえすこと。 ▪ れい:何回も虫さんを作る ▪ じょうけん ▪ 何かがおこるきっかけのこと。
▪ れい:くまさんがぶたさんに当たったらゲーム オーバーになる まとめ (きょうべんきょうしたこと)
▪ はいれつ ▪ 1つのへんすうにふくすうのあたいを代入す るためのいれもの。 ▪ れい:たくさんのがぞうがならんでいるマップ まとめ (きょうべんきょうしたこと)