2022.12.14 07:10

デザインを考える

どうも、itioka3_10です。

最近はブランドイメージの構築を進めているところです。

早速ですが、私は常々「見やすさ」を追求しております。他の監視の皆さんもそうだとは思われます。

そこで、私は従来から「ユニバーサルデザイン」に着目し、独自に進化を遂げています。この試行錯誤とアイデアを記録すると共にヒントになればいいなと思って綴っていきます。

尚、制作にあたってはシュミレーションツールや自分の感覚で検証しているので正確とは言えないですが、参考程度に読んで下さい。

また、ご意見ください

☆配置を考える☆

・余白をつくる

・目線を考慮する

・説明をつける

★CUDを考える★

・ピクトグラムを利用する

・目に優しい配色にする

・JIS安全色やCUD推奨配色を利用する

１.余白をつくる

初歩的な話ですが、絶対に余白はいれましょう。

ないと窮屈で圧迫感のある印象になります。

itioka3_10は縁及びソフト間に30pxいれています。また、上辺には後述する概要説明用に、50pxも入れています。

初OBSの時。alt,ctrl操作なんか知る由もなくギチギチ

2.目線を考慮する

画面は自由に配置できる分、円滑に情報を伝達できるように工夫をすべきだと考えています。

情報を整理するのは勿論、集約するのもありだと思います。

itioka3_10が提案することは目線を考慮して配置すべきことだと思います。

目線移動という無意識に行う行動を利用して迅速に情報を受け取ってもらう、持って帰ってほしい情報を印象付けて持って帰ってもらうことが可能になります。

人の目線移動はおおよそ左上から右下へ流れるのが共通の動き方です。

さらに情報の並び方によって、ZやFの文字を描くように移動する法則があります。

詳しくはこちら参考資料：知っておきたい人の視線の動き方。視線の動きを意識してユーザーを導く。

これを配信配置に当てはめた時にグーテンベルク・ダイヤグラムやZの法則が該当すると思います。すると、ある程度整列させて配置する必要があります。

itioka3_10は2行の構成をベースとして左上にメインの情報を持ってくるようにしています。

検知速度を知りたかったと供述。実際左中しか見てなかった。

3.説明をつける

地震の配信とか知識を用いて人に教えるようなものは、「知ってて当然」という考え方を消してください。知らなくて普通なので、知らない人が強震モニタを見たところで出てくるものは「？」だと思いますので、そのモニタが何を示しているのか書いておくべきだと思います。

こんな画像があっても誰がわざわざ見に行くねーん。

4.ピクトグラムを利用する

近年では外国観光客とかの為に5ヶ国語表記とかあったりしますよね。そんな感じでピクトグラムが利用されていて身近な存在になっています。防災の分野でも例外ではありません。

例えば、広域避難所のピクトグラム。これ一つで「広域避難場所である」と表現できますし、矢印がつけば「この方向にー」災害種別がつけば「以下の災害の時に利用ができるー」というように、かなり容易に言語の壁を越えて伝達することができる手段です。

津波発生時など特に避難を呼び掛ける重大災害に関しては有効に利用すべきだと思っています。

itioka3_10では

因みに、東日本大震災以前まで(今も？)災害ピクトグラムはまちまちなのでJISのピクトグラムを優先して利用してください。

文字だらけ。文字情報専用。でも本格始動たった2週間後に来るとは思わんやん。(これの設計は予めしてた)

5.目に優しい配色にする

配信を見られる方のうち常駐される方や一瞬のみの方を含め色んな方が見ることを想定します。その中で、被災で心身ストレスを受けながらみられる可能があることもあります。

できるだけ負荷を少なくして提供をするべきだと思っているので色遣いにも注目すべきだと思います。また、色は単色でもかなりの印象を連想して与えるものなので重要だと考えます。

目に優しい、つまり目を疲れにくくするように設計する必要があります。

例えば、動きを少なくして情報量の制限をするとか、大きい文字にして認識性を上げるとか。

そして、眼に与える光の量を調節します。

光の量とは利用者の画面の明るさを調節するのもそうですが、真っ黒＃000000ではなく暗い灰色#0d0d0dとか#1a1a1a等を利用してコントラスト幅を狭める事です。

同様に白色も少し暗い色にすべきだと思いますが、白の方は認識性の為に控えめを推奨

6.JIS安全色やCUD推奨配色を利用する

皆さんはＣＵＤって言葉をお聞きになったらことがありますか？

カラーユニバーサルデザイン(ＣＵＤ)とは人間の色覚の多様性に対応し、より多くの人に利用しやすい配色を行った製品や施設・建築物、サービス、情報を提供するという考え方(出典カラーユニバーサルデザイン機構)というものでいづれかの色が認識できず、差が分かりにくい方にも対応できるようにすることです。

例えば赤色が白黒コピーで黒色になって識別が難しくなる感じです。

アクセントとしてJISの安全色(禁止マークとか交通標識に使われている配色)やCUD推奨配色セットを使うべきだと思います。

先ほどにも色について言及しましたが、白黒は5番のコントラスト比を少し抑えるべきであります。しかし、コントラスト比を抑えるとCUD的には不適合になります。その時は輪郭をつける等の区別化を図るなどをすれば良いと思います。

色のシュミレーションといった再現装着で確認するのもありだと思います。

EqMiniの視認性が悪く、背景も濃色なので全体的に暗い印象をもつ

まとめ

いかがでしょうか。工夫に工夫を重ね、最大限の配慮を行ってもすべての人に伝えるのは不可能です。しかし、伝えるのが困難な人でも伝えれるようにする工夫は決して無駄ではなく、むしろ義務だとおもっております。(ギミックが多いのはただただ趣味でしかない)

上記のポイントからより良い配信情報提供を行っていただけたら嬉しいと思っております。

ついでに上記のポイントを意識した通常配信画面でも乗っけておきます。

背景クロマキー透過はあまり好みでないのでそこらへんはお許しください。