KEN WEB BLOG ~WEB・DTPスクール パソコン教室 KENスクールのインストラクターがつづるブログ~

サイトを作る上で必要不可欠なこと。

それは、良いサイトを参考にすることです。

みなさんは普段どんなサイトを見ていますか？

普段から見た目の良いサイトをたくさん見ておくと、

いざサイトを作らなければいけない時に

イメージに合うサイトを参考にする事が出来ます。

では、どんなサイトが良いサイトと言えるのか？

1. 見た目の良いサイト（かっこいい、かわいいなど）
2. 分かりやすいサイト（すぐに見たいページに行けるなど）

見た目の良い又は分かりやすいサイトのリンク集を普段から作成しておくことで

自分のサイトデザインの幅を広げておくことができます。

参考サイト

• http://www.ikesai.com/
• http://www.kenschool.tv/

普段から意識して、自分の主観を持っておきましょう。

 --------------------------------------------------------------------------------

パソコンスクール KENスクール京都校　Webインストラクター
http://www.kenschool.jp/school/kyoto/index.html

KENスクールでサイトデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

「クリックしたくなるリンク」

クリエイターとして、この一文を見て興味を抱かない人はいないですよね？

インターネットコムとgoo リサーチから

定期的にネット広告に関するインターネットユーザーの意識変化を追っていく

「ネット広告に関する定期調査」と言うものが報告されており、

今回で11回目にも上るようです。

その気になる調査結果の結論を先に申し上げますと、

「クリックしたくなる」のはテキストよりもディスプレイ広告ということです。

調査の対象は、全国10代～50代以上の1078人のインターネットユーザーで、

男女比は男性52.4％、女性47.6％とのこと。

「広告リンクをクリックしたことがある」と回答した方は69.5％（749人）で、

約7割の人に認知・浸透しているとの数字が出ております。

また、検索した際にそのような広告リンクを「必ず見る」「よく見る」と答えた人は

58.5％と、リンクの遭遇率は6割近いとのことです。
 

反面、「めったに見ない」と答えた人は6.5％（49人）だけだそうです。

ユーザーの興味を示すような広告リンクをユーザーに分りやすく配置すれば、

効果的にクリックしてもらえるということですね。

ではその中で、「クリックしたくなるリンクは？」

やはりここが一番気になるところですよね！

それは、、、

「バナーや画像、Flash など」

が最も回答を集めたようで、約半数の48.5％（523人）を占めていたようです。

やはり、「バナーや画像、Flash など」のような

視覚的効果のある広告は伝わりやすいということですね。
 

自分自身に置き換えて考えてみても、同様の回答をするかと思いました。

ということは、、、

そのようなサイト製作を心がけていかないといけない。

ということです。

バナーというのは最小限のスペースで載せる事ができ、

なおかつ有益な広告なので、サイト内に含めない手段はないですよね。

Flashにおいても、ただムービーを流すだけでなく、ActionScriptを取り入れて、

Flash上で様々な制御ができるようなサイトを考慮していかないといけませんね。

要するにユーザビリティをしっかり考えて制作しないといけないということですね。

皆さんも、ポートフォリオに取り入れてみてはいかがでしょうか？

 --------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでサイト製作の極意を学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html
 

初心者、未経験者がデザインスキルを上げるにはどうすれば良いか、

色々と考えてみました。
 

今までの１０年間近くのネタをまとめ、

どのように考えて、どのように行動すればデザインスキルが上がるのか

改めて見つめ直してみました。
 

そうしたら、なんとたった２ページで収まりました。
 

そんなもんで良いのです・・・デザインは。

でも、この２ページものすごく濃いです。
 

まだ、ラフなのでこんなのしか見せられませんが・・・

 


ここに書いてあることを実行すれば、ある程度のデザイナーになれます。

なんらかのカタチで世に出していきたいと思います。

--------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでWebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

皆さん、こんにちは。

4月は暖かかったり、寒かったりの繰り返しで、
なかなか過ごしにくい気候でしたが、体調を崩すことはなかったでしょうか？
 

5月に入り、例年のような過ごしやすい気候になって欲しいものです。


さて、今回は「コンプリメンタリー」についてです。

「コンプリメンタリー」とは、「補う」と言う意味になります。
 

下図の色相環をご参照ください。

色相差でいうと、11～12の間になります。
 

色相の角度でいうと、165～180度です。
 

多くは180度の位置の色を使うことが多いです。

この色相環で180度反対の位置の色のことを「補色」と言います。

派手な印象を与えますが、力強い中にもバランスのとれた配色となり、
どちらかと言えばオポーネントよりも、個性的にしたい場合に有効です。
 

下の絵をご参照下さい。



色相環で反対方向に位置する色同士の配色になります。
 

黄色-青色の組み合わせと、赤色-緑色の組み合わせでは、
純色の明度差が異なるため、配色の方法も変わってきます。

例えば、赤色と緑色の配色については、
ややトーンに変化を持たせて、明暗に差をつけると言う感じにします。

そうすることにより、安心感のある配色となります。

この配色は色相の対照性と、
どのように表現するかを、意識する必要があります。

さて、色相差による配色については、
これで全てになり、今回で終了となります。

次回からは、どういった内容でいこうか、もっと深く突っ込んだ色のお話をしようか、
全く違う内容にしようか、思案中でございます。

皆様に少しでも役立つ情報をお届けしたいと思います。

次回のブログもご期待いただければと思います。

--------------------------------------------------------------------------------

パソコンスクール KENスクール大宮校　Webインストラクター
http://www.kenschool.jp/school/omiya/index.html

KENスクールでwebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html
 

皆さん、こんにちは。

最近、家のベッドが壊れました。
 

10年以上よくもってくれたし、 さすがに壊れたベッドでは寝にくいので、
早速、新しいものをカタログを見て頼みました。

で、実際に届いたのですが･･･。
 

カタログを見たときは、
「この色いいなぁ～。自分の部屋と合うなぁ～。」
と、思っていたのですが、
 

実際届いてみると、なんか微妙に合いません。

皆さんもこのようなご経験はありませんか？
 

と言うことで、今回は「色の面積効果について(色の錯覚編。最終回)」です。

色を小さな面積で決めてしまうと、
大きな面積になったとき、明るさや色味に差が生じます。

これを「色の面積効果」といいます。

下の絵を見てください。


明るい色は小さな面積で見た場合に比べ、
大きな面積になると、いっそう明るい色に見えます。
 

赤などの有彩色では色味もやや増したように感じます。
 

逆に、暗い色は小さな面積で見た場合に比べ、
面積が大きくなるにしたがって、いっそう暗い色に見えてきます。
 

赤などの有彩色では彩度もやや低くなったように見えます。

このように明るさや色味に差がでるだけでなく、
イメージも変化して見える現象を色の面積効果と呼んでいます。

このことを知っていた時点で、本当は最初から、
少し色味が変わってくるということは、分かっていたことなのですが･･･。

次回からは、色の分類について書いていきたいと思います。

--------------------------------------------------------------------------------

パソコンスクール KENスクール大宮校　Webインストラクター
http://www.kenschool.jp/school/omiya/index.html

KENスクールでWebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html
 

WEBサイトを作成するとき、誰しも
デザイン性を重視したWEBサイトを作成したい
と思うはずです。
 

クライアントと話をし、これぞというデザインができあがり無事に公開を果たす…。

さて、みなさんはこれから就職活動などをするために自分のサイトを作成したり、
会社にお勤めの方であれば会社のWEBサイトを作るということもあるかもしれません。
 

そうした時に忘れてはならないのが「アクセシビリティ」と「ユーザビリティ」です。
 

アクセシビリティは「ユーザーがサイトを使えることを保障」することを言い、
ユーザビリティは「ユーザーにとって使いやすく分かりやすく」することを言います。

WEB創成者のティム・バーナーズ・リー氏は

「WEBのパワーはユニバーサル性にある。
障害の有無に関係なくだれもが利用できることこそがWEBの本質である」

と延べています。

こういった考えから、すべてのユーザーが平等にWEBサイトを閲覧できるような
仕組みを考えることは非常に重要なことであり、WEBサイトとしての願いでもあります。

今回は数多くあるアクセシビリティの考えから
「配色」について簡単にチェックするツールがあります。
 

「ColorSelector」というツールですが、
文字色と背景色のコントラストの差などを分析して、
一般の人や白内障の人などに最適な配色設定かどうかを
簡易的に見ることができるツールです。
 

自分で見ている世界が当たり前と考えず、
状況によっては自分の作ったWEBサイトが皆と
同じように見れない方もいるということを常に考えながらWEBサイトを作ってみましょう。
 

富士通のサイト
http://jp.fujitsu.com/about/design/ud/assistance/colorselector/

--------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでwebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

皆さん。こんにちは。

4月に入り、私にとって大敵のあるモノが飛び回っております。
そう！花粉です。
 

アレルギー性の鼻炎と、花粉症を併発する私にとって、
この季節は寒すぎず、暑過ぎず好きな季節なのですが、
これだけはどうしても勘弁できません。


早く収まって欲しいものです。


さて、今回は「オポーネント」についてです。
 

下図の色相環をご参照ください。

色相環で言うと90度あたりにある色同士を組み合わせる配色になります。

色相差でいうと、8～10の間になります。
 

色相の角度でいうと、120～150度です。

派手すぎず、
コンプリメンタリー(こちらに関しては次回詳しくお話します)よりもおとなしく、
調和しやすい配色になります。
 

前々回、ご紹介したアナロジーと違って、
コントラストが効いていて、クッキリした印象にしたいときに有効です。
 

下の絵をご参照下さい。


色覚的に均等関係にある色とされます。
 

ほぼ、補色の関係になりますので、
お互いの性質を強調する色の組み合わせとなり、
かなり強い印象を与える配色となります。

色みの違いが大きいことから、彩度が高い色同士の組み合わせだと、
色の違いがはっきりしすぎるので、
トーンで差をつけ調和する場合が多いです。

さて、次回は、
途中にも出てきたコンプリメンタリーについてお話したいと思います。

--------------------------------------------------------------------------------

パソコンスクール KENスクール大宮校　Webインストラクター
http://www.kenschool.jp/school/omiya/index.html

KENスクールでwebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

皆さん、こんにちは。

先日の雪の日は、とても寒く足元も大変悪かったのですが、
受講生の方々はキャンセルする事もなく、皆様には来校いただきました。

ありがとうございます。


さて、今回は「インターミディエート」についてです。
 

下図の色相環をご参照ください。

色相環で言うと、90度あたりにある色同士を組み合わせる配色になります。

色相差でいうと、4～7の間になります。
 

色相の角度でいうと、60～105度です。

中国や日本の和装でよく見かける組み合わせで、
オリエンタルな配色と良く言われます。
 

下の絵をご参照下さい。


しかし、その調和の取りにくい形式なので、
類似性も対照性も 感じることができません。

デザイン意図のハッキリしない配色になってしまいます。

色同士対立しながらも、共通性を残している印象になります。

用途として、中程度のコントラストをつけたいときに使います。

ただし、あいまいな雰囲気になるため、スッキリ見せようとする場合には、
あまり向いていません。

また、相反する2色同士が並びますので、強い対比を起こしてしまい、
グレアー効果という、チラツキを起こしてしまう欠点もありますので、
使用には注意が必要です。

雪の話しに戻りますが、次の日にはすっかり解けてしまいましたね。

個人的にはもう少し積もって欲しかったので、ちょっと残念です。
 

次に雪が降るときには、もっと積もって欲しいです。

でも、寒いのはとても苦手なんですけどね。 

--------------------------------------------------------------------------------

パソコンスクール KENスクール大宮校　Webインストラクター
http://www.kenschool.jp/school/omiya/index.html

KENスクールでWebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html
 

インターネット上に面白いサイトがあります。
 

30秒ドローイングというサイトなのですが、
画面上に表示されるポージングを30秒以内に描写し、
時間が経過すると次のポージングが表示されます。

延々とこの作業を繰り返すだけなのですが、
やりだした当初は、かなり難しく細かな線を正確に描写しようとしてしまうのですが、
段々とやり進めていく内に、おおざっぱにポージングを描写できるように
なってきます。

一種のトレーニングとして紹介されているのですが、
短時間でモノの特徴を把握する力と、
最小限の情報量で情報を伝達する力が養えるとのことです。

仕事をしていく上で、重要な情報収集作業と情報を整理する力を
形は違えど、こうしたトレーニングでつけることも面白いのではないかと思います。

例えば、打ち合わせの最中に
自分の情報を言葉として伝えるのではなく、簡単なイラストなどを添えることで、
相手を視覚的にイメージしやすい状態にすることも可能で、
受け取る相手は思いのほか感動します。

現在はデジタル社会ですが、アナログの面白みやデザインすることの面白みを
違った方面からチャレンジするということも大切なことです。

30秒ドローイング

http://www.posemaniacs.com/pose/thirtysecond.html

 --------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html
 

KENスクールでwebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html
 

DTPを勉強していく上でデザインは欠かせないもの。
 

デザインの中でも「ユニバーサルデザイン（Universal Design）」
というのがあります。

ノースカロライナ州立大学のユニバーサルデザインセンター所長であった
ロナルド・メイス氏が提唱し、文化・国籍・性別などを超え、
できるだけ多くの人が利用可能であるようなデザインにすることを言います。

ユニバーサルデザインには「7原則」があります。

• 原則1.　誰でも公平に使えるものであること
• 原則2.　使う上での自由度が高いこと
• 原則3.　使い方がわかりやすく、理解しやすいものであること
• 原則4.　必要な情報が、どんな人にでもきちんと伝わること
• 原則5.　安全であり、万一の事故に対する対策を持つこと
• 原則6.　自由、快適に使えること
• 原則7.　使いやすい大きさと広がりが確保できること

すべてにこれを満たしていくのは難しいけど、
「誰にでもやさしいデザインをする」のは大事ですよね。

• 「事実」や「伝えたいこと」を明確にする
• 「最低これだけは伝えたい」ことを、はっきりさせる
• 行間・文字間に注意する
• 太字や大きな文字などを効果的に用いて、メリハリをつける
• 目を引いて、読む気を起こさせる
• 言葉での説明より、図や写真を用いた方が、わかりやすいものもある

など制作の中で考えてデザインしましょう。

ユニバーサルデザインについて、この本もオススメです。

読んでみてください。

「+DESIGNING」

http://www.plus-designing.jp/

--------------------------------------------------------------------------------

パソコンスクール KENスクール池袋校　Webインストラクター
http://www.kenschool.jp/school/ikebukuro/index.html

KENスクールでWebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html
 

インターネットに少し変わった面白いサービスがあります。

googleのような文字を作成してくれるサイトが紹介されています。

http://googlefont.com/

使い方はいたって簡単で、
テキストボックスに任意の文字を入力して「Create logo!」というボタンを押すと、
画面上にgoogle風のテキストが表示されます。

色合いが気に入らない時は、
再度「Create logo!」を押すと色違いパターンが作成できます。

「download logo」というボタンもありますが、
ロゴの上で右クリックすることでも画像として保存することが可能です。

機能は違いますがAIRを使用したアプリケーションで、
任意の文字を入力するとアイコンが作成できるというものも存在しております。
 

このように、任意の文字を入力するだけで
自由にデザインしてくれる機能を使用することで、
デザインの幅が広がったり、配色をする上での参考になったりします。

残念ながら半角英数記号にしか対応はしていないので、
日本語でのロゴは作成できませんが、
様々なサービスや機能を使用することで作業効率を上げたり
デザインパターンを参考にしたりすることができるようになります。

--------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでwebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

--------------------------------------------------------------------------------

KEN School　関西方面オープンしました!!

【関西ブログ】
http://www.kenschool.jp/info/contents/blog_kansai.html

【関西オープンページ】
http://www.kenschool.jp/info/contents/op_kansai.html
 

先日、10数年ぶりに友人と会いました。

久々の再会だったのですが、その友人は幼少の頃からから
「赤が緑に見える」等、違う色に見えると言っていたのを思い出しました。

当時、私は友人が違う色を言っている時「何言ってるんだよー」
なんて思っていたのですが、小学生の時に分かるはずもなく、
大人になって改めて実感させられました。

色覚障害の持ち主ということです。

調べてみると、
「日本人の男性20人に1人、女性500人に1人、色覚障害の人がいる」
と記載がありました。
 

正直、そんなに多いとは考えておりませんでした。

私は、Webサイトや広告、ポスター等を制作する際、
配色のバランスは当然意識しております。
 

しかし、『違う色に見える』というのは深く考慮しておりませんでした。
 

反省しております。

何が言いたいのか？と言いますと、
『正常な視力の人のみがWebサイトを閲覧しているのではない』
ということです。

勿論、img要素にはalt属性を付けておりますが、画像だけではなく、
文書や背景色等も意識しなければならないということです。

読みやすい文字にするために、明暗の差を出す
というのは皆さんご存知かと思います。
 

コントラストも同様で、その差が大きいほど文字は読みやすくなります。
 

ですので、明暗の差とコントラストの差を意識しなければいけないということです。

東京大学の教授や、日本塗料工業会など共同で、
色覚障害や白内障の人にも見やすい色見本を昨年5月に作成したそうです。
 

色覚障害の人が見分けにくい色は分かっていたそうですが、
色覚障害の人達に考慮した色見本の作成は今回が初めてだったようです。

どのような色見本なのかといいますと、
「色覚障害を持っている人と持たない人を、延べ40人程度集め、
2000種以上の色の紙を見てもらい、全員が認識できる20色を選び出した。」
ということらしいです。

2000種類以上もの中から、20色ってすごいですよね。
 

これらの色を使って、今後は様々な用途で
色覚障害者に考慮したものを作ることができると思いますし、
WebやDTP等のデザイン業界でも徐々に浸透していくかと思います。

富士通のサイトでは、色覚障害の人の見え方をシミュレーションする
ColorDoctorというフリーソフトが配布されております。

http://jp.fujitsu.com/about/design/ud/assistance/colordoctor/download.html

また、色覚障害の人や白内障の人に配慮した
文字色と背景色の組み合わせをチェックできる
ColorSelectorというフリーソフトも富士通のサイトで配布されております。


見やすさを○と×で表記してくれるソフトです。

http://jp.fujitsu.com/about/design/ud/assistance/colorselector/download.html

皆さんも、配色の際には是非活用してみてください。

--------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでWebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

--------------------------------------------------------------------------------

KEN School　関西方面オープンしました!!

【関西ブログ】
http://www.kenschool.jp/info/contents/blog_kansai.html

【関西オープンページ】
http://www.kenschool.jp/info/contents/op_kansai.html

KENには「極グラフィック」という授業カリキュラムがあります。
 

PhotoshopやIllustratorのソフトは使えるけど、
「デザイン」ができない…という方や、「いつもなんとなく作ってます」という方に、
キチンと商用デザインのルールを意識して作っていただく
（「デザイン」する）という内容です。

そして、その講座の中に「名刺のデザイン」があります。

名刺という小さな紙の中に、どんな情報を入れなくてはいけないか、
どんな風に、どんな人が使うのか、などなど考えて文字などを配置します。

偶然見つけたインターネットの記事の中に、
アートディレクター/クリエイティブディレクターの佐藤可士和さんの
「名刺について」の記事が掲載されていました。

その中で「名刺はシステムのデザインだ」というような
名言があったのでご紹介します。

うーん、たしかに！

実際に作ってみるとわかると思いますが、
なんでもかんでも載せたらいい名刺にはなりませんし、
文字間隔や大きさも、ほんの少し変更を加えるだけで「収まった感」が変わります。

興味のある方は読んでみてください。

http://xbrand.yahoo.co.jp/category/product/3804/1.html

 --------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでWebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

--------------------------------------------------------------------------------

KEN School　関西方面オープンしました!!

【関西ブログ】
http://www.kenschool.jp/info/contents/blog_kansai.html

【関西オープンページ】
http://www.kenschool.jp/info/contents/op_kansai.html
 

皆さん。こんにちは。

ここ数日、大変寒くなっていますね。


皆さんも病気にはお気をつけください。

さて今回は、アジェイセントについてお話したいと思います。

アジェイセントとは、
隣接色相配色（りんせつしきそうはいしょく） とも言い、
色相環で隣り合った色同士の配色のことを指します。

下図の色相環をご参照ください。

色相環の中に書いてある数字を色相差といいます。
 

アジェイセントはこの色相差が+1～-1の色を使用します。
 

角度で表すと基準の色から15度の色を使用することになります。

例えば、黄色を選択した場合、
黄色は上図で言うと0にあたりますので、
色相差が1である、
黄色みがかった黄緑か、黄色みがかったオレンジになります。

こちらの配色方法も
同一色相配色と同じく、組み合わせやすい配色になりますが、
注意が必要です。
 

下図をご参照ください。

赤と青、上下ともに、
左の色に色相を15度ずらした色を、右側に置いています。

こうすると明度と彩度が同じため、色の変化がわかりにくいです。
 

そのため、変化に乏しくなることが多く、不調和になりやすいです。

そこで明度や彩度に大きく変化をもたせると良いかと思います。
 

このような感じです。

アジェイセントは上手に使えば、アイデンティティーよりも色の変化もありますので、
自然な配色になるといえるのではないでしょうか？

ちょっと、長くなってしまいましたが、
次回は、トーン・イン・トーンについて、
お話したいと思います。

--------------------------------------------------------------------------------

パソコンスクール KENスクール大宮校　Webインストラクター
http://www.kenschool.jp/school/omiya/index.html

KENスクールでwebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

みなさん、こんにちは。
 

今更ではありますが、今年は冷夏ということで、
そんなに暑くもなく、過しやすかったようですね。

ただ暑いのがこの上なく苦手な私には、
やっぱり例年通りの、暑い夏でした。

そんな、夏の終わりに急激に寒くなってきて、
風邪を引いてしまいました。

皆様も、インフルエンザなどのこともありますし、
体調には十分注意をしていただければと思います。

閑話休題。

前回、お話させていただいたように、
今回から「色の調和」についてお話させていただきたいと思います。

まず一つ目は、「アイデンティティー」です。
 

普段だとアイデンティティーというと、
個性であるとか、同一とかという言葉で表現されることが多々あるかと思います。

この場合ですと、同一という言葉で表すのが、近いかなと思います。

つまり、配色において、「アイデンティティー」とは
同じ色相内で配色をすることとなります。

こちらがサンプルになります。

全体の色合いをキレイに統一することができ、
まとまり間の表現しやすい配色になります。
 

用いる色によって印象が変わります。
 

上記のことから、
統一感があり、シンプルで上品な感じがします。
 

また色相が絞られるので、配色のテーマが分かりやすい
という特徴もあります。
 

しかし静かでおとなしく、溶け込んでしまいやすいので、
表現が目立ちにくくなってしまいます。

これをトーン・オン・トーン配色と言います。

次回は、二つ目として、
アジェイセントについてお話したいと思います。

それではまた・・・。

--------------------------------------------------------------------------------
ブログ更新管理者より

年内の記事更新は本日で最後です。
本年もご愛読ありがとうございました。

来年は1月4日から更新再開の予定です。
よろしくお願いいたします。
--------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでwebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

WEB雑誌を読んでいて発見したのがこのColorSelectorです。

http://jp.fujitsu.com/about/design/ud/assistance/colorselector/

みなさん制作をしていて悩むものの一つに
”配色”があるんじゃないかと思います。
 

色は、さまざまなイメージをユーザーに与えることができます。
 

しかし間違えると、何を伝えているのか分かりづらい媒体に
なってしまう可能性もあります。

難しいですよね。色を決めるのって・・・
 

さらに頑張って配色を決定したのに
実はとても見づらい色の組み合わせだったら・・・

そんなことにならないために、このColorSelector！

ColorSelectorについて--------------------------------------------------------------
 

誰もが読みやすい色ですか？
 

ColorSelectorは、背景色と文字色の見やすさを判定するソフトウェアです。
 

指定した背景色と文字色の組み合わせを
「一般」、「白内障」、「第一色覚（赤）」、「第二色覚（緑）」、「第三色覚（青）」で判定し、
結果を表示します。

ColorSelectorは、スポイト機能により、
診断したい色の組み合わせを簡単に指定できます。
 

これにより、ウェブサイトだけでなく、
プレゼンテーション資料の作成もアシストします。
 

色のRGB値を直接入力したり明度を調節することで、迅速な色調整も可能です。

※http://www.apple.com/jp/downloads/macosx/internet/colorselector.html
から文章引用

配色が苦手な方、アクセシビリティを考慮したWEBサイトを目指している方
こんな便利なソフト、使ってみてはいかがですか？

--------------------------------------------------------------------------------

パソコンスクール KENスクール横浜校　Webインストラクター
http://www.kenschool.jp/school/yokohama/index.html

KENスクールでWebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

先日、ちょっと気になることがあり名古屋に行ってきました。
 

気になるモノそれは何か？

「ラーメンフォーク」です。

これがものすごく気になってしまいまして、実物を見てみたい・・
そして、使ってみたいなと思い、名古屋まで足を運んだのです。

ラーメン通とかではないのですが、常々感じていたことがありました。
 

それは、ラーメンを食べる時につゆと麺を一緒に食べられたら、
きっと美味しいのだろうと。

そう思っていたところ、たまたま、表参道を散歩中に出会ってしまいました。
 

「ラーメンフォーク」に!

情報収集していたら・・

名古屋に実際に使っているラーメン屋があるんです…というか
このラーメン屋のために作られたものだったのです。

ということで「ラーメンフォーク」を求めて名古屋に行ってきました。
 

実物を実際に使ってみました。
 

良いデザインです。

で後日・・たまたま新聞を見ていたら、「ラーメンフォーク」の記事があり、
記事の中でデザイナーの子供（４歳）が「スープ飲めるし、ツルツルも食べられる
おかーちゃん、これいいね！」って言ったそうなんですが、もちろん
この子供はこの「ラーメンフォーク」を作ったのが自分の母親であることを
知りません。

デザイナーである母親はものすごく嬉しかったそうです。

そう、デザインの本質である「何も言わないで自分の意図が素直に伝わる」
という事が嬉しかったと書いてありました。

たぶん、デザインをしていて一番嬉しいときでしょう。
 

デザインワークは恐怖との戦いであり、精神力を相当そがれます。
 

「伝わる」…そんな瞬間のためにデザインをしている。

そんな自分がいます。

そんな気がしました。

 --------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクターhttp://www.kenschool.jp/school/shinjuku/index.html

KENスクールでWebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html
 

一般的に「カラー印刷」と呼ばれている印刷物は、プロセスインキである
シアン（C）、マゼンタ（M）、イエロー（Y）、ブラック（K）の4色で印刷されています。
 

カラーモードのＣＭＹＫですね。
 

拡大して見てみると、
この4色の点が重なりあって色を表現しているのが見えてきます。
 

点の割合を変えることによって色が変わります。
 

点が小さくなれば薄く見えるし、大きければ色が濃く見えます。
 

例えば、緑を作りたいのであれば、
シアン（C）を100％、イエロー（Y）を100％で出来上がります。
 

黄緑色なら、イエローの割合を多めに
シアン（C）を40％、イエロー（Y）100％で指定すればいいですし、

青が強めのエメラルドグリーンならに
シアン（C）を100％、イエロー（Y）40％で表現します。
 

DTPデザイナーやグラフィックデザイナーは
この数値の割合を全部把握して色を作り出しています。

そんなの、無理！っていう方にはお勧めのカラーチャートをご紹介します。

印刷色見本　ＤＩＣプロセスカラーチャート

http://www.gande.co.jp/DIC/DIC-SEL.html

どの色を何％ずつ混ぜれば、どんな色になるか一目でわかります。
 

それに、モニターで見る色はＲＧＢなので
紙に印刷するとなんか違ってしまった！なんて経験はありませんか？
 

そういった問題も解決できます。
 

印刷関係に興味がある方はぜひ参考にしてみてくださいね。

--------------------------------------------------------------------------------

パソコンスクール KENスクール横浜校　Webインストラクター
http://www.kenschool.jp/school/yokohama/index.html

KENスクールでデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

教育関連の出版社は
よくその会社独自のフォントを作成するそうです。

なぜだか分かりますか？

その理由はひらがなの「さ」にあります。

ひらがなの「さ」には

２画の「さ」と、
 
 

３画の「さ」の

 

２通りがあります。

一般的にフォントで多いのは２画の「さ」なのですが、
現在、小学校で習うひらがなは３画の「さ」なのだそうです。

よって教育上、参考書などには
２画の「さ」ではなく３画の「さ」を使用するため
また、正しいカタチの文字で表現するため、
フォントを作成してしまうそうです。

ちなみに数学などの場合には
いかに「x」と「y」を見やすくするかというための
工夫も施されるんだとか。

--------------------------------------------------------------------------------

パソコンスクール KENスクール渋谷校　Webインストラクター
http://www.kenschool.jp/school/shibuya/index.html

KENスクールでWebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

皆さん、こんにちは。

さて、今回はすぐに本題に入りたいと思います。

前回、コントラストについて、お話をさせていただきました。

今回は、調和についてです。

もともと配色とは、色を組み合わせて、新たな効果を生み出すことです。

そのため対象物の用途や機能等をしっかりと表現できないといけません。
 

また機能的なだけでなく、美的に調和している事が重要です。

つまり機能的かつ美的である事が重要なのではないでしょうか？

では、例えば新幹線の車両を思い出してください。

新幹線のイメージとして、

• スマートに速く走る
• 大人数を運ぶので、冷静で安全な感じ

になると思います。

東海道・山陽新幹線は白と青のツートンカラーです。
 

スマートで速い感じの白と、
冷静な感じの青がとても良い配色で使われております。

さて配色を考える際の基本形式について、フランスの科学者シュブルールは、

• 近い色だと調和する
• 対立する色だと調和する

と述べています。

下の絵をご覧ください。

つまり左側が近い色で表現をして「統一」を図っています。
 

右側が対照の色で表現して「変化」を表しております。
 

この 「統一」か「変化」のどちらかを使用すると間違いは少ないと言うことです。

今後は、この調和について少しお話したいと思います。
 

また、この後に出てくる配色のほとんどは、この考え方に基づいています。

それではまた・・・。

--------------------------------------------------------------------------------

パソコンスクール KENスクール大宮校　Webインストラクター
http://www.kenschool.jp/school/omiya/index.html

KENスクールでWebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

普段、何か欲しいものがあるときや初めて行く場所など、
分からないことがあった時には、
インターネットを利用して調べることがあると思います。

Webデザイナーを目指すのであれば、分からないことを調べるだけでなく、
デザインの勉強と思って、たくさんのWebサイトを見ることをお勧めします。

最近、受講生の方にお勧めしているのが・・・
同じジャンルのサイトを複数調べて
「似ているところ」、「違うところ」を分析してみること。

すごく細かな違いでも、それを分析することが
とても制作者にとっての勉強となります。

まずは大手の企業からでも構いません。

調べて比べてみてください。

トヨタ
http://toyota.jp/index.html
 

ニッサン
http://www.nissan.co.jp/
 

ホンダ
http://www.honda.co.jp/auto/

セブンイレブン
http://www.sej.co.jp/index.html
 

ローソン
http://www.lawson.co.jp/index.html
 

ファミリーマート
http://www.family.co.jp/index.html

ドコモ
http://www.nttdocomo.co.jp/
 

au
http://www.au.kddi.com/
 

ソフトバンク
http://mb.softbank.jp/mb/

いろいろ調べていると、

職種によりレイアウトが似ていること。

それでも会社の特色で微妙な違いがあること。

など、いろいろ勉強になります。
 

ぜひネットサーフィン（死語）してみましょう^^V

--------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでWebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html
 

皆さん、こんにちは。

暑くなったり、雨が降って涼しかったりと、気温の差が激しい今日この頃ですが、
皆さんはいかがでしょうか？

唐突ですが、人は急激な環境の変化についていくことは出来ないそうです。
 

そのため、夏が近づき暑くなってくると、その暑さに対応できるように、
２～３日程度の慣らしの日にちが必要だそうです。

この季節、体調を崩しやすい原因でもあるそうです。

今まで色々な色に関するイメージや 感情など、色の基本についてお話してきました。
今回は、少し応用にはいり、配色のコツについてお話したいと思います。

さて、1回目の今回は「コントラスト」についてです。

まず、「コントラスト」とは何でしょうか？
 

コントラストというのは、
画像などにおける明るい部分と暗い部分との明度の"差"のことです。
 

コントラストを強くすれば、明るい部分はより一層明るく、
暗い部分はより一層暗くなります。
 

つまり、コントラスト比を強くすると、シャープで鮮やかな印象が増しますが、
中間色の滑らかさがおろそかにり、行き過ぎると粗雑な画像になってしまう
危険もあります。

また、逆に弱くすると、全体的に滑らかで落ち着いた印象が増しますが、
行き過ぎるとぼやけた不鮮明な画像になってしまいます。

それでは、分かりやすい例で、文字と背景色の関係で考えて見ましょう。
 

下の絵を見てください。

文字の色は黒で、背景の色のみ違っています。
 

右側に行くほど、文字と背景の明度が近づいていくので
文字が少しずつ見にくくなっていきます。

では、次にこちらはどうでしょう。

文字と背景を似たような色で整えると、やはり文字が読みづらいですね。

つまり、対比することで出来る"差"をつけないと、見にくくなってしまいます。

制作において、このコントラストを考えないといけないということですね。

でも、生活するうえで気温の"差"が激しいのは、
体調に良くないので、勘弁してほしいです・・・。

--------------------------------------------------------------------------------

パソコンスクール KENスクール大宮校　Webインストラクター
http://www.kenschool.jp/school/omiya/index.html

KENスクールでWebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

さてさて、いつもは、どうでも良い自虐ネタから入っておりますが、
今回は、いきなり本題です。

前回、色の錯覚の種類について簡単に述べましたが、
今回は少し深く掘り下げて行きたいと思います。

ズバリ!!
色の錯覚　対比現象編　です。

さて、前回対比現象とは、
"ある色がその色の周りにあるほかの色の影響を受けて、
本来の色と違って見える現象こと"
と、ご紹介いたしました。
 

しかし、この対比だけでも数種類ありますので、
その一部をご紹介いたします。

明度対比

その色の周りにあるほかの色の影響を受けて、
本来の明るさよりも明るく・
暗く見えたりする現象のことを言います。


 

上記のイメージを見ていただくと白い背景と黒い背景の中心に
それぞれ灰色のイメージがあります。
 

背景が白いと白いほうが明度が高いので、
中の灰色の明度が実際より少し低く見えてしまいます。
 

逆もまたしかりで、背景が黒いほうが、明度が低いので、
実際より明度の高い灰色に見えてしまいます。 
 

しかし、この灰色ですが、
両方とも同じ色を使用しております。
 

このように、周りの色に影響され、
明度が高くなったり、低くなったりする見え方を明度対比と言います。

彩度対比

その色の周りにあるほかの色の影響を受けて、
本来の彩度よりも高くもしくは、
低く見えたりする現象のことを言います。



中心の緑より、彩度の低い色を背景に置くと、
中心の緑はより彩度が高く見えます。
 

逆に、中心の緑より、彩度の高い色を背景に置くと、
中心の緑はより彩度が低く見えてしまいます。
 

このように周りの色に影響され、
彩度が高くなったり、低くなったりする見え方を彩度対比と言います。

他には、色相対比や補色対比、緑辺対比などがあります。
 

ぜひ、これらの対比についても調べて見てください。

 --------------------------------------------------------------------------------

パソコンスクール KENスクール大宮校　Webインストラクター
http://www.kenschool.jp/school/omiya/index.html

KENスクールでWebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

最近受講生が作成したサイトを見ていると
「サイトID」にindex.htmlへのリンクが抜けているものが目立ちます。

サイトIDってなに？　という方、ココです。

どのページから見てもこのサイトIDをクリックすれば
トップページに戻ることができるサイトってすごく多いですよね。
 

むしろ業界標準といっても過言ではないと思います。

小さな事と思われるかもしれませんが、
サイトIDからのリンクは必須！
みなさん忘れないでくださいね～！

--------------------------------------------------------------------------------

パソコンスクール KENスクール立川校　Webインストラクター
http://www.kenschool.jp/school/tachikawa/index.html

KENスクールでサイトデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

ずいぶん前の話になります。

節分がありましたが、その時に受講生の方から
豆まきセットをいただきました☆

その中に入っていた鬼のお面が…社長の顔に似ているんです！

思わず飾っちゃいました。
注）社長が鬼に似ているわけではありません

どこが似てるのか、似てると感じるのかを論じたところ
「おでことまゆ」。ということになりました。

でも社長と言えばヒゲ、ということになり書き足したら、ますますそっくりに…

これっていわゆる「デザイン」ってことですよね！
特徴を調べて（情報収集）、それを可視化してみたら…なんとなく社長に見える！

そういえば前にデザインの本で「萌え」の定義を読みました。
 

たとえば萌え顔ですが、もともとは赤ちゃんから来てるみたいです。
たしかに赤ちゃんはだれでもかわいいと感じます。

（少なくとも怖いとは思わない）

• おでこが広い
• 目が大きい
• 丸みを帯びている　など

…もしかして
社長の顔もおでこがもう少し広かったら萌え顔
だったかも！？（笑）
 

そんな社長が書いてるブログもどうぞよろしくお願いしますm(_ _)m

ぜひみなさんも「萌え」と呼ばれる人の顔、造形を見つめてみてください。

そんな風に観察するところからデザイン力が生まれます！

 --------------------------------------------------------------------------------

パソコンスクール KENスクール立川校　Webインストラクター
http://www.kenschool.jp/school/tachikawa/index.html

KENスクールでwebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

みなさん、こんにちは。
 

最近、やっと暖かくなってきて、スプリングコートも脱ぎ捨て、
半袖でもいいのではないかなぁ～と思う日もある今日この頃です。

しかし、暖かくなってくると、それ以上に花粉に悩まされる私であります。
プラス鼻炎というおまけつきで･･･。

また、春用の衣服になり、明るい、暖色系の色が多くなります。
 

これも私にとってひとつの悩み事でもあります。

なぜかというと、色には膨張する色と収縮する色と2つあるからです。
と、いうことで今回は膨張色と収縮色についてです。

まず、 赤や黄色などの暖色系は、こちらに向かってくるように、進出して見えます。
これを、膨張色(もしくは進出色)と言います。
 

逆に、青や緑などの寒色系の色は遠ざかっていくように後退して見えます。
これを、収縮色(もしくは後退色)と言います。
 

下図を見ていただくと、中の黄色と青の部分の大きさは同じですが、
青い方が少し小さく見えるのではないでしょうか？

では次に、下の絵を見てください。

いかがですか？
 

Photoshopの範囲選択をずらして書いただけの、
左右両方とも全て同じ大きさのイメージなのに、
白いほうが大きく見えてしまいます。

つまり、明るい、暖色系の衣服は、通常より人を大きく見せてしまいます。
 

また、白い方が明度対比を起こしてしまい、
肌の色がよりくすんで見えてしまいます。

そう、最近メタボリックが気になる私にとって、
膨張色の衣服は、私をより丸く太って見せてしまうのです!!

と、いうことで、普段は無駄な抵抗かなと思いつつも、
意図的に暗めの紺のスーツと、寒色系のYシャツを着ています。

本当は、●ルシアでものんで、
しっかりと運動すればいいことなんでしょうけど･･･。

--------------------------------------------------------------------------------

パソコンスクール KENスクール大宮校　Webインストラクター
http://www.kenschool.jp/school/omiya/index.html

KENスクールでデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

皆さん。こんにちは。

早速本題ですが、今まで、色の感情として寒暖、興奮・沈静のお話をしてきました。
 

今回は、柔硬感に関してご紹介したいと思います。

色が柔らかく見えたり硬く見えたりするのは、主として明度に関係があります。

明るい色は柔らかく、暗い色は硬く見えます。

明るい色とは明清色（純色に白を加えた色）と明るく鈍い色調の色（パステルカラー）です。
 

硬い色とは暗清色（純色に黒を加えた色）です。

無彩色では明るいグレイは柔らかく、暗いグレイや黒は硬く感じる色になります。
 

色の中で最も明るい色は白になりますが、白は、柔らかく感じません。

それは、白い色は印象がハッキリとしているため、柔らかい感情は湧かないのです。

下の図を見てください。

上段の色はパステルカラーを使用しているので柔らかく見えます。

逆に、下段は暗清色で表現しているので、それぞれ硬く感じます。

では、ここで一例を挙げて見たいと思います。
 

赤ちゃんの産着などのベビー用品は柔らかい色を使用しております。
 

デパートなどでベビー用品売り場を見ると、
この柔らかい色の商品で溢れていますよね。
 

生まれたばかりの赤ちゃんって、なんか、抱きしめたら壊れてしまいそうで、
(そんな強く抱きしめることはないでしょうけど･･･)

頬とか手とかは柔らかくて、そんな赤ちゃんには、
柔らかい色ってピッタリですよね。
(私には子供はいませんが･･･。)
 

逆に、硬い色はSL機関車のような重厚感のあるものに相応しい色です。
特に黒は硬く感じるとともに重くどっしりとした印象を与える色といえます。

こちらの重くどっしりという印象については、
軽重感ということで次回で詳しく説明しようかと思います。

--------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

皆さん、こんにちは。

今年の春も桜の写メールなど撮ったりして春満喫しましたが、
あっという間でさみしい今日この頃です。

薄いピンクの桜の花を見ると「春だなぁ～」と思いますね。

ある物の色を見る事により、人は季節を感じます。

実は色には、感情があり、人に様々な感情を誘発します。

と、言う事で今回は色の感情についてお話したいと思います。

まず、色の感情としては以下の種類があります。

• 暖かい・冷たい
• 興奮・冷静
• やわらかい・硬い
• 軽い・重い
• 派手・地味
• 色の連想

です。

今回は、その中から「暖かい・冷たい」について、お話したいと思います。

では、下の絵を見てください。

こちらを色相環といって色を順序に立てて円環にして並べたものです。

赤・橙あたりから黄にかけての色は、暖かみを感じる色が並んでいます。
コレを、暖色と言います。
 

また、 緑あたりから青紫あたりまでを寒さを感じる色が並んでいて、
コレを、 寒色と言います。
 

そして、 暖かい・冷たいなどの感情のわからない一連の色がありますが、
この色を中性色といいます。

暖色系の色は、彩度が高いと積極的な感じ受け、
逆に寒色系の色では沈静的な感じがします。

少し季節はずれですが、次の写真を見てください。

寒色系を使ったイルミネーションです。
 

どこか冬の寒さを表現しながらも、
より、どこか淋しい幻想的な風景に見えてきませんか？

また、暖房にはオレンジ系の暖色が使われていたり、
冷房には、ブルー系の寒色が使われていたりします。

このように、色には暖かさや冷たさを表す効果があります。

春になって、冬とは違う色々な色が街に出てきました。
 

是非、皆さんも春の色にはどのような色が多いのか？

立ち止まってみてはいかがでしょうか？

次回は、興奮・冷静についてお話したいと思います。

--------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでwebデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

ここ最近、寒い日が続きますね。

輪廻転生が事実だとしたら私の前世は確実に冬眠をする動物だったに違いないと思います。
冬には毎日がねむいねむいねむいねむい。

そんな寝ぼけまなこで電車に乗っていたところ、興味深い広告を発見しました。

これです。
(クリックで拡大します)

フリスクのケースの外側にもフリスクサイズの白い丸が見えませんか？
※寝ぼけまなこの人にだけに見えるわけじゃありません。

これは“エーレンシュタイン効果”という錯視のひとつで
線分の端点により、主観的な円が見え、
その主観的図形の色は背景と同じであるが、明るく見えるという現象です。

この効果自体は以前から知っていたのですが、
それをうまく利用したこの広告には感心。

でもこのような錯視を利用したデザインというのは意外と身の周りにあるものです。

明日の通勤時、寝ぼけまなこをどんぐりまなこにして周りを見てみてください。
面白い発見があるかもしれません。

--------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールで広告デザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

最近、いろいろサイトを見ていたらものすごい大きなボタンがあり
つい押してしまいそうになりました。
 

それで思い出したのですが、どこかで
サイトのボタンって重要なんだと聞いたことがあったので、
ちょっと調べてみました。
 

そしたらこんなことが書いてあったのでご紹介します。

1.色
ボタンの色はページの他のものよりも目立たせて、明るく、コントラストを
効かせると良い

2.場所
ユーザーがすぐに見つけることができる場所にボタンを配置する

3.説明
機能が分かりやすい単語を付ける。
見てる人にそのボタンをクリックする理由を示すのも効果的
例えば「無料！」とか・・・英語表記も多いですね

4.大きさ
ほかのどのボタンよりも大きく、広い面積を取る

5.余白
ボタンの周囲には十分な余白を取る。
ボタンらしく見えるように、立体的に見せる

みなさんもサイト制作する際にはぜひボタンに力入れてみてください。

あなただったらどのボタンを押したくなりますか？
http://www.dragnet.se/webbdesign/button_collection.html

--------------------------------------------------------------------------------

パソコンスクール KENスクール渋谷校　Webインストラクター
http://www.kenschool.jp/school/shibuya/index.html

KENスクールでサイトのデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html
 

ここ最近、一段と健やかに育っている今日この頃です。

適度な運動と、規則正しい食生活を心がけたいものです。
･･･一向に直りそうもありませんが･･･。

さて、今回は次回のおしまいに綴った通り、
「色の同化」についてお話したいと思います。

まず、下の絵を見てください。

少し確認しづらいですが、
背景色は共に同じ紫を使用しております。

しかし、左側の方には青い縞模様がのっているので、
背景の紫が少し青みがかってしまいます。
 

同様に、右側の方は赤い縞模様がのっているので、
背景の紫が少し赤みがかります。

この様に、背景色が、
柄などの影響を受けて、柄の色の色相に偏って見えることがあります。
これを、「色の同化」と言います。

では、実生活の中で使われている例を一つあげたいと思います。
それは、「赤い網に入ったみかん」です。

もともと、みかんはオレンジ色ですが、
そこに、赤い色の網をかぶせます。

赤い色のネットをかぶせることで、オレンジが色の同化を起こし、
より赤みがかったオレンジになります。
 

そうする事により、より甘く、美味しそうに見える。
と言う訳です。
 

この様に、普段の生活の中でも、
色々な場所で、色の同化を確認することが出来ます。
 

是非、お買い物などをした際には、
探してみるのも面白いかもしれませんね。

--------------------------------------------------------------------------------

パソコンスクール KENスクール新宿校　Webインストラクター
http://www.kenschool.jp/school/shinjuku/index.html

KENスクールでデザインを学びたい方は、Web/DTP講座へ！
http://www.kenschool.jp/Webdtp/index.html

さて、以前熱烈な虎吉であることをお話した、私ですが、
昨年はなんとも、面白くない結果になってしまいました。
 

阪神が負けた時点で、どこが優勝しようが関係ないわけで･･･。
もうすでに、ストーブリーグの補強を楽しみにし、
心はすでに今年のペナントレースの開幕を楽しみにしています。

そんな私は普段から、野球、サッカーなど色々なスポーツを見ますが、
それらのチームには、チームの特色を現すチームカラーが存在します。

阪神なら黄色と黒、浦和レッズなら赤と言う様に･･･。

今回は、色のイメージについてです。

さて、赤い色を見たとき、何を思い浮かべますか？
太陽やイチゴなどは多くの人がイメージすると思います。
 

それでは青といえば？
たいてい空や海を思い浮かべるではないでしょうか。
 

このように私たちは色から関連のあるものを連想することができます。
これを「色の連想作用」といい、私たちの頭にインプットされている色･･･
記憶色というものから成り立ちます。
 

このように色は心理的な作用を持っています。

色の連想作用は、具体的にモノをイメージする場合と
情熱、冷たいなどといった抽象的なイメージを連想する場合の
２パターンがあります。
 

このほとんどの人々が共通に持つ色の連想語を利用して、
商品のパッケージなどの色彩計画に使用している例が数多くあります。

例えば、暖かい火や炎を連想させた暖房器具には赤や橙を使い、
冷蔵庫や扇風機などには、涼しいイメージの青を使うなどです。

特に食品でこのイメージ色が活用されており、
例えば「激辛」を表すために鮮やかな橙が使われる場合が多いですし、
高級感を出すために黒やゴールドは有効な色と言えます。

消費者にその商品のイメージをスムーズに伝え、
買いたいと思わせるパッケージの鍵を握るのがこの記憶色を含めたイメージ色なのです。
それでは、それぞれの色の意味やイメージする言葉を見てみましょう。

赤　→　外へと向かうパワーの色で何かを発散したい時に欲する色です。
　　　　　赤ちゃんが生まれて初めて見分ける色も赤です。

橙　→　食欲の色とも言われています。エネルギッシュで前向きになれる色です。

黄　→　何かを訴えたい欲求を秘めた色です。また甘えをストレートに表現する色でもあります。

緑　→　疲労した目や体を癒してくれる色です。緑を欲しているときは休息が必要な時です。

青　→　誠実、忠実なども意味し、日本人に好まれてきた色です。気分を沈める色でもあります。

いかがでしたか？
他にも、沢山色がありますから、
興味が出てみたら色のイメージを調べてみると面白いのではないでしょうか？

次回は、もう少し踏み込んだお話をしてみようかと思います。
 

三越の紙袋に書いてある「Mitsukoshi」という筆記体が
アンパンマンの作者・やなせたかし氏のものであることは結構有名？ですが、
たまたま包装紙のデザインについてもこんな秘密が隠されていたみたいなんです。

三越の包装紙（白地に赤い模様）を思い出してください。
まず、あの赤。

もとはクリスマス限定の包装紙として作られていたのですが、
好評だったため、翌年から通常の包装紙として使用されるようになり、
50年以上デザインは変わらないまま。

あの赤はクリスマスの色、という意味で使用されたらしいのですが、
この赤色は現在では「三越ローズ」という名前の特色インキ(※）として
印刷会社で管理されているそうです。

そしてもうひとつ。あの赤い模様。
なんだと思います？　なんであの模様なんでしょう？
デザイナーの洋画家・熊谷弦一郎氏が千葉県の犬吠崎で集めた石がモチーフ
なんだそうです。
石！！

何か強いもの、というのが原点だったそうですが、自然の造形の美しさに惹
かれたという理由だということで…やっぱり自然の力はすごい！

※特色インキとは
　通常印刷時のインクはCMYK（シアン・マゼンタ・イエロー・黒の4色）を
　使用します。これを「プロセスカラー」と呼びます。
　しかし、蛍光色やパステルカラーなど特別な色（プロセスカラーでは表現
　できない色）は「特色」といってあらかじめ作られた色を使います。
　通常の印刷代よりも多少値上がりすることが多い。

 Illustratorでは「スウォッチオプション」から選択可能。

みなさん、青いバラって知っていますか？

バラといえばやっぱり赤。ですよね。
でも青いバラってあるんです。
以前ニュースでもやっていました。
 

日本のサントリーフラワーズと、オーストラリアの植物工学企業である
カルジーンパシフィック社(現：フロリジン社)との共同研究開発により誕生した、
世界で始めての青色色素を持ったバラなんです。

遺伝子組換え技術により誕生し、2004年6月30日に発表されました。
2004年に日本産業デザイン振興会　グッドデザイン賞「金賞」も受賞しているすごい花なんです！
サントリーってウーロン茶のイメージが強いですが、植物の研究もしてたんですね。。。

それにもビックリですが、自然界のデザイン・色彩って人工的に造ったどんなものよりも
すぐれていると思いませんか？
 

海の中の珊瑚とか、熱帯の鳥や魚の鮮やかな色。
ため息がでるような美しい色彩にあふれています。

話は戻りますが、バラにはそもそも青の色素がないそうです。
自然の色彩を遺伝子技術で変えてしまうなんて。。。
 

ちなみにこの成功により、同様に不可能とされていた厳密な意味での「黒いバラ」を作ることも
可能になったわけですが色の三原色の赤、黄、青の色素が揃わないと、
黒色を配合することはできないので、現在、「黒バラ」と呼ばれているものは非常に濃い赤色の
バラなのだそうです。残念ながら、こちらはまだ実現していません。

そんなすごいことができるようになった世の中ですが、個人的にはやっぱり自然の色彩の美しさには
かなわないと思う今日この頃でした。

たまには技術的なことも書いてみましょう^^

先日「キャッチコピー」について書きましたが、ではその文字は
どんなデザインになっているんでしょう？
よく受講生の方にも文字のデザインについてお話させていただく機会があります。

では今回は初級編ということでPhotoshopで文字のデザインをしてみます。

まずは適当なサイズの新規カンバスを作り、そこに任意の文字を書いてください。
今回の場合、書体は太めのものがよいかと思います。（例はImpactにしています）

この文字に「縁取り」を付けたいので文字レイヤーの下に新規レイヤーを作成します。

文字と同じ形の選択範囲を作ります。Ctrlキーを押しながらレイヤーのサムネイルをクリックします。
必ずサムネイルです！「T」って書いてあるところです！
文字と同じ形に選択範囲が点滅しますよね？

次に縁取りをするため一回り選択範囲を拡張します。
選択範囲メニューから選択範囲を変更、拡張と選び、数ピクセル拡張してください。
選択範囲が一回り大きくなりました。

レイヤーパレットで先ほど新規作成したレイヤーが選ばれてることを確認（レイヤー１）し、
白で塗りつぶしをしましょう。操作は描画色に白を設定し、Altキー+Deleteキーです。

背景が白いとわかりにくいですが^^;
白い縁取りができました。
（※ここでは分かりやすいように背景を黒にしたものを載せておきます）

さらに先ほどと同じ操作でもうひとまわり選択範囲を拡張し、もう１枚レイヤーを
レイヤー１の下に作成します。
そこに最初に書いた文字と同じ色で塗りつぶしをします。
２重に縁取りを作ることができますね！

すると野球の背番号のようなロゴデザインができます。
（※背景は白に戻してあります）

さらにひと工夫！
レイヤースタイルを使い、最初に書いた文字レイヤーにグラデーションオーバーレイを
使いグラデーションをかけてみましょう。

仕上げにもうひとつ一番下のレイヤー（レイヤー２）にも
レイヤースタイルのドロップシャドウをかけて完成です。
（最後のレイヤーの状態も載せておきますね）

すごく簡単ですが、意外に通勤電車や駅の広告、Webサイトでもよく見かける手法です。

また同じようなことを書いてしまいますが、通勤電車って本当にデザインの勉強になります。
「あっ！このロゴ格好いい！！」って思ったらぜひPhotoshop、Illustratorでチャレンジしてください。
どんどん腕があがること間違いなしです！

10年振りに一人暮らしを始めて、半年が経過しました。

先日、健康診断があり、もちろん体重も量ったのですが、
一人暮らしの成果が問われましたね。

結果はやっぱり育ってましたね…5kgくらい？

時として「人と違う」という事は、賞賛を浴びる対象になりますが、
健康に関しては、基準値を守った方が良いですね。

というわけで、今回はオリジナルのお話です。
今回は良い掴みだぞ、我ながら。

「ロゴを作ろう！」という記事からロゴについて調べていますが、
今回は、そもそも「オリジナルとは？」について考えてみましょう。

デザインに限らず、業務上オリジナル性を求められる場面は
結構あるのではないかと思います。

例えば営業職の方のプレゼンで、通り一変の話し方や資料の作りでは
興味や注目を集められない…という事もあるでしょう。

ただ、ここで間違いなのは「人と違う事をしよう」と考える事です。
いきなりそのように考えても、斬新なアイデアが出ることはありません。
何故なら「他の人のアイデアを知らなければ、自分の考えが
オリジナルなのかどうか判断できない」からです。

つまりオリジナルとは、あらゆる既存のアイデアの上に立つ物だと思うのです。
本来は「独自の」「元々の」といった意味ですが、言い方を変えて
「既成の物や考え方とは違う」といった方がしっくり来ますね。

デザインやパソコンの世界に限らず、見聞を広めるということは
やはり大事ですし、新たな経験をする度に「オリジナル」に
近づいて行くのでしょう。

らしくもなく語ってしまいましたが、
最後にロゴデザインのフリーソフトをご紹介しますね。

Logo Makerというサイトです。
左側にあるリンクを選択し、ロゴにしたい文字を入力すると、
それっぽい感じのロゴに仕上げてくれます。
試しに、任○堂風のKEN Schoolを作成してみました。

これをそのまま使うのは、さすがにアウトですね…(汗
ここまでの記事はなんだったんだという。


気を取り直して、次回もデザインから少し離れて、
web上の広告戦略について調べてみようかと思います。

社会人になると、多くの方が運動不足に悩まされると思います。
「休日は外出せずにノンビリしたい！」なんて思っていると、
やっぱり育ってしまいますね…特にお腹周りが。

軽く散歩する時間を作るだけでも違うと思うのですが
「明日も頑張る為に体力を充電しないと！」とか意味不明な理由をつけて、
ついつい昼寝の時間を設けてしまいます。
そんなにゴロゴロゴロゴロしてどうするんだ？とも思いますが…。

というわけで、今回はロゴのお話です。
掴みが強引とか気にしません。

早速ですが、次のロゴをイメージしてみてください。

• マクドナルド
• クロネコヤマト
• バットマン
• ユニクロ

職種はバラバラで、バットマンに至っては会社ですらありませんが、
大きく２つの特徴に分かれているのが分かりますでしょうか？


マクドナルドとユニクロは、その社名の「文字」が、
クロネコヤマトとバットマンは、黒猫や蝙蝠の「マーク」が、
それぞれ思い浮かんだと思います。

以前の記事、「ホリデーロゴ」で触れた「google」のロゴは前者、
「TAGIRI」で触れた「TAGIRIツール」のロゴは後者に当たりますね。

一口に「ロゴ」と言っても、以下のように分類されているようです。

ロゴ作成のコツを調べようとしたのですが、思った以上に奥が深く、
何から手をつけて良いのかも分かりませんね。
そんな時はツールを使いながらイメージを固めていきましょう。

今回ご紹介するのは　　という、フリーのロゴ作成ソフトです。
バナーをクリックするとリンクします。


リンクに飛んだら「ダウンロード（プログラムと説明書）」のページから、
ソフトの入ったファイルをダウンロードして、解凍をします。
特にインストール等の作業は不要です。

「LogoShader」フォルダの中の「Program」フォルダの中にある、
「LShader.exe」をダブルクリックしてソフトを起動します。

詳しい操作方法は「LogoShader」フォルダの中の「Document」フォルダの中にある、
「manual.html」を見てください。

マニュアルを見ずに一分で作ったロゴが

です。


「クール」と「スクール」で韻を踏んだつもりです…合掌。社長！使い方合ってますか!?

さあ！これからも一緒にロゴについて勉強していきましょう！！
 

急に寒くなってきましたね。
夕方にもなると、空もどんよりくら～くなってきます。
夜になれば空は黒くなってきます。
寒くなるにつれ、暗めの色の服を着る機会も増えますね。

今回は、『黒色』についてのお話です。

黒と一言で言っても、赤を暗くした『黒に近い赤』や
青を暗くした『黒に近い青』などがあります。

『黒に近い赤』を使えば、
「温かみのある強い黒」になります。
人間は感覚的に黒の奥にある赤のニュアンスを
なんとなーく感じ取って、モノトーンの黒と比べた時に
熱のある黒に関心が引かれやすくなります。

『黒に近い青』を使えば、
「夜空を見ているような安心感」を与えられます。
黒と比べた時になぜか惹きつけられる・・・
という印象を与えることができます。

自然界には色味のない完全なモノトーンは存在しません。
なので、わずかに何かの色味を加えて「自然さ」を演出することで
見る人にとって人工的とは感じさせないようにできます。

冬の夜空なんてまさに！自然の青い黒ですね。
見ていて心安らぐ、黒い青です ('-'*)

さて、前回から引っ張ってきているネタですが・・
女性の皆様お待たせしました。

って言ってもたぶん、
ごく普通に女性の皆様はやられているかと思いますが・・
 

はい、それは、お化粧です。

そう、小顔に見えるテクニック！
チークをうまく使うってやつです。

チークは小顔に見せる効果があります。
おすすめの色は ブラウン ！！

頬骨の上から下へ、ブラシを動かすように入れると、
輪郭がキュッとひきしまって見えます。

Ｔゾーンや頬骨の高い位置にハイライトカラー
（ハイライト効果のある白っぽい色）を入れると、
よりはっきりします。

さて、なんでこんな話をしていたかというと、
実はこのような補正をPhotoshopを使って仕事としてやっていました。

でも・・Photoshopだけでこれらのテクニックを磨こうと思っても、
仮想（データ）処理なのでそこにリアルがなく、
なかなか上達できません。

やっぱし実践し、目でみて、実際に感じること。
これが実は一番最短で自分磨きができます。

それを拒んでアプリケーションの使い方だけ覚えても、
名だけのデザイナーとなってしまいます。
それは、アプリケーションが使えるオペレーターです。

あなたはどちらを目指しますか？

アプリケーションのエキスパートか？
自分でデザインしたモノを世に出すか？

ちなみに、仮想で思い出したんですが、

昔、むか～し、自分、サッカー部だったんですが・・

その合宿で紅白試合とPKをやって、
一番最下位の人が×ゲーム・・
その×ゲームがなんと女装だったんです。

そして・・・見事に負けました
（しかも自分のオウンゴールで負けたので
自動的に最下位ってのは内緒で・・・）

しかも、マネージャーがいろいろ用意していた・・
お化粧道具一式はもちろんのこと
カツラからハイヒール、ブラまで・・・

ちなみに男顔なのでできあがりは相当・・・ヤバかったです。
まー、そーなると楽しみモード全快で悪のりしてました。

で、そのとき思いましたけど。。
お化粧ってほんと大変だし、暑い。。
ハイヒール、気分はなんだかピーンって感じになるけど・・疲れる。。

さて、次回は・・・
アナログ感覚とデジタル感覚についてにしようかなと思います。

これはみなさんが知っている、
アナログとデジタルの比較とは少し違います。
っていうかひねくれています。

この、ひねくれ度があたらしい何かを生み出すきっかけになります。

と、自分で逃げ道を造っていることは内緒でっ！！

私が普段、心がけていることのひとつに
 「電車で中吊広告を見ること」があります。

たまに受講生の方に
「今日は何の広告が印象に残ってますか？」って
聞いてみたりします。

本当に広告って見てもらえないもので、
心がけているにもかかわらず、
私も見たものを3日も経つと忘れてしまうんですよね・・・。

「どうやったら見てもらえて、覚えていてもらえるのか？」
そんなことを考えながら今日も広告を眺めていました。

デザインよりもキャッチコピーが心に残るのでは？と思い
観察していると色々なコピーがありすごく面白いです。

「日本最大級！」（一番ではないんだなぁ・・・）

「からだにやさしい天然水」（え？）

私が印象に残っているキャッチって何だろう？

やっぱりキャッチコピーと言えば「糸井重里さん」ですよね^^

くうねるあそぶ（食う・寝る・遊ぶ）
これは日産自動車「セフィーロ」のコピーです。

このキャッチコピーだけでも印象的でしたが、テレビCMで
 歌手の井上陽水さんが車の窓を開け、笑顔で
 「みなさ～ん、お元気ですか？」
って問いかけます。
これがまた印象的でした。

さて、糸井重里さんは
他にどんなコピーを作っているのか調べたところ
『印象に残る「糸井重里」作のキャッチコピーランキング』
というのがありました。

http://ranking.goo.ne.jp/ranking/022id/catchcopy_itoi/

これを見て初めて知ったのですが
「愛は地球を救う」も糸井さん だったんですね！

今回は通勤しているときに思ったことを書いてみました。
通勤電車の中でも、色々な発見がありますね。
みなさんも通勤電車を楽しんでみてください。

とてもWebデザイン・DTPデザインの役に立ちます！！

今回は色と形と記憶について、お話しします！

 
秋は紅葉の季節。
季節の変化は色の変化でもあります。

気温が下がってくると、
葉をつけている茎に「離層」という細胞ができて
葉が落ちます。

このとき葉に栄養がいかなくなるので、
葉に含まれていた葉緑素が分解されて、
赤や黄色に変化するそうです。

そして、人の記憶ですが、
人間は見たモノをそのまま記憶するのではなく、
抽象化して記憶します。

なので、色や形などが大事になってくるんです。

昔の壁画なんかをみると、
シンプルな線と色彩で描かれた動物たちがいます。

これは、調べたわけではなく自分の感覚からの考えですが、
古代の人は絵を描くことにより、
狩りの仕方などを次の世代へ伝承していったのでしょう。

生きることに必要な情報を簡略化して描いたのではなく、
あえて特徴しか描かなかったのではないでしょうか？
 

人間の記憶、認知の”輪郭”のようなものが、見えてきますね。
 

画像の保存形式が複数存在することを、
みなさんご存知ですか？

よく見かける拡張子「.jpg」や「.gif」。
これらは生データ（Rawデータ）と言われる
何の処理もしていない画像データを
圧縮した保存形式を表します。

なぜ、生データではいけないのでしょうか？
それは単純明快！サイズがデカイからです！

では、保存形式を変換することで
それぞれの特徴を見てみましょう。

実験!!

JPEG → 変換 → GIF           ： 色数が少ないため粗くなった
JPEG → 変換 → ビットマップ ： 画質はほぼ等しいがサイズが大きくなった

 

■種別	：JPEG	■種別	：GIF	■種別	：ビットマップ
■サイズ	：8KB	■サイズ	：13KB	■サイズ	：97KB

まとめ!!

 

Googleのロゴは今日も新しい。

本日は「敬老の日」です。
もう、ここまでくると、Googleとはまったく関係ないようなデザインの気もしますが、
そこはロゴデザイナーの力量。

ちゃんとGoogleに置き換えて表現しているところが、
素晴らしいですね。

しっかりクリックをすると、
敬老の日の詳細な検索結果が表示されます。

初めてこういった「ロゴ遊び」をご覧になった方へ、
これは「ホリデーロゴ」と言って、Googleが私達に提供する
ひとつのアイデンティティなんです。


そもそも、Googleは世界中で最も利用されている
検索エンジンの一つですよね。

インターネットを活用、又はビジネスで利用する方々にとって、
Googleを使わない人は、まずいないでしょう。
検索することを「ググる」なんて表現された時期もあったほど、
慣れ親しまれている検索エンジンになりました。

皆さんが常に良く見ている、
TOPページに表示されるあのGoogleのロゴは、
1998年にサーゲイ・プリン氏（創業メンバーの一人）によって
デザインされたものでした。

今よりも丸っこい、やわらかいデザインではありますが、
当時のこのロゴと、今でも配色は全く変わっていません。
色々と時代が流れる中で試行錯誤で検討しつつも、

やっぱりこの色がGoogleであるという結論になったそうです。

そのサーゲイ氏が、ホリデーロゴも初めてデザインされているんです。
記念すべき第一号は、「バーニングマンフェスティバル」。

バーニングマン？？
ご存知の方はいますか？？

僕も昨年まで、このフェスの存在すら知りませんでした。
アメリカはネバダ州北部の砂漠で、
一週間かけて行われる壮大なフェスティバルなんですが。
http://burningman.com/

そこで、イベントの大トリとして、
最後 15mを超す木製の人形を、一夜掛けて燃やすセレモニーがあるんです。
砂漠ならではの、ダイナミックなイベントですね。

その夜通しのセレモニーを終えたあと、
朝日が昇ってくる様を憂う人々の写真が、
昨年の「MAC FAN」という雑誌に載っていて、

感動しすぎて、そのためだけに本を購入した覚えがあります。

話はそれましたが、
そんなイベントをロゴに取り入れてみたところ、
ユーザーの反響がもの凄くあったそうで、
それからというもの、イベントをロゴにする風習が生まれたのです。

年間約50種類ものデザインを、デニス・ホワン氏という方を中心に
作成されていますが、
この方は韓国系アメリカ人。
世界中で親しまれるイベントのデザインはよしとして、


日本ならではのイベントも、この方が風情を理解されて
デザインしているんでしょうか？

今回の敬老の日もしかり。
こどもの日、七五三、アトム生誕50周年など・・・
この日本のデザインは、川嶋優志氏が手がけています。

川嶋氏は、アメリカ人以外で唯一のホリデーロゴデザインを
手掛ける方で、子供用のイベントが多い点について、
「グーグルには『子供心を忘れない』という文化がある」と
以前、インタビューに答えていました。

テクノロジーを讃えるロゴも多いですが、
これも理由があります。
「グーグルは新しいテクノロジーを生み出し、様々なサービスを提供している。
分野は違えど、共通するものに敬意を表して、
テクノロジーが生まれた記念日にホリデーロゴを採用している」

ロゴを見て、それに興味が沸けば、
誰でも検索して調べることができます。
今回の「敬老の日」もロゴをクリックしてみると、
知識豊富な検索結果ページへと繋がります。

検索すること自体を楽しくさせ、
それぞれのモチーフに対して感謝と祝いをこめて作成する。
素晴らしいお仕事だなぁと感じます。

そして、お堅いはずの企業ロゴを自由に加工させ、
社員にデザインで遊ばせているGoogleの風土にも、
好感がもてますよね。

著作権などビジネス的な面においても、
過去に一切問題にはなっていないそうです。
Googleの純粋な遊び心に、
皆が賛同したという証拠ですね。

最後に一つコレクションをお見せして、
本日は終わりです！

北京オリンピックの開催中、毎日Googleは違うロゴを
私達に提供してくれました。
著作権うんぬんではなく、僕もGoogleの考えに共感して、
こちらを載せてみたいと思います。
ではでは！

http://www.google.co.jp/holidaylogos99.html
ホリデーロゴが一覧できます。ぜひご覧になってみてください。
 

バナナにはまっています。
バナナしか食べるものがありません。

別に果物が好きなわけではないんです。
バナナは単に食べやすいから…
あとはビタミンCとか取れそうだからという、それだけの理由なのですが、 純粋においしいです。

先日初めて知りましたが、あのバナナの黒いアイツ、
「シュガースポット」という らしいですね。
甘くておいしい証拠☆
そんなバナナをじっと見つめつつ、思ったのです。

「この美しいバナナはもしかして黄金比でできているかもしれない…」

黄金比とはおよそ1：1.618の縦横比のことですが、
よく優れた美術品や建築物に使われている、人間が美しい～と感じるサイズのこと。
そういえばタバコのパッケージとか名刺もそうなんですよね。

で、計ってみました。

バナナを三日月になるように配置し、
湾曲になっている一番出っ張ってるところからハンド（バナナの房がついてるヘタみたいなところ）の部分：ヘタの部分からつま先（？）の部分まで・・・

だいたい1：1.56という結果になりました！ほぼ黄金比ッッ

ついでに身長と横幅（一番湾曲してるところから先端の部分）までも計ってみましたが
これはおよそ1：1.37
大きさによっても変わってきますが、
また機会があればカンペキなバナナを探してみたいと思います。

次回は何をはかろうかなー

先日、『オーラソーマ』を体験してきました。

 ―*― オーラソーマとは？ ―*―
 107本の2層に分かれた色のボトルから、好きな色のボトルを4本選ぶ。
 選んだボトルの色から
 1本目・・・『その人の本質、人生の使命、目的、自分らしさ。』
 2本目・・・『その人の課題となる問題、あるいは自分らしくいられない原因。』
 3本目・・・『今ここ。今自分は問題に対してどうするべきかのヒント。』
 4本目・・・『２，３本目のプロセスを経て自分の未来がどのようになってゆくのか。』
 という、自分の今の状態を理解する手助けをしてくれるカラーセラピー。

『えー、怪しい。なんかうさんくさい気が・・・』
と思う方もいるかもしれません。
私もそう思ってました。ボトルを選んで説明を聞くまでは・・・

まずはカウンセリングの前にオーラソーマってこういうものだよー、という説明を聞いて、
今思っていることや悩み事などなんにも言わずにボトルを選ぶ。
私が選んだボトルの色から今の心理状況の説明が始まる。

1本目・・・『あ、確かにそういうところはあるかも。』
2本目・・・『えぇ？・・・なんでわかるんですかね？なんにも言ってないのに。』
3本目・・・『普段から考えていることですね。いやいや、ホント、なんでわかるの？』

なんだか不思議なくらい、今考えてること。思ってることがドンピシャでした。
どんな内容だったかはここでは言えませんが(/ω＼*)
人間の心理ってこんなにも色に表れるんだなー、と思った時間でした。

こういした『色の心理』ってWebやDTPの世界でも使えますね。
もちろん、日常生活でも。

「温かみ」「やさしさ」を感じさせる色や、「信頼感」「安心感」を与える色、
「情熱」を与える色、「可愛さ」を感じさせる色、「強さ」を感じさせる色・・・
たくさんの色がある。

それをどう使うか？どう組み合わせるか？で作ったものの印象は違ってくる。
色自体の数も多いし、組み合わせたらかなりのパターン数・・・
ですが、「人に与える色の心理」を知るとさらに色選びや色の使い方が楽しくなると思います。

ちなみに余談ですが、今回伺ったオーラソーマの先生は
前職はWebディレクターとしてご活躍されていたそうです。
今もWeb制作が大好きで色の勉強をしながらWeb制作にも携わっているという素敵な方でした。

こんなところでWebに携わる方と出会えるとは！！
これも何かの縁かも？またまた通ってしまいそうです(*´▽｀)♪