災害情報とアクセシビリティ #mixleap

災害情報とアクセシビリティ 災害情報の警戒色について 2021年6月9日 ヤフー株式会社 小野 高志 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved.

自己紹介 ヤフー株式会社 小野 高志 天気・災害サービス デザイナー 主に防災コンテンツを担当 2019年防災士の資格を取得 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 2

自己紹介 13:00 防災速報 ○○市 警戒レベル4相当：危険な区域を 地図で確認 土砂災害 河川洪水 7月10日 13:00 気象警報・注意報 暴風 発表中 大雨 7月10日 13:00 豪雨予報 非常に激しい雨（55mm/h以上） 7月10日 13:00 ○○市の通知履歴 天気・災害コンテンツ 地震履歴 全国で発生した震度2以下を含む地震履 歴を確認できます。 マップ 防災手帳 設定 Yahoo!防災速報などウェブ・アプリ 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. ノベルティデザイン 3

本日のお話 本日はアクセシビリティがテーマということで “災害情報”を伝える“色”を中心にお話ししたいと思います。 13:00 防災速報 ○○市 警戒レベル4相当：危険な区域を 地図で確認 土砂災害 河川洪水 7月10日 13:00 気象警報・注意報 暴風 発表中 大雨 7月10日 13:00 豪雨予報 非常に激しい雨（55mm/h以上） 7月10日 13:00 ○○市の通知履歴 天気・災害コンテンツ 地震履歴 全国で発生した震度2以下を含む地震履 歴を確認できます。 マップ 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 防災手帳 設定 4

災害情報の警戒色について 1.災害情報と色 2.情報を“正しく”伝える配色 3.誰も取り残さないために 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 5

災害情報の警戒色について 1.災害情報と色 2.情報を“正しく”伝える配色 3.誰も取り残さないために 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 6

1.災害情報と色 災害の種類と、危険度に応じた色が設定されている 13:00 防災速報 ○○市 警戒レベル4相当：危険な区域を 地図で確認 土砂災害 河川洪水 7月10日 13:00 気象警報・注意報 暴風 発表中 大雨 7月10日 13:00 豪雨予報 非常に激しい雨（55mm/h以上） 7月10日 13:00 ○○市の通知履歴 天気・災害コンテンツ 地震履歴 津波情報 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 全国で発生した震度2以下を含む地震履 歴を確認できます。 マップ 気象警報・注意報 防災手帳 設定 防災速報 7

1.災害情報と色 色を利用するメリット 文字を読んで情報を理解する必要がある 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 8

1.災害情報と色 色を利用するメリット 災害の深刻度が直感的に理解できる 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 9

1.災害情報と色 色を利用するメリット 13:00 防災速報 ○○市 警戒レベル4相当：危険な区域を 地図で確認 土砂災害 河川洪水 7月10日 13:00 気象警報・注意報 暴風 発表中 大雨 7月10日 13:00 豪雨予報 非常に激しい雨（55mm/h以上） 7月10日 13:00 禁無断転載 様々な表現方法が可能になる ○○市の通知履歴 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 10

災害情報の警戒色について 1.災害情報と色 2.情報を“正しく”伝える配色 3.誰も取り残さないために 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 11

2.情報を“正しく”伝える配色 13:00 防災速報 ○○市 警戒レベル4相当：危険な区域を 地図で確認 土砂災害 河川洪水 7月10日 13:00 気象警報・注意報 暴風 発表中 大雨 7月10日 13:00 豪雨予報 非常に激しい雨（55mm/h以上） 7月10日 13:00 ○○市の通知履歴 天気・災害コンテンツ 地震履歴 全国で発生した震度2以下を含む地震履 歴を確認できます。 マップ 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 防災手帳 設定 12

2.情報を“正しく”伝える配色 気象庁などの配色のルールに準拠 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 出典：気象庁ホームページにおける気象情報の配色に関する設定指針 https://www.jma.go.jp/jma/kishou/info/colorguide/HPColorGuide_202007.pdf 13

• https://www.jma.go.jp/jma/kishou/info/colorguide/HPColorGuide_202007.pdf

2.情報を“正しく”伝える配色 ISO（国際標準化機構） 22324 Societal security --- Emergency management --- Guidelines for colour-coded alerts 公衆向け警報において危険の深刻度をカラーコードで表現するためのガイドライン 深刻度を表わすカラーコード 色 意味 期待される行動 テキスト色 赤 危険 ただちに適切な保安行動を とる 白 黄 注意 適切な保安行動をとるため の準備をする 黒 緑 安全 行動は求めない 白 補助的情報のためのカラーコード 色 意味 黒 致命的な危険 紫 致命的な危険 青 参考情報 灰色 情報なし 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 使用の制約 テキスト色 赤と併用できる。白黒の市 白 松模様で置き換えてもよい。 赤と併用できる。 白 深刻度レベルをあらわすの に用いるべきではない 情報が得られないことを示 すのに用いる 気象庁 ISO 22324 出典: フリー百科事典『ウィキペディア（Wikipedia）』 https://ja.wikipedia.org/wiki/ISO_22324 14

• https://ja.wikipedia.org/wiki/ISO_22324

2.情報を“正しく”伝える配色 足並みを揃えた表現にすることで、ミスリードを避け、 共通認識を促すことにもつながる 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 16

災害情報の警戒色について 1.災害情報と色 2.情報を“正しく”伝える配色 3.誰も取り残さないために 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 17

3.誰も取り残さないために 人によって見え方が異なる場合もある 危険 安全 ＝ Deuteranopia 日本人男性の20人に1人 75万人/日のユーザー 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 画像：アフロ 出典：『平成12年版総務省編『障害者白書』 18

3.誰も取り残さないために シミュレータでの確認 黄砂情報 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 19

3.誰も取り残さないために 社内の方の協力を得て細部を調整 河川と県境が混同された 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 20

3.誰も取り残さないために 社内の方の協力を得て細部を調整 調整前 調整後 河川と県境が混同された 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 県の境界を破線に 21

3.誰も取り残さないために 社内の方の協力を得て細部を調整 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 22

3.誰も取り残さないために 社内の方の協力を得て細部を調整 “グレーより黄色のアイコン の方が見えづらいかも” 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 23

3.誰も取り残さないために 社内の方の協力を得て細部を調整 調整前 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 調整後 調整前 調整後 （再現ソフトでの確認） 24

災害情報の警戒色について 1.災害情報と色 災害の深刻度を直感的にさまざまな表現方法で、伝えることができる 2.情報を“正しく”伝える配色 規格やルールに準拠することで、社会の共通認識の形成を促す 3.誰も取り残さないために さまざまな人から意見をもらい改善することで、実際に使いやすいサービスになる 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 25

「色」は災害、また災害に限らず 情報を伝えるための重要な要素の一つです。 ユーザーが正しい行動判断ができるよう 適切な使い方を心がけたいと思います。 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 26

EOP Yahoo!防災速報アプリ ご清聴ありがとうございました。 禁無断転載 Copyright (C) 2021 Yahoo Japan Corporation. All Rights Reserved. 27