デザインについて素人があれこれ考える
WEBデザインについて考えてみる。
当方完全な初心者だけど色々考えてまとめてみたい気がしたのでまとめてみる。 WEBデザインのセオリーというか、デザインにおいてよくきくのは以下の3点
- レイアウト
- 色
- フォント
調べれば色々出てくるから、これはいい気がする。 気になるのは、結構出てくる情報が、ECサイトとかポートフォリオとか、何のサイトかと言う点において偏ってる気がする。 必要なのは業務支援系のアプリのデザインだったりするので、どうしたらいいかなーと思ってしまう。 WEBサイトの機能として分類できるとしたら、一番外側はこんな感じ？
- 閲覧のみ
- 入力アリ
一つ目の閲覧のみと言うのは、広告サイトやプロモーション、個人のポートフォリオ？ようは作成者側からの発信のみを主眼においている。 二つ目の入力あり、と言うのは、SNSや検索、業務支援系の登録処理が行われるもの、チケットや買い物などの申請が行われるもの？
個人的には、一つ目のほうはそれこそ、WEBデザインのトレンドをふんだんに取り入れて、とてもリッチな感じで作ることが出来る。 ユーザの使いやすさや見易さよりも、見せるものの印象を大事にする。
二つ目のほうを分類するなら、以下？
- 情報検索
- 申請
- 作成
情報検索はテキスト入力あるいは用意されている選択肢を検索条件としてユーザに入力させる必要がある。 また検索結果の表示は求めるものが見つけやすい、という事に重きを置かれる。
申請、と言うのは検索に続くケースが多いのかもしれないが、商品の購入やチケット購入申請、など、 ユーザによる個人情報などのテキスト手入力が必要になるもの。（デザイン外だけど、セキュリティ面での強固さが必須になる…） 入力や選択内容の分かりやすさ、必須入力などの表示、だめ文字や文字数などの入力制限、などなどが肝？
作成、はかなり広義になるけど…たとえば絵を描くことが出来るとか、写真を加工できるとか、 データグリッド等表作成…とにかくユーザからの入力がメインコンテンツになるもの。 WEBアプリケーション固有、と言う感じではなくなるが、それこそ、デザイン的な「使いやすさ」が一番大事になるのでは。
閲覧のみ、に比べてデザイン面の「格好良さ」「目を引くこと」の重要度は下がる。が、利用するに当たっての使いやすさには かなりの比重が当てられるし、業務支援とかじゃなくて、パッケージとかだったらそのまま利益に直結する問題？
業務支援系に置いては、情報検索・申請は大体引っかかってくるし、作成もある？気がする。 少なくとも自分の仕事に関して言えば、作成もかなりあった。 それぞれの特性で、必要になるデザインの重点は異なってくるので、複合的なサイトだとどうやって統一感を出すのかなとか。
情報検索において大事なのは、上にも書いたけども、検索条件の設定のしやすさ、検索結果の見易さかなと思われる。
- 検索機能が複数ある場合は、「今どの機能の検索を行っているか」がわかりやすいとよい
- 検索条件と検索結果は常時両方表示させるか否か？という点
- 検索結果に表示させる情報に詳細が必要で、画面上に占める割合を大きくしたほうがよいなら、検索条件は常時表示させないほうがいい
- 検索画面に戻る
- 検索条件の表示を小さくあるいはポップアップとして常時表示させない
- 検索結果が簡易表示で、画面上占める割合が低い。あるいは、検索を何度も行う必要がある。または、検索条件を一覧とともに情報として表示させたい
- 検索結果画面に、検索条件の表示を出したままにする（選択・設定した条件は保持させる）
- 検索画面に戻る
- 検索結果の表示方法
- リスト状態の表示（文字情報が多ければこれが一般的？詳細のプレビューとして一部を表示させるとか）
- タイル型の表示（画像情報があればこちらが一般的？画像と情報、あるいは画像のみ）
- ページング（検索結果が多量になる場合は必ず必要。画面上固定させる必要があるメニューや検索条件などがあって、且つタブレット表示前提だと、画面の一部を立てスクロールはかなり操作性が悪いので注意する） ページングを行う場合は当然検索条件が常時表示なら条件は保持するし、詳細画面に遷移後一覧に戻ると条件がクリアされているのは悲しい）
あと画面がどうしても上下に長いなら上に戻るボタンか、必須の機能をリストの下にも置いておくとか。
申請系画面において重要なのは、入力内容・入力方法・入力制限の分かりやすさ。意味合いの分割もあるとよい？
- 入力内容が分かりやすいことは、項目名の配置位置、デザイン、目立ち方？
- 入力の項目名がやたら目立つのもあれだけども
- 入力情報のまとまりが分かりやすいのは、情報が散逸しているとユーザがいらっとするだろうなという感じで
- 入力方法が分かりやすいこと、は、たとえばテキスト入力なのにテキストボックスと分からないデザインだったら、なんじゃこりゃになるし入力漏れも発生する。
- 入力制限の分かりやすさ、と言うのは、たとえば必須入力です、とか、半角カナのみです、とかそういったシステム的に制約をかける必要がある情報を、あらかじめどの程度ユーザに伝えるかという点。過剰に説明を配置するのもうざったいが…。
- 意味合いの分割は、画面上部で個人情報を入力させて、中部で任意の情報やコンテンツに従った情報を入力させておいて、再度画面下部で個人情報を入力、はあからさまにおかしいので、入力させる内容はまとまりを持たせる…という事。
作成系画面は…難しい気がするが、少なくとも「これが何の機能なのか」が分かりやすいことが最低条件だと思う。 画面の構成上ぎゅうぎゅうにつめて、結果意味の分からないアイコンの羅列は、なれる前にユーザが疲れる。 作業に順序があるなら、それに従ったツールの配置という配慮も必要だし、手順をステッパー？というのか、視覚的に認識させるのも良い。
