Okamoto Masao – たんぼのお家ブログ

名簿をcsvから読み出す対話用教材は、スマホで表示させることができませんでした。そこでファイルを修正（head に viewport を追加）しました。以下、備忘録です。

以下の文を angle brackets で囲み、4行目（の下）に追加します。

meta name=”viewport” content=”width=device-width, initial-scale=1.0″

6行目（angle brackets で囲まれた title）の上です。

一部ゲームサイトのスマホ対応を修正しました

ナンバータッチゲーム等、一部のゲームではスマホで名前の入力ができませんでした。これは古いバージョンの ruffle を用いていたためで、 ruffleを更新しました。
新しいバージョンの ruffle では、virtual keyboard 関係の処理が入っているようです。

カラータッチゲームのランキング欄に、残念ながら悪い書き込みがありました。
そこで、特定のキーワードが入った書き込みは反映されないよう、cgiを書き換えました。

（備忘録）
if (… =~ /特定のキーワード/) {
$getdata{‘…’} = “”;
}

また、同じ児童が何度も挑戦した際、スコアの高い同じ児童名ばかり反映され、他の児童名が登録しにくくなっていましたので、同じ名前は最も高いスコアのみ記録されるようにしました。

ランキングはcronを用いて自動的に更新していますが、一部のゲームで自動更新されてませんでしたので、こちらも改善しました。

たんぼのお家のゲームは外国語用が多く、良くない書き込みを防ぐ意味でも半角英数のみ入力できるようになっています。

なお、学校用 (school) サイトは、同じクラスが何度も挑戦する可能性がありますし、悪い書き込みが行われる可能性がありませんので、以前のcgiのままになっています。

HTML5教材 6年生Unit 7 “My dream.” における修正

発表用教材と対話用教材で授業を行った際，児童から加えてほしいと希望があった「部活」（もしくは，教室）を追加した結果，以下のようになりました。

art class 美術教室
art club 美術部
badminton team バドミントン部
band club 軽音楽部
baseball team 野球部
basketball team バスケットボール部
boxing club ボクシング部
brass band 吹奏楽部
broadcasting club 放送部
chorus 合唱部
computer club コンピュータ部
dance club ダンス部
drama club 演劇部
ice hockey team アイスホッケー部
judo club 柔道部
karate dojo 空手道場
kendo club 剣道部
mathematics research club 数学研究部
newspaper club 新聞部
science club 科学部
Shorinji kempo club 少林寺拳法部
soccer team サッカー部
swimming club 水泳部
table tennis team 卓球部
tea ceremony club 茶道部
tennis team テニス部
track team 陸上部
volleyball team バレーボール部
その他

また，「職業」について追加を重ねた結果，以下のようになりました。

actor 俳優
actress 女優
animal caretaker 飼育員
announcer アナウンサー
architect 建築家
artist 芸術家
astronaut 宇宙飛行士
athlete 運動選手
aquarium keeper 水族館職員
backup dancer バックダンサー
baker パン職人
ballerina バレリーナ
baseball player 野球選手
basketball player バスケットボール選手
bookstore clerk 書店員
bus driver バス運転手
business owner 経営者
cabin attendant 客室乗務員
care worker 介護職
carpenter 大工
cat cafe staff 猫カフェ店員
chef シェフ
civil servant 公務員
comedian お笑い芸人
cook 料理人
creator クリエイター
dancer ダンサー
demolition worker 解体作業員
dentist 歯科医
designer デザイナー
Disney cast member ディズニーキャスト
doctor 医師
driver 運転手
EMT 救急救命士
engineer エンジニア
farmer 農家
fashion designer ファッションデザイナー
firefighter 消防士
fisherman 漁師
florist 花屋
game creator ゲームクリエイター
hair stylist ヘアスタイリスト
hairdresser 美容師
ice hockey player アイスホッケー選手
journalist 記者
lawyer 弁護士
manga artist 漫画家
midwife 助産師
music teacher 音楽教師
nurse 看護師
nursery teacher 保育士
office worker 会社員
pastry chef パティシエ
performer パフォーマー
pharmacist 薬剤師
pianist ピアニスト
pilot パイロット
police officer 警察官
politician 政治家
professional athlete プロスポーツ選手
professional gamer プロゲーマー
professional swimmer プロ水泳選手
professor 教授
programmer プログラマー
referee 審判
remote worker リモートワーカー
researcher 研究者
robot creator ロボット開発者
scientist 科学者
SDF personnel 自衛隊員
server 接客係
Shorinji kempo master 少林寺拳法師範
singer 歌手
soccer player サッカー選手
sports coach スポーツコーチ
staff 職員
surfer サーファー
swimming coach 水泳コーチ
system engineer システムエンジニア
teacher 教師
train conductor 車掌
traveler 旅行者
trimmer トリマー
trumpeter トランペット奏者
USJ cast member USJキャスト
vet 獣医
voice actor 声優
volleyball player バレーボール選手
wedding planner ウェディングプランナー
writer 作家
YouTuber ユーチューバー
zookeeper 動物園職員
その他

プルダウンメニューから選択をする際，最初の一文字をキーボードで入力すると，その頭文字の項目にジャンプできます。
例えば，「v」と入力すると， “vet” にジャンプできるので，入力が容易になります。
頭文字を入力する作業を通じて，スペリングに興味を持たせることができます。

対話用教材，発表用教材に内容を追加

6年生 Unit 7 My dream の発表用教材，対話用教材に， “researcher” “architect” “engineer” 等の語彙を追加しました。
授業を実施したところ，プルダウンメニューになかった内容を児童が希望したため，追加しました。

プレゼンテーション教材を再度修正しました

発表用の教材を再度修正しました。この教材は，児童が発表をする際，Googleスライドやパワーポイント等のように用います。

変更点は，以下の通りです。
① 画像をなるべく大きく表示させるため，画像は背景として表示させるようにしました。
② その際，背景画像は「cover」（完全に背景になる）ではなく，「contain」（全体が表示される）ようにしました。
③ 背景画像が暗いときだけ，自動で文字色を白にするようにしました。
④ 文字色を変更できるようにしました。

なお，②と③はChatGPTが提案し，おかげでよりよい教材になりました。
このようなWeb教材の利点は，授業を行いながら修正していけるところにあると思います。

修正前