[PR]

2024年11月24日

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

「デザイン」て何よ？　Webデザイン編

前置き

毎朝の起床時間が遅くなり、
7:25から見ていたデザイン「あ」を見る機会が減った今日この頃。
今年のウィルスが関係しているわけでは無く、職場環境に順応し始めた結果である。
あと、早い時間に起きて朝食の準備をすると邪魔になり始めたんです。

同人活動が復活し始めた（まだ本格的には始動していない、本だけに）頃に
ウィルス問題でイベントの延期となったので「イベント参加したい」欲のピークが過ぎそうになっている。
まだ「イベント参加したい」欲は残っているけど手をこまねいている段階の今、頒布物について考える時間ができてしまった。
目の前に締め切りがあれば勢いで考えなかったのだろう、しかし今は時間がある。
それが題名の「デザイン」って何よ？　になる。

デザインっていっぱいあるんだなー、の長々とした話。
長いので分割することにしました、なんでデザイナーじゃないのに「デザイン」について書いているんだろう？
今回はWebデザインの話。

Webデザイン

見た目
使いやすさ
間違い難さ

実は職業がSE（システムの方ね）で、フロントエンドとサーバーサイドのプログラムを書いている底辺プログラマーである。
（PHPは数値系のバグを生産できる言語だと思っている。）
フロントエンドとはいえ、「見た目」じゃなくて表示させるだけがメインだった。
まぁ、でも人数が少ない現場ではプログラマーとはいえ「見た目」には多少携わらなければならなかったのが現実。
仕様書や設計書の段階で「デザイン（見た目・使いやすさ・間違い難さ）」が準備されていて、一貫していればプログラマーとしてはプログラムを「書く」だけのはずなのだが、プログラムが大きくなればなるほど一貫させていくのが難しい。

見た目

特に伝票内容の入力などは、その入力ページだけで内容が確認できなければいけなかったり（内容を通して見て不具合が無いことを確認するため）、横スクロールなんてさせられなかったりする（一目で分からないから）ものだから他のページ（画面）とは変わってくる。
一つ例外ができると、他のページ（画面）でも無理矢理詰め込んでいたのが「こっちも例外で良くない？」なんてことになる。
そんなことをしていると、全体で一貫性がなくなっていくのが現状。
これが「デザイン（見た目）」の一つ。

使いやすさ

次に「デザイン（使いやすさ）」は説明が難しい。
例えば、ページのナビゲーション（大体上の方にあって、トップページだの概要だのが一列に並んでる奴）にクリックする（押す）と細かい内容が出てくるボタンがあるとする。
「商品一覧」ボタンをクリックすると、すぐ下に「オンデマンド印刷」とか「オフセット印刷」とかって出てくる感じ。

これがフォーカスを外す（画面の矢印みたいなのが別の所にいく）と隠れてしまう。
パソコンだと「あー見えなくなった」だけど、
スマホとかだと、そもそもフォーカスを外す行動は「別の所をタップ（クリック）」だから「見なくなったものが隠れた」になる。

上記の例は「動作」がメインだけど、もっと分かりやすい例なら「ボタンの大きさ」がある。
画面（ディスプレイ）の大きさにcmを使うのは妙な気分だけど、自分が分かりやすいのでcmを使う。
パソコンだと1cm未満のボタンだって平気でクリック（押すことが）できる。
スマホだと1cm未満のボタンは押せなかったりする（当たり判定の問題）。
指の小さい人は押せるけど、指の大きい人は拡大したり何度か押したりするかもしれない。

間違い難さ

デザイン（使いやすさ）にも関連するけど、操作を間違えにくくするのもデザインの一つ。
例えば、ボタンが幾つも並んでいる場合。
ボタンが小さくて、隣との間隔が狭ければ押し間違えるかもしれない。
スマホなら特に問題で、押すときに結局はボタンが指で隠れて見えない。
パソコンなら矢印で完全に隠れてしまうことは少ないし、位置を合わせた後にクリック（選択）すればいい。
だから指で操作する端末とパソコンとで表示が変わってたりする。
幾つも並んだボタンでも、ボタンが指より大きければ間違えは少ない。

大きさだけではなく、色、形を変えて見分けを付けるのも方法の一つ。

特に、「リセット」「取り消し」など消してしまうボタンなどは色を赤くして見分けやすくするのが主流。赤が警戒色になるからね。

Webデザインで見つけただけでも、こんなにあるww
しかも、見つけた全てが絡み合って、色や形に意味があるともっと大変。

[0回]