Webデザインとコーディングのきほんのきほん①|Tech Book Zone Manatee

マナティ

Webデザインとコーディングのきほんのきほん_試し読み

Webデザインとコーディングのきほんのきほん①

マイナビブックス・Manateeで販売中の『Webデザインとコーディングのきほんのきほん』から、書籍の内容を一部公開! Webデザインに興味のある方やこれから学ぶ人におすすめの1冊です。

 


Webデザインとコーディングのきほんのきほん

 


マイナビブックス・Manateeで販売中の『Webデザインとコーディングのきほんのきほん』から、書籍の内容を一部公開!
Webデザインに興味のある方やこれから学ぶ人におすすめの1冊です。

デザインする目的

※書籍のChapter1『デザインとは』/Section01『デザインする目的』からの抜粋です。

デザインは、情報を正しく伝えるために必要な工程の一つです。
文章やイラストなどの装飾を施して単純に見栄えを良くするだけでなく、「何を」「何のために」「誰に」「どのように」伝えたいのかを考えて、情報を成型することがデザインの基本です。
最初に「何を」「何のために」というデザインの目的について考えてみましょう。

正しく伝えるための手段としてのデザイン

できるだけ多くの人に伝えたい緊急のメッセージがあったとき、ただ単純に一般的なフォントや文字だけをシンプルに掲示したもの(図01)より、色やアイコンなどの装飾を工夫して構成したもの(図02)の方が、多くの人の目を引きつけます。
  色が持つ意味やフォントの太さ、文字の大小の違いによる強弱などから、より内容が伝わりやすくなるのです。
このように、情報を誰かに伝えたいとき、その内容や意味がより伝わりやすくなるように形を整えることが「デザイン」の基本です。情報の内容を考慮して、より伝わりやすくするにはどのような外観が適しているのか考えることがデザイナーの仕事といって良いでしょう。
どのような人にどのような場面でどのような行動を求めて情報を発信するのか、ただ単に外観に装飾を加えるのではなく、その情報が持つ内容をよく吟味して、情報を伝えることのゴールを考えることがデザインの最初の一歩なのです。

デザインすることの大きな目的

情報の整理

発信したい情報の内容を整理してそれぞれの項目に優先順位をつけることは、実際のデザイン作業では、最初に必要な工程です。
たとえば新商品の発売に関する情報なら、商品名や価格・商品の特徴を示すようなキャッチコピーがもっとも目に付くように表示の優先度が高いものとしてレイアウトします。
逆に詳細な商品スペックや使用法などは強調した表示にせず、注意深く読み込んでもらえる構成にするなど、情報の内容に合わせた整理が必要なのです。
掲載する情報にメリハリをつけることで、視線を自然に誘導したり、強調したい内容が憶えてもらいやすくなります(図03)。
 

「美しさ」による注意喚起

情報の内容を整理したら、それらが魅力的に感じられるような構成を考えます。
人は、自然のまま乱雑で不規則に置かれた状態よりも、人の手によって整えられ揃えられた構成目を引かれます。
人間は他者を必要とする社会的な生物ですから、人工的な意図を感じさせるものに自然に注意が向くのです。
一定の規則で揃えられた配置、意図的な余白などから「美しい」構成を作り出すことで、情報を受け取る側に強い印象を与えます(図04)(図05)。
   

設定したゴールへの誘導

情報を正確に伝えることだけでなく、伝えた後にどのような行動へつなげて欲しいか、そのゴールも明確に意識してデザインすることが大切です。
特に商業デザインでは、告知した商品を買って欲しい、イベントに参加して欲しいなど具体的な目的がありますから、そのためにどのような表現が適しているかを考えます(図06)。
   

伝えたい相手に合わせたデザイン

※書籍のChapter1『デザインとは』/Section02『伝えたい相手に合わせたデザイン』からの抜粋です。

「何を」「何のために」伝えたいのかというデザインの目的を整理したら、続いて「誰に」「どのように」というデザインを見せる対象についても考えましょう。
ターゲットとしたい相手の年齢や社会的背景などをじっくり考えると、どのような表現が効果的かが見えてきます。

ターゲット層による見せ方の変化

淡いピンクやオレンジなどを多用した柔らかいイメージのデザイン構成は、女性やファミリーを想起させ、独身男性には見過ごされやすくなります。
細かい文字やコントラストの強い配色で構成されたイメージは、高齢者には読みにくく敬遠されてしまうでしょう。
情報をどれほどわかりやすく整理し美しく構成していても、伝えたい相手に好まれる表現方法になっていないと、伝えることは困難です。その情報を「誰に」伝えたいのかターゲットとする相手を考え、その相手には「どのように」表現することが効果的かを考えてデザインすることが大切です(図01)。
 
見せ方を変えるための具体的な方法は、使用する色の組み合わせ、大きさ・フォントなど文字に関する処理、写真やイラストなどの表現方法、余白の取り方、パーツを鋭角・曲線にするかなど、デザインを構成する要素それぞれで考える必要があります。
ターゲット層に合わせてそれぞれの要素を選定すれば、結果として統一感のあるイメージにまとめることができるでしょう(図02)。
   

ターゲット層の主な分類

性別・年齢による分類

もっとも一般的なターゲット層の分類方法は、性別・年齢によるものでしょう。
「男性向け」「女性向け」「低年齢向け」「シニア向け」など性別・年齢により明確に利用者が分かれる商品も多く、もっともわかりやすい分類ともいえます。
この分類を第一段階として考え、さらに「社会的背景による分類」「嗜好による分類」と組み合わせたターゲット層を想定すると、「誰に」伝えたいかということがより明確になるでしょう(図03)(図04)。
   


マイナビブックス・Manateeで販売中の『Webデザインとコーディングのきほんのきほん』から、書籍の内容を一部公開!
次回はChapter2『デザインのベーシックセオリー』の一部内容を公開予定です。

著者プロフィール

瀧上 園枝(著者)
グラフィックデザイナー。有限会社シアン代表取締役。印刷物やウェブサイト、アプリなどデザインワーク全般を担当。
主な著書に『現場でなければ学べない! クライアントの難題に応える デザインテクニック』『Illustratorデザインの教科書』『Illustrator 魅せるデザインテクニック事典』『サンプルで学ぶ 魅せるスマートフォンサイト・デザイン』(以上、マイナビ出版)『やさしいデザインの教科書』(エムディエヌコーポレーション)など。