$30 off During Our Annual Pro Sale. View Details »

PBLを意識した情報ⅠのカリキュラムデザインとMonacaの活用

 PBLを意識した情報ⅠのカリキュラムデザインとMonacaの活用

More Decks by アシアル情報教育研究所

Other Decks in Education

Transcript

  1. 1#-Λҙࣝͨ͠ΧϦΩϡϥϜσβΠϯ
    ͱ.POBDBͷ׆༻
    1
    明星中学校・⾼等学校 情報科教諭 ⽊村剛隆
    mail︓[email protected]
    2023年3月25日(土) Monaca活用事例 オンラインセミナー

    View Slide

  2. ࣗݾ঺հ
    2
    ໦ଜ߶ོ(28)
    ー略歴ー
    2017 関西大学総合情報学部 卒業
    2019 関西大学大学院 総合情報学研究科 修了
    2019 屋久島おおぞら高等学校 情報科 専任教諭
    2021 明星中学校・高等学校 情報科 常勤講師
    ー興味関心ー
    教育メディア/教育工学
    探究学習/PBL/映像制作/デザイン
    パワポ作り/正課外活動/遊びと学び
    情報科/探究科

    View Slide

  3. 3
    ɽ৘ใᶗͷ೥ֶؒश໨త
    1-1.本校の情報の授業と環境
    授業コマの設定
    1 教室環境
    2 ICT環境
    3
    p 高校本科1年生(普通科)
    p 8クラス 約280名
    p 2単位の週2コマ
    p 担当教員3名での横並び
    p 1人1台 iPad
    p 全域でWi-Fi完備
    p Apple TV
    p スクリーン・プロジェクター
    p 2つのPC教室
    p Dell製WindowsPC 80台
    p レーダーカッター 1台
    p 3Dプリンター 2台
    東京都府中市にある中高一貫の高等学校(幼・小・中・高接続)

    View Slide

  4. 4
    ɽ৘ใᶗͷ೥ֶؒश໨త
    ランニングマシーンは拷問!?
    目的がないまま、何かをさせ
    られるのは“拷問”と同じ。
    1-2.カリキュラム作成の前提にある考え方
    目的・ゴールの意識を持った
    Project Based Learning
    図1 かつての拷問の写真

    View Slide

  5. 5
    ɽ৘ใᶗͷ೥ֶؒश໨త
    情報
    国語
    地歴
    公民
    数学
    科学
    芸術
    保健
    体育
    英語
    すべての教科に関わるのが『情報』だと捉える。だからこそ、
    ⾼校初年次に「情報」という観点から学び⽅の基盤をつく
    り、他教科や⽣活の中で活かしてく仕組みを作りたい。
    pリテラシーの育成
    →メディア・データ
    p協働的な学び方を学ぶ姿勢
    →総合探究の基盤づくり
    p探究する方法論の理解と活用
    →Googleなどの活用方法
    10*/5
    図2 教科情報のイメージ
    1-3.情報Ⅰの位置づけ
    ϓϩδΣΫτܕͷΧϦΩϡϥϜઃܭ

    View Slide

  6. 6
    ɽ೥ؒͷΧϦΩϡϥϜ
    明星⾼校のSNS事情を明らかにして、
    楽しく、賢く、安全に活⽤できるような
    ポスターを制作する。
    チームでビジネス企画を作成して、
    アイデアをWebサイトにまとめてアウト
    プットする。
    「神経衰弱」のゲームを遊びながら
    楽しくプログラミングで制作する。
    p 情報デザイン
    p 情報のディジタル化
    p 情報通信ネットワーク
    p HTMLとCSS
    p 情報社会の問題解決
    p 著作権・サイバー犯罪
    p メディアとコミュニケーション
    p データ活用
    p Google Work Space
    p 情報セキュリティーと暗号化
    p コンピュータのしくみ
    p アルゴリズムとプログラム
    p JavaScript
    1学期 2学期 3学期
    【授業目的】
    ① メディアやデータを批判的に読み解くことができる
    ② 問いを立てて、自ら調査をすることができる。
    ③ 自分の主張を相手に根拠を持って説明することができる。
    【授業目的】
    ① コンピュータの根幹となる数の表現と概念を理解する。
    ② ネットワークについて理解をして、WEBサイトを作ることができる。
    ③ デザイン思考を使って、社会で生きる人々のためのビジネス企
    画をデザインすることができる。
    【授業目的】
    ① プログラミングの基本を理解する。
    ② アルゴリズムで論理構造を表現する力をつける。
    ③ アルゴリズムに沿ってプログラムを書く力をつける。

    View Slide

  7. 7








    ɽ4/4നॻʂʢֶظʣ
    3-1.1学期プロジェクトロードマップ

    View Slide

  8. 8
    ɽ4/4നॻʂʢֶظʣ
    ❶メディアリテラシー ❷ディベート
    マスメディア等で紹介されるグラフや数字などが
    いかにして意図的につくられているのかを具体例
    を出しながら考える活動。批判的な視点を養う
    グラフ1 選挙の投票率のグラフ
    3-2.SNS白書のシンキングフェーズで養う批判的思考
    テーマは「SNSの匿名性の是非」。賛成と反対に
    分かれてディベートをした。主張には根拠がいる
    という視点を体験的に養う。
    写真1 ボーン図を使ったディベートの練習

    View Slide

  9. 9
    ɽ4/4നॻʂʢֶظʣ
    Who 主体 誰が?
    What 定義 どういう意味?
    When 時間
    いつから?
    いつまで?
    Where 空間 どこで?
    why 因果 なぜ?
    How
    経緯 いかにして?
    様態 どのように?
    方法 どうやって?
    当為 どうすべきか?
    参考:後藤・伊藤・登本(2014)学びの技、玉川大学出版、佐藤(2021)高校教員のための探究学習入門、ナカニシ出版
    テーマに対して、5W1Hをぶつけて問いをつくる
    3-3.問いの作り方を学ぶ
    ポストイットに書いた問いを分類して、問いを決定する
    ❸調査のための問い作り
    表1 問いづくりの5W1H

    View Slide

  10. 10
    ɽ4/4നॻʂʢֶظʣ
    3-4.Googleを活用した協働的な活動と成果発表
    写真2 Googleを使った共同作業の様⼦ 写真3 実際に作成した⽣徒の成果作品
    ❹調査結果の発表

    View Slide

  11. 11
    成果 反省
    p 短時間での⾼1の1学期のディベートが難しかっ
    た。
    p 時間的な問題で、データ分析の理解を促す授業
    が不⼗分であった。
    p スプレットシートを活⽤した授業が不⼗分だった。
    ɽ4/4നॻʂʢֶظʣ
    p Google work spaceを使うことで、探究活動に
    につながる1つのプログラムができた。
    p テーマを「SNS」にすることで、「著作権」や「サイバー
    犯罪」や「メディアリテラシー」や「データ分析」につい
    ての関連づけて授業を実践することができた。
    p 1年⽣の1学期にリテラシーの育成を促す授業をす
    ることの重要性を感じることができた。
    『SNS白書!』のプログラムは継続するが、「データ分析」の観点をより強め
    て、スプレットシートの使い方も含めた授業を実践していく必要がある。
    3-5.SNS白書!の成果と反省

    View Slide

  12. CV
    CV
    σβΠϯͬͯͳΜ
    ͩΖ͏ʁ
    Ұॹʹߟ͑Δɻ
    ϏδωεΞΠσ
    ΞΛൃදͯ͠'#
    Λ΋Β͏
    Πϯλʔωοτ
    ͷجຊ஌ࣝΛ਎
    ʹ͚ͭΔɻ
    ϏδωεاըΛ
    8αΠτʹ·ͱ
    ΊΔ
    ੍࡞ͨ͠8FCαΠ
    τͱاըΛൃද
    ͢Δ







    Ϗδίϯʹग़͢
    ΞΠσΞΛࣽ٧Ί
    ͯاըΛͭ͘Δ
    ίϯϐϡʔλ
    ʢσΟδλϧදݱʣ
    ͷجૅΛ஌Δ
    約1コマ 約3コマ 約2コマ 約1コマ
    ɽΞϯτϨʂʢֶظʣ
    約3ー4コマ 1コマ 約5ー7コマ
    12
    4-1.アントレ!Projectのロードマップ

    View Slide

  13. ɽΞϯτϨʂʢֶظʣ
    13
    4-2.デザイン思考と企画の作成
    ❶デザインとアートの違い ❷デザイン大喜利
    👍
    or
    👎
    デザイン=問題解決のプロセス
    身近なデザインにツッコミを入れる

    View Slide

  14. ɽΞϯτϨʂʢֶظʣ
    14
    4-2.デザイン思考と企画の作成
    ❸マイナビキャリア甲子園の課題の選択
    課題の選択してビジネス企画の作成する。→中間発表まで実施する
    ❹ペルソナの設定と企画書の作成
    写真4 マイナビキャリア甲⼦園の課題の抜粋 写真5 ペルソナ分析ワークシートの例

    View Slide

  15. ɽΞϯτϨʂʢֶظʣ
    15
    4-3.Monacaを活用したWebサイトの作成
    ❺ビジネス企画をWEBサイトにまとめる活動
    プレビューで見ながら、1からWebサイトを
    作成できるのがMonacaの強み!
    Monacaの操作説明
    1
    基本的なHTMLとCSSの知識
    2
    サンプルの作成
    3
    最終課題のWEBサイト制作
    4
    写真6 ⽣徒が作成したWebサイトとMonacaの操作画⾯

    View Slide

  16. 16
    成果 反省
    p ビジネスアイデアを考える時間が⼗分に取れない
    ために、出場のハードルが⾼かった。
    p ビジネスアイデアを考えるモチベーション維持と
    状況設定ができなかった。
    p Webサイト制作の時間が⼗分に取れずに、クオ
    リティの低いサイトに仕上がった。
    →情報デザインを詳しくできなかった。
    p HTMLとCSSでのプログラムは必要なのか疑問
    が残った。
    →ビジュアルで作る⽅が⼀般的なのではないか。
    p ディジタル化やネットワークについてのスライド作
    成や授業基盤を作ることができた。
    p Webサイト制作をする上で「ディジタル化」と
    「ネットワーク」の単元は必要な知識になるので
    流れはうまくつくれた。
    座学と実習の相性とバランスはいい
    が、プロジェクト目的や方法につい
    ての反省点が多いため、プロジェク
    ト自体の変更が必要である。
    4-4.アントレ!プロジェクトの成果と反省
    ɽΞϯτϨʂʢֶظʣ

    View Slide

  17. 17
    アルゴリズム
    コンピュータ
    のしくみ
    Java Script
    の基礎
    プログラム
    制作①
    ❶ ❷ ❸ ❹
    【2コマ】 【2コマ】 【2コマ】 【2コマ】 【2コマ】
    プログラム
    制作②
    神経衰弱を
    フローチャートで
    表現してみよう
    スペックを⽐較し
    て⾃分に会うPC
    を購⼊しよう
    じゃんけんを通し
    て配列や条件分
    岐を理解しよう
    おみくじから配
    列や繰り返しを
    理解しよう
    ❺ 神経衰弱ゲーム
    を完成させよう
    ɽϓϨϓϩʂʢֶظʣ
    5-1.プレプロ!のプロジェクトロードマップ

    View Slide

  18. 18
    ɽϓϨϓϩʂʢֶظʣ
    5-2.神経衰弱をやってみる
    ❶神経衰弱の手順を確認しながら体験 ❷神経衰弱のフローチャート作成の課題
    写真7 神経衰弱を楽しむ様⼦ 写真8 ⽣徒が作った神経衰弱のフローチャート

    View Slide

  19. 19
    ɽϓϨϓϩʂʢֶظʣ
    5-3.JavaScriptの基礎を学ぶ
    ❸Monacaを活用したじゃんけんプログラムの作成
    写真9 レーザーカッターで作った「じゃんけんBOX」 写真10 じゃんけんプログラムのMonaca操作画⾯
    変数 条件分岐
    の概念を学ぶ

    View Slide

  20. 20
    ɽϓϨϓϩʂʢֶظʣ
    5-3.JavaScriptの基礎を学ぶ
    ❹サイコロプログラムの作成
    配列 反復
    の概念を学ぶ
    関数
    写真11 ランダム作成を可視化したワークシート 写真12 Monaca操作画⾯

    View Slide

  21. 21
    ɽϓϨϓϩʂʢֶظʣ
    5-4.神経衰弱をつくる
    ❺神経衰弱ゲームの作成
    変数の作成
    1
    ランダムの関数作成
    2
    3
    CSSとHTMLでデザイン
    4
    写真13 Monacaで作成した神経衰弱ゲームのサンプル
    カードをめくるプログラム
    *全部作るのは全然できませんでした。

    View Slide

  22. 22
    →プログラミングで育てる資質・能力とはなにか?
    5-5.プレプロ!の成果と反省
    ɽϓϨϓϩʂ
    プログラミングのスキル︖ プログラミングの思考や姿勢︖
    プログラミング教育に対する問いが⽣まれた。
    どうしてもスキルによってしまう・・・・

    View Slide

  23. p簡単にプログラムを1からつくれる環境があるMonacaの可能性
    pプロジェクト活動のアウトプットに最適
    p⾃前の教材と組み合わせることでより効果が⾼まること
    23
    ɽ·ͱΊ
    【Monacaの可能性】
    【PBL型授業の可能性】
    p⽬的を達成するためのICT活⽤とプログラミングの視点が⾝につく
    p学び⽅を学ぶ意識をもつことができる

    View Slide

  24. 1#-Λҙࣝͨ͠ΧϦΩϡϥϜσβΠϯ
    ͱ.POBDBͷ׆༻
    24
    明星中学校・⾼等学校 情報科教諭 ⽊村剛隆
    mail︓[email protected]
    2023年3月25日(土) Monaca活用事例 オンラインセミナー
    ありがとうございました。

    View Slide