色だけで伝わると思っていたグラフが、ある人には見分けられない。今回は「誰に」を広げる
50分準備 教室コードは新しいものにする。「教師」を押す。
時間配分 前回まとめ・目標 4分 / 節1 4 つの言葉 12分 / 節2 色だけで伝わるか 14分 / 節3 身近な UI を直す 14分 / まとめ・自己評価・ふりかえり 6分
教科書: 新編情報Ⅰ 19 ユニバーサルデザイン(p.52)。内容の取扱い(3)「年齢や障害の有無、言語などに関係なく全ての人にとって利用しやすくする工夫」。
この回の評価(指導要領 (2) ア(イ) イ(イ)。ユニバーサルデザイン・ユーザビリティ・アクセシビリティ・シグニファイア。単元設計は 単元設計のページ)
ふりかえりの枚の自己評価の分布を見て、「まだ」が多い目標を次回冒頭で拾い直す。
前回の 3 つの技は「自分たちに分かりやすく」だった。今日は「誰に」を広げる。目が見えにくい人、色の見え方が違う人、日本語を読めない人、初めて使う人にも伝わるか
赤と緑で分けたグラフは、全員に伝わっているか
前回のふりかえり(何を捨てて何を残しているか)を 1 つ読み上げてから進む。
身近な例で分ける
見え方を切り替えて確かめる
困る → こうする
段差をなくすのか、最初から段差を作らないのか

ユニバーサルデザイン=最初から誰でも使えるように設計。バリアフリー=ある障壁を後から取り除く。アクセシビリティ=使えない人を使える状態にする尺度。ユーザビリティ=使える人にとって使いやすいかの尺度。タップして分け、「答え合わせ」
進め方(7分) 3 分で答え合わせ。バリアフリーとユニバーサルデザインの違い(後から取り除く/最初から作らない)と、アクセシビリティとユーザビリティの違い(使えるか/使いやすいか)の 2 組で押さえる。
「字幕はアクセシビリティ? ユーザビリティ?」→ 聞こえない人には使える/使えないの問題(アクセシビリティ)。電車で音を出せない人には使いやすさ(ユーザビリティ)。同じ工夫が両方に効く例。目標 01。
| ユニバーサルデザイン | 年齢・性別・国籍・能力や障がいの有無によらず、誰もが利用できるように最初から設計する。バリアフリー(障壁を後から取り除く)とは考え方が違う |
| アクセシビリティ | 幅広い人々が使えるかの尺度。使えない状態を使える状態にする。文字の拡大、読み上げ、字幕、多言語 |
| ユーザビリティ | 使える状態のものが使いやすいか・分かりやすいかの尺度。使いにくい状態を使いやすい状態にする。ボタンの大きさ、共通の操作 |
※ 第1単元の「誰もが使える情報環境」(デジタルデバイド)の答えの一つが、この設計
目標 01。「〇」が海外では別の意味になることがある(教科書コラム)ように、記号の意味も文化で違う、と一言。
赤と緑が同じに見える人は、男性の 20 人に 1 人

同じデータの 2 つのグラフ。左は色だけで区別、右は色に加えて模様と文字を付けた。「色の違いが分かりにくい見え方」に切り替えて、どちらが読めるかを確かめる
進め方(8分) 切り替える前に「A は読める?」→ 読める。切り替える → A は 4 本の棒が同じ濃さになり区別できない。B は模様と文字で読める。
正確な説明 この切り替えは色を全部なくした模擬(白黒)で、実際の色覚の多様性そのものではない。赤と緑が見分けにくい型は日本人男性の約 5%(20 人に 1 人)、女性の約 0.2%。クラスに 1 人いる計算。
結論 色だけに頼らず、模様・形・文字・位置を足す(カラーユニバーサルデザイン、カラーバリアフリー)。目標 02。
下のうち「色だけで区別している」と思うものを全部押す。押したものは、色以外に何を足せば伝わるかを隣と話す
信号機は「位置」(右が赤)でも区別している。路線図は路線名の文字と番号を添える。充電ランプは点滅と点灯で分ける、など。「色を使うな」ではなく「色に足す」が答え。
押せそうに見えるか、戻れそうに見えるか

券売機、リモコン、アプリ、電子レンジ、学校の機器。使いにくかった場面を一つ思い出し、どう直せば使いやすくなるかを書く。2 組以上出せると強い
全員の「困る → 直す」が右に並ぶ。直し方を「大きく」「同じ場所に」「見た目で分かるように」「文字を足す」に分ける
進め方(10分) 一人で 4 分。読み上げて直し方を分類する。「押せそうに見える」「はみ出しているから続きがあると分かる」が出ればシグニファイア(行動を促す手がかり)。
言葉 ユーザインタフェース(UI)= 利用者とコンピュータの間の入出力の手段。機器が違っても似た操作に共通のルールがあると使いやすい。ユーザエクスペリエンス(UX)= 製品やサービスを通じて得られる体験全体。使いやすさだけでなく、使い心地・印象まで。
評価規準(A)は「アイデアを複数」。2 組目を促す。目標 03。
| ユーザインタフェース(UI) | 利用者とコンピュータの間の入出力の手段。画面・ボタン・音。機器が違っても共通のルール(戻るは左上、赤は停止)があると使いやすい |
| ユーザエクスペリエンス(UX) | 製品やサービスを通じて利用者が得られる体験。使いやすいだけでなく、使い心地・感動・印象まで含む |
| シグニファイア | 人に行動を促す手がかり。「一部だけはみ出している」と、続きがあると分かってスクロールする。押せそうに見える形、開けそうに見える取っ手 |
よい UI は説明が要らない。自分が使えるかではなく、初めての人・使えない人が使えるかで見直す。次回、その人を具体的に決める
メッセージアプリの吹き出しやスタンプは「会話を促すデザイン」(教科書コラム)。身近な例として。
道具で見え方を切り替え、教室や配布物の中で「色だけで区別している所」を 1 つ見つけて出す
進め方 見つけた人から出す。全員に同じ答えを求めない。出てきたものを 2〜3 個読み上げ、共通点を言葉にする。
5分。色だけで区別しない、文字の大きさ、の 2 点に絞る。
道具は外で公開されている Web アプリ。この授業のページの中で開くので、別のページへは移らない。閉じれば、そのままこの枚に戻る。ブラウザの中で動き、入力はこの授業のサーバーには送られない。
3 つの目標それぞれに、できた/だいたい/まだ、を 1 つ選ぶ。右の帯にクラス全体の分布が出る
1 分。「まだ」が多い目標は、次回の冒頭で拾い直す。
一文でよい。「〇〇には△△の工夫があって、□□な人も使える」の形
3 分。次回は「誰に」を一人の人物として決める(ペルソナ)。今日の「使えない人」を具体的な人にする。