2017年11月

WEBデザインで手を動かす前に整理したい2つの注意事項

クライアントからヒアリングした情報元に具体的にWEBデザインをする前に、どのように整理し、その後のデザイン、コーディング作業に生かすか、に焦点を当てたセミナー「css nite lp52」に参加して参りました。WEB業界の第一線で働かれている方々が、具体的にどのように取り組まれているかを聞き、個人的に特に有益だった情報を引用し、まとめました。

CSS Niteについて

CSS Nite(シーエスエス・ナイト)は、Web制作に関わる方のためのセミナーイベント。2005年10月にスタートし、この10月で丸10年。これまでに、510回を超える関連イベントを通して、のべ56,000名を超える方にご参加いただいています(2015年12月現在)。(サイト紹介文より引用)

http://cssnite.jp/archives/post_2950.html

1.目指すWEBサイト像を定義し、プロジェクトメンバー間で共有する。

「多くの人はデザインを個人の好き嫌いで判断する」ので、事前のプロジェクトの目的(何を目的としたサイトか、どのようなブランディングか)を一度チームのメンバーに徹底的に周知し、その情報を土台とすることで初めて、メンバー間でデザインに関する話ができるようになる。

2.デザインを話す際に使用する言語は、皆が理解しやすい「共通言語」を使用する

上記「1」で定義したブランドの印象(ブランドパーソナリティ)内容を、さらに皆が理解しやすい、「言葉」、さらに「ビジュアル」に変換していく

・ブランドパーソナリティは「見た目」「行動」「マインド」の3つに分類できる。

・見た目

ex.「個性的でセンスが良い」「楽しい工夫がある」「都会的」

・マインド

ex.「気さく、陽気、元気」「思いやりがある」「実はしっかり者」

・行動

ex.「人を楽しませる」「フレンドリー」「行動力がある」

上記フローで、クライアント、メンバー間でコンセンサスを得た「言葉」から連想される「ビジュアル」を集める。

ex.著名アーティストの作品、パーティの風景、ガーリー、シティボーイズ、など皆が実際に見て、イメージできる情報を集め、コンセンサスを得る。

ここまできて初めて、メンバー間でビジュアルに関する同意が得られる。

3.まとめ

WEBデザインをする際、下記2つのフローを踏む必要があると感じました。

1.ヒアリングした内容を、「言語」として理解しメンバー間で同意を得る。

2.「言語」として理解したものを、「ビジュアル」として表現し、メンバー間で同意を得る。

デザイナーとしてまず求められるスキルは「言語」を「ビジュアル」にする際の引き出しの多さだと思うので、様々なデザインに触れ、より表現の幅を広げることで、より結果にコミットできるデザインができると思いました。

PROFILE

Web Creator

worked as front-end Web developer with 8 years of experience in implementing websites.

Qualifications

HTML5,CSS3,SCSS,PHP,Javascript,WordPress,Dreamweaver,Photoshop