次々とセンスある配色パターンを提案してくれるサイト「Coolors」 | ライフハッカー・ジャパンデスク配線がスッキリ。Ankerの全部入り12 in 1モニタースタンドが突然8,250円OFFされてた #Amazonセール
一つのカラーから配色セオリーに基づいてカラースキームを作りだす配色設計に役立つツールのまとめ
コーポレートカラーなど、一つのカラーをベースに配色セオリーからカラースキームを設計したり、同系色やグラデーションを作りだしたりできるオンラインツールを紹介します。 またカラーのストックを増やしたり、カラーをベースにしたムードボード作りに役立つツールもいくつか。 最初は、国産のツールから。 配色の見本帳 | キーカラーで選ぶ配色パターン 一つのカラーをベースに、さまざまな色の法則から配色パターンを表示します。 上は緑みの青（#0099CE）をベースにしたもの。キャプチャの他に、彩度や明度による配色、色相環による配色など、さまざまな配色を表示します。説明付きなのも嬉しいポイントです。
マーケティングにおける色彩心理学の本当の使い方
by Tiger Pixel マーケティングにおいて色彩心理学を利用することは重要とされますが、色彩の持つ効果は個人の経験に依存し、学術的に裏付けされたデータが少ないため、議論も多いところです。そこでHelp Scoutがブログで研究によって明らかにされた色彩の持つマーケティングでの効果をまとめたのが「The Psychology of Color in Marketing and Branding」で、実際に商品を売り出したり、ウェブサイトをデザインする際にも非常に役立つ内容となっています。 The Psychology of Color in Marketing and Branding | Help Scout https://www.helpscout.net/blog/psychology-of-color/ ◆色彩心理学に関する誤解 どうして色彩心理学は多くの誤解を含み、そして
イメージスケールを使ってWebサイトの配色を論理的に決める方法 | ベイジの社長ブログ
デザインをやっていて特に難しいと感じるのが、色の決定です。色は、言語化できない心理的なイメージに作用するため、デザイナーとしては慎重にならざるを得ません。しかし残念ながら、私自身は、色に関して天才的なセンスを持っているわけではありません。そこで、配色のためのツールや配色理論などを用いて色を決定していくのですが、その過程で特によく使うのは言語イメージスケール（©小林重順／日本カラーデザイン研究所）です。その一連のプロセスを、実際に関わった某学習塾サイトを例にご紹介します。 キーワードの抽出 配色の決定にあたり、まずは学習塾のパンフレットや広告、既存のWebサイトなどの情報を収集し、ブランドキーワードの抽出を行いました。結果として、以下のようなキーワード群を抽出しました。 安心、安全、堅実、真面目、確実、知的、本物、楽しい、明るい、健全、のびのび、元気な、豊か、丁寧、親切、誠実 ここでは、「塾
ヒューレットパッカードのWebサイトが黒から白に変わった理由 | ウェブ配色 | ブログ | フォルトゥナ
前の記事でレポートしたデザイントレンドの前日打ち合わせと称した飲み会の席で、登壇者の原一浩さんから、「なんでヒューレットパッカードの色が黒から白に変わったんでしょうね」と言われていたのですが、結局当日はセッション時間の都合で話せなかったので、ここで私の見解をまとめておきたいと思います。 まずは2011年と2012年のスクリーンショットを並べてみました。これはまたガラッと変えてきましたね。 そもそも大きく色を変えなければならない時は、企業としての戦略が変わったときがほとんどです。会社の業績が堅調であれば、ブランドイメージを変える必要はないのですから。さらに発展させたいという場合もあるでしょうが、大きく色をを変えることで、今までのブランドイメージを壊してしまうこともあるため、リスクが高いことからよほどのことがない限り、しない方が無難だと思います。 そんなわけで、そもそもヒューレットパッカードが
Webデザイナーによるカラーコードを使った便利なテクニックあれこれ
By OliBac コンピュータが色に名前を付ける時、数字やアルファベットを6つ並べた1677万7216通りの組み合わせで表される16進数カラーコードが使われます。カラーコードは他のコンピュータ言語と同じく論理的なシステムに基づいて作られるため、Webデザインを行う人間にとって16進数カラーコードを知っておくことは非常に助けになるとして、WebデザイナーのBen Gremillionさんがカラーコードの仕組みや便利なテクニックをまとめているのが「The Code Side Of Color」です。 The Code Side Of Color | Smashing Coding http://coding.smashingmagazine.com/2012/10/04/the-code-side-of-color/ そもそもスクリーン上のカラーは指定がない場合は黒いままで、16進数カラーコ
デザイナーだから考える。青色が与える27の効果と7つの活用例
今年のお盆休みは友人と旅行に行ったり、ボルダリングの体験をさせてもらったりしていて、ブログの更新が疎かになっていました。申し訳ありません。今週は月曜日から時差ボケのような感じで、あまりシャッキっとできていないんですが、頑張ってブログを更新して行こうと思います！ 今日は、前回の「デザイナーだから考える。赤色が与える27の効果と6つの活用例」に引き続き「デザイナーだから考える。青色が与える27の効果と7つの活用例」について紹介させていただきます。青を基調としたデザインを考えるときにこの記事が役立てば幸いです。 青色を利用した7つの活用例 まずここでは、青色を取り入れたデザインや製品などを例に、青色が持つ効果やイメージについて紹介させていただきます。 聖母マリアのマントの青は「神秘的な印象与える」 地球上に存在する「物」としての青は、手にとって触れることの難しい色です。例えば世界中で見ることので
私がWebサイトの配色を決める時の流れ
ここで得た言葉を元に配色を組み立てていくことになるので重要な部分です。 伝えたいイメージは多くの場合、「明るい」「可愛い」「落ち着いた」などの形容詞で表現されることが多いです。 ただ、言葉から連想されるものは人により誤差がありますので、 参考となるサイトや、商品など具体的にイメージしてるものも挙げてもらうと良いです。 下記はGoogleの画像検索「高級」の結果です。人によって抱くイメージは様々です。 「○○のような高級感」と具体的に伝えてもらうと良いです。 2.調査 競合となる他社サイトの配色を調査し、それらと同じような配色になることは避けます。 ただし同業の全てのサイトと被らないようにするのは無理があるので、 商圏内で競合となる他社のみを比較対象とします。 また、既にクライアントが名刺やパンフレット、フライヤー、ノベルティやなどを制作していたら見せてもらったり、 店舗であれば外観・内装の
Photoshopで理論的に配色はできないものか検証してみた
最近は配色を作れるジェネレータや配色をシェアするサイトが多数あり、簡単に配色を作ることができます。ただ、そういうのに頼らずにもっとPhotoshopだけで理論的にできないものかと思い検証してみました。 動機 配色を作れるツールっていまいち使いこなせてないし、自分がイメージしてる配色をPhotoshopで理論的に作れたら楽だなと思って。 結論 最初に結論を述べます。 Photoshopで色相を使った配色は基本的には難しいです。（できなくはないが非常に手間がかかる） 彩度・明度を使った配色は簡単にできる。 また、トーンを使った配色ならそれなりにであればできる。という結論になりました。 Photoshopの表色系の落とし穴 色相を順序立てて円環にして並べたものを色相環と言い、色相環の反対の位置が補色となります。 つまり基準となる色に180°足した色が補色になります。 ところが下記のようにPhot
1年目デザイナーに読ませたい配色の考え方を学べる記事
配色センス0でも大丈夫！？服、インテリア、デザイ... / Webサイト制作において、私なりの色選定の考え方... / 色と人の感覚とウェブデザインのはなし - バニデ...他...全10件
配色初心者でも効果的なカラーデザインが出来るようになる4つの工程 / Maka-Veli .com
タイトル間違えました。 「僕みたいなクソデザイナーが配色する時に騙し騙しデザインする手法」です。 配色には色々作法があります。そして言葉もあります。加法、減法、色の三属性、伝統、政治的意味合い、などなど。厳密に出したらキリがありませんし、プロじゃないので、細かい事は抜きにして、個人的に抑えておく簡単なポイントをまとめてみました。 雰囲気のキーワードを出す なんとなくのキーワードを出します。 カッコイイ！ うぉ！すっげ！って感じ クール とにかく渋く。鳥肌立つ感じで 可愛いっぽく。 やっぱ少し可愛くが良い ラブリー♡ もうワクワクーって感じで♥ シンプルに。 余計な物はいらん インパクトどーん とにかく覚えてもらいたい！ 爽やかーーー キレイに見せたい！ 楽しい！ ﾁｮｰﾊｯﾋﾟ ｽｰﾊﾟｰﾊｯﾋﾟ ﾉ…(ry など。 ここで決めたキーワードがベースになります。 常に頭に入れてお
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
指定したウェブサイトで使われている配色・フォントを抽出してくれるサイト「Stylify Me」 | ライフハッカー・ジャパン
ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP
色色[:iroiro]![色色[:iroiro]](https://cdn-ak-scissors.b.st-hatena.com/image/square/af968f100788dea6e8fc8badabc54f2003dd7bb9/height=288;version=1;width=512/http%3A%2F%2Fsynthsky.com%2Firoiro%2Fimgs%2Firoiross.jpg)
http://handywebdesign.net/2012/11/if-you-want-to-use-many-colors/