design makes life richly.

Published: 4年 ago

Hokuriku.NET × WCAFで色彩設計について話してきた


 
2013/04/13に石川工業高等専門学校で行われた『Hokuriku.NET × WCAF』で、色彩設計について話してきました。デザイナーからプログラマーへ、そしてプログラマーからデザイナーというテーマのもと、お互いの相互理解を深めるという視点の勉強会でした。
僕の方は、色という観点で、プログラマーの方々にもデザインに興味を持っていただければなと思い、登壇させて頂きました。

今回色彩設計について話そうと思ったのも、もともと自分自身が色彩設計を得意としていなかったことから、色で失敗しないようにするにはどうすれば良いのかという事が、体感値として溜まっていたという経緯があります。
これを話せば結構面白いんじゃないのかなって思ったのがきっかけでした。
今回お話しさせて頂いた時に使ったスライドはコチラ☟

 
 

色彩設計のコツ

 

40c
色彩設計に限らず、デザインにおいて、バックグラウンドをきちんと捉えて制作する事が大切です。
ウェブサイトに訪問する際には必ず目的があって、僕たちデザイナーはその目的を達成させる為に日々デザインをしている訳です。
ユーザーがウェブサイトに求めるものを洗い出し、そこから連想する言葉を色に置き換えて行くということが必要になります。
そのイメージの対象がユーザーの年齢や性別だったり、商品のもつ特性だったりと様々ですが、それぞれの特徴を洗い出して行く事で色の組み合わせというものが出来て行くはずです。
 

18
また今回のもう一つの軸として話させて頂いたのが、どのようにコンバージョンに結びつけるのかという事に対して、ユーザーフローの設計をもとに色彩設計を考えて行くという事でした。
ユーザーに対してどのように情報を与えて、どのように訴求を行い効率よくコンバージョンに結びつけるのか。
視線の誘導に関して言えば、お話しさせて頂いた、『秩序の原理』、『馴染みの原理』、『類似の原理』、『非不明性の原理』が非常に役に立ちます。
例えば、並列する情報に対して同一トーンで配色する事は、類似の原理に値しますし、一部を目立たせようとコントラストを高めようと思ったら類似の原理に値します。
このような原理を用いて、強調度の優劣を決めて行く事で理論的に調和を保ちつつ、ユーザーに自然な視線の誘導を与えられるというわけです。
  
デザインにおいて色彩を設計するという事は、必ずバックグラウンドがあり、ウェブサイトの構成を汲み取って配色して行く必要があります。
ここを抑えて配色をしていくとよっぽどの事が無い限り失敗(ウェブサイト上の失敗)が生まれる事は無いと思います。
また、先ほど例に挙げたように、原理や法則、何かしらのルールに乗っ取って配色して行けば、色彩においての失敗も起こりづらいですし、自分お配色がおかしくないのかという事に対して客観的に見つめ直す事も出来ると考えています。その為にツールを使って、配色を確認するのも良いかもしれませんね。
   

イベントを通しての感想

 
イベントを通して感じたことは、もっとプログラマーの方との理解を深めて行きたいということ。
コード一つに対する考え方も僕とは全く違って深く深く考えているのを痛感しましたし、ウェブサイトのパフォーマンスを上げて行く為には、その部分が欠かせないという事。
やっぱりコードは欠かないと覚えられないよねって改めて思ったり、非常に刺激的で良い一日でした!
プログラマーの方々も何かの問題を解決する為に動いていますよね。
僕たちデザイナーも問題解決の為にデザインをしています。共通の目標の為に動いているのなら、もっとお互いの事を理解して仕事が出来たら、もった楽しくなりますよね!!
  

以上、今回登壇させて頂き、本当にありがとうございます。
色彩、デザインに対して少しでも興味を持って頂けたなら、幸いです。
  

Have a Comment?

WP-SpamFree by Pole Position Marketing

Some HTML is OK