コンセプトからのビジュアルデザイン開発

12/7(月)にPOINT OF VIEW #1という勉強会に行ってきました。
POINT OF VIEWでは、デザイナー視点でのWeb制作をディスカッションするというコンセプトの勉強会の様です。

コンセプトからのビジュアルデザイン開発

今回参加させていただいた#1のテーマは「コンセプトからのビジュアルデザイン開発」ということで
参加者が、お手本となるWebサイトを持ちより、そのサイトを見ながら、どのように生み出されたものなのかを読み解く。
といった内容です。

良いデザインの定義

実際にサイトを見て良く前に、参加者の自己紹介と
自分にとって、「良いデザインとは何か」を一言で言っていきました。


参加者の方の意見をまとめると、大体以下の様にまとまります。

  1. 伝わる
  2. わかりやすい
  3. 売れる
  4. グッと来る


私は、「一目見て、それが何なのかが分かる」ものが「良いデザイン」だと思っているので1,2番目の意見入りますかね。
全体的に「わかりやすい」という意見が多かったです。


見直してみると、「サイトを見てグッときた→内容がわかりやすい→売りたいもの、提供したいものが伝わる→売れる」の様な同一線上にある気がするのが興味深いと思います。

良いデザインのサイトを見ながら、それがどのようなコンセプトから生み出されたものなのかを考えるヒントにする

以下のサイトを見ながら、そのサイトのコンセプトやキーワードを切り出していきました。

HI.SCORE Kitchen

渋谷のカフェのサイト。

  • シンプルだけど、アメコミ調でキャッチーな要素もある
  • 実は迷いにくく、直感で動かせるサイトである。
  • 一目見て楽しそうな雰囲気が伝わる。
スキンケア大学

スキンケアのハウツー系のサイト

  • 余白が多いわりに、それを感じさせない
  • 余白が気持ちイイ
  • 女性らしい、女性が好きそうな色使い
  • 学校というサイト名よりも硬さがなくて、いい感じに力が抜けてる
  • アイコンで優しさが出てる。さっぱりしてる
  • キーになるアイコンがある。
キャラリー

キャラクター制作&販売サイト

  • コミカルな印象、ポップな割に下品じゃない
  • 見た感じポップだけど、ガッツリ構成されてる。
  • 好みは分かれそう。
  • かわいいキャラクターを作ってくれそう。
  • いい意味で賑やか、悪く言うとごちゃごちゃしてる。
  • サイト名から想像した感じ通りで、裏切られない
  • 入り口は賑やかだけど、中に入るとちゃんとナビゲーションがある。
サクラクレパス

クレパスのメーカーサイト

  • 優しい。
  • トップページで、対象者別のナビゲーションがある。
  • 年齢層毎にサイトのテイストが分けられてる。大人用だと明朝体とか。先生は黒板
  • パステルカラーの配色が上手
  • 手描きっぽい直線を使ってて好印象
  • 何屋かがすぐわかる。
  • パステル系のデザインは残念な感じになりやすいが、それが無い。
  • 小さい頃を思い出させるデザイン(ヘッダのスケッチブックを切り取った背景)
いきものみっけ

生物の観察報告を集めた温暖化影響調査サイト

  • ロゴがレトロな感じで、アナログぽい印象をあたえる
  • 何ができるかというのが明解
  • カテゴリが色分けされててわかりやすい。
  • 視覚要素が角丸など、統一感がある
  • 全体的にかっちりしてるけど、調和が取れてる


今回のサイトの中では、いきものみっけが印象に残っています。
一見、固いサイトなのかなと思いきや細部が可愛かったり
レイアウトはかなり王道だけど、細かいところでカラフルだったりして
デザインされてるけど、見ていて疲れないという印象がありました。


全体の雰囲気を感じ取ってから、ディティールに目を向けると
そのサイトの構成から、アイコン、画像の様なディティールに対する目が鋭くなるな
というのが、今日の収穫です。


普段、何気なくサイトを見る時にもこんな視点で見てみようと思えた勉強会でした。
#ネット環境がなかったのは辛かったです:(