Webデザイン

サイトレビューとは

webデザインを勉強し始めると、
「たくさんデザインを見て、引き出しを増やしましょう!」
と言われます。そして勉強法の一つとして「サイトレビュー」があります。

これからデザインを勉強する人へ
サイトレビューってどんなことをするの?
サイトレビューする意味は?
どんなことが勉強に繋がるの?

サイトレビューする理由

「デザインの言語化が重要」とよく聞きます。
デジハリの初めてのクラス授業の課題は、「好きなサイトデザインを見つけてきて、なぜそのデザインが好きなのかプレゼンする」というものでした。
実際にデザインをする時、デザインを伝える力はデザイナーにとっては必須スキルです。
クライアントへ要望・課題のヒアリング。その課題をデザインを通してどう解決していくかを提案する力が重要です。

デザインの説得力

卒業制作の企画書を作っている時、私がコンセプトに悩んでいる時のトレーナーの方のアドバイスが印象に残っています。
「塾のHP制作を依頼されて、色の提案をした時の話。ベースを白に、落ち着きのある青を提案したの。その時のプレゼンで、子供たちの可能性は無限大で、これから自分たちの未来に向けた色を足していってほしいという思いで、ベースに白をあえて提案した。」
デザインを作る時に、「なんとなく、この色がいい感じだから。」と容易にデザインしてはいけないんだと、気付かされました。
全てのデザインに理由を説明できる。それこそが、信頼されるデザイナーなんだと感じました。そこで、サイトレビューをして、デザインの言語化の練習をしているわけです。

参考になった本

「Webデザインのロジック」

Webデザインのロジック 同業者に語りたくなるコンテンツイメージとブランディ [ フレア ]

59のサイトが掲載されており、それぞれの制作目的が理解できる構成になっています。
「ねらい」と解決策である「キーコンセプト」「デザインコンセプト」が載っていて、
どんなふうにサイト分析をしたらいいのか、のヒントになりました。

サイトレビューのやり方

①参考サイトでデザインを探す
Muuuuu.ORGや81-web.comをよくチェックしています。
その時作ろうとしているサイトの参考になるデザインをチェックしたり、自分ではなかなかデザインしないテイストのものを選んだりしています。

②検証ツールを使ってカラーとフォント、フォントサイズを調べる
特にフォントサイズはよく気にしています。
いざ、自分でデザインするときにH2タグって、通常どれくらいの大きさが平均的なのか、ということの目安になります。
また、文字のジャンプ率でどんな印象を与えるのかの参考にもなります。

③サイトのターゲット層とゴールを考える
ペルソナ設定をサイトを作る時にするのですが、その練習になります。
年齢、性別、ライフスタイルなど。サイトのゴールは何か、を言語化します。

④サイトのコンセプトを考える
ゴールに対して、どんなデザインで解決に導くのか考えます。
設定されているフォントやフォントサイズが与える印象から、それらをデザインに使用する狙いにつなげています。

⑤サイトレビューをまとめる
ツールはいろいろあります。noteでまとめている方も多く見かけます。noteはツイッターとの連動がいいので、勉強ログとしておすすめです。
私は、アナログにノートにまとめて、そのノートを振り返ってみることを楽しみにしています。

さいごに

デザインを言語化することは、とても難しいです。
私もとても苦手で、「なんとなく」考えてしまうところがあります。
SNSでは「1日1サイトレビュー」と調べると、たくさんの方の勉強ログを見ることができます。
同じ目標を持って勉強している方に元気をもらい、私も日々励んでいます。