Movatterモバイル変換

Webデザイナーのための配色セオリー伊達千代2013/10/413年10月4日金曜日

自己紹介伊達千代（だてちよ）グラフィックデザイナー／ライター電子製品メーカーデザイン室勤務を経て独立株式会社TART DESIGN OFFICE代表13年10月4日金曜日

配色のセオリーとは13年10月4日金曜日

問題1この色を人に伝えたいとき、どの表現を選びますか？下から選んでください。1. 空気の澄んだ田舎で見る夕焼けの赤2. 鮮やかで人目を惹き、情熱を感じさせる赤3. #F44053またはR:249/G:89/B:1014. やや橙よりの赤彩度/高、明度/低め13年10月4日金曜日

配色とは無限とも言える「色」の中から「色」を探し出す作業13年10月4日金曜日

配色で多い問題センスが悪いといい配色はできない？色を選ぶ判断基準はどこにある？他の作業者やクライアントとどうやってイメージを共有する？セオリーを知って効果的で、効率的で、自信の持てる配色を！13年10月4日金曜日

配色のセオリーとは色の持つ、あるいは色と色の組み合わせによって起きる普遍的な「効果」色を選ぶ際の基準（効率）配色を裏付ける言葉と説得力（プロとしての責任を果たす）13年10月4日金曜日

プロとして配色に責任を持つことなぜその「色」なのか説明できるその色によってどんな効果が生まれるかを計算し、配色による利益をもたらす効率のよい配色を行う裏付け・調査（確認作業）をする13年10月4日金曜日

授業概要正確な色の表現色の属性／色の名前色の持つ働きと機能色の持つイメージ／誰もが見やすい配色／調和のとれた配色／強調のための配色配色の実践配色トレーニング／便利なツール／イメージマップ13年10月4日金曜日

正確な色の表現13年10月4日金曜日

色を表す言葉（属性・色相）色相色相が近い・遠い（離れている）補色13年10月4日金曜日

色を表す言葉（属性・明度）明度明度が高い明度が低い明るい暗い13年10月4日金曜日

色を表す言葉（属性・彩度）彩度彩度が高い彩度が低い鮮やか鈍い純色無彩色13年10月4日金曜日

色を表す言葉（属性・彩度と明度）純色無彩色高明度低低彩度高13年10月4日金曜日

A BC D色を三属性で表してみよう13年10月4日金曜日

色の名前の例（名称・自然・文化）とき（鴇）色つつじ（躑躅）色紅海老茶こうじ（柑子）色中黄（ちゅうき）若竹色白群（びゃくぐん）露草色しょうぶ（菖蒲）色チャイニーズレッドシーグリーンナイルブルーウイスタリアローズレッドパールグレイ13年10月4日金曜日

色の名前を知るhttp://www.colordic.org/w/13年10月4日金曜日

問題2色と名前との組み合わせを正しくつないでください1. 鶸色（ひわいろ）2. 金茶（きんちゃ）3. 煤竹色（すすたけいろ）ABC13年10月4日金曜日

色の働きと機能13年10月4日金曜日

色の働きと機能気持ちが前向きになる暖かく感じる食欲を増進させる集中力を高める血圧を下げる食欲を減退させる疲れをいやす鎮静作用、緊張緩和作用穏やかな気持ちになる集中力を発揮させる記憶力を高める注意を促す清潔な印象軽く見える純粋さを感じる気持ちを引き締める暗い気持ちになる重く見える赤青緑黄白黒13年10月4日金曜日

色の働きと機能RBGYRGRPBYGYPPB暖色寒色13年10月4日金曜日

問題3どちらの色の組み合わせの方が見やすいですか？また、その理由も答えてくださいA B13年10月4日金曜日

視認性13年10月4日金曜日

視認性http://www.verticalgardendesign.com/13年10月4日金曜日

視認性配色を考える上でもっとも重要視認性を決めるのは「明度差」強調したい順に明度差がつくように配色をするユニバーサルの観点においても重要13年10月4日金曜日

誘目性13年10月4日金曜日

誘目性http://www.sullivannyc.com/13年10月4日金曜日

誘目性誘目性の高い色は、赤∼黄色の彩度の高い色色を組み合わせる際に明度差をつけることで、より誘目性は高まる13年10月4日金曜日

進出色・後退色http://www.established1986.com/#/Home13年10月4日金曜日

進出色・後退色http://www.moozedesign.com/13年10月4日金曜日

進出色・後退色寒色系の色や彩度・明度の低い色は奥に下がって見え、暖色系の色や彩度・明度の高い色は手前に飛び出して見える目立たせたい部分と、他との差を付けたい場合に有効なセオリー13年10月4日金曜日

配色の手順イメージ調和メリハリ13年10月4日金曜日

調和のとれた配色とは色相／彩度をえる色相をバランスよく組み合わせるトーンをえる無彩色の活用色数を絞る13年10月4日金曜日

色相／彩度の統一http://www.hyundai-veloster.eu/13年10月4日金曜日

色相配色13年10月4日金曜日

色相配色http://www.sturdy-style.com/13年10月4日金曜日

トーン配色ビビッドストロングダルグレイッシュブライトライトペールライトグレイッシュベリーペールディープダークダークグレイッシュhttp://www.sikiken.co.jp/pccs/pccs04.html参考：日本色研事業株式会社13年10月4日金曜日

トーン配色http://www.rolanddg.co.jp/metallicworld/13年10月4日金曜日

無彩色の活用13年10月4日金曜日

無彩色の活用http://www.apple.com/jp/13年10月4日金曜日

色数をしぼるhttp://www.kazepro.com/13年10月4日金曜日

問題4見本のデザインで調和のとれた配色のために使われている手法は？13年10月4日金曜日

UIと配色http://www.apple.com/jp/13年10月4日金曜日

カラーイメージの定着http://www.daichi.or.jp/13年10月4日金曜日

グローバルカラー・パーソナルカラー配色には、その「場」にふさわしい色の使い方があるよりグローバルな観点が求められるもの（公共性・アクセシビリティ・UI）にとっての「色」は、優先度が低い「色」は、パーソナルなもの13年10月4日金曜日

強調のためのセオリー対比13年10月4日金曜日

明度対比13年10月4日金曜日

色相対比http://www.windowsphone.com/en-us13年10月4日金曜日

彩度対比http://craftingtype.com/13年10月4日金曜日

面積対比13年10月4日金曜日

問題5見本のデザインで強調のために使われている配色手法は？13年10月4日金曜日

配色の実践13年10月4日金曜日

配色のトレーニングとは？13年10月4日金曜日

イメージの言語化例：スイーツのような甘い配色最近流行の、カラフルに着色されたカップケーキのような配色甘いものは快楽でもあり、背徳的でもある。どこかに辛味も？13年10月4日金曜日

イメージの言語化13年10月4日金曜日

イメージスケールあどけない子供らしいユーモラスなたのしいポップなカジュアルなにぎやかな強烈な行動的なエネルギッシュなたくましい野性的な豪華なぜいたくな魅惑的な温厚なくつろいだ家庭的なのんびりした甘美なロマンチックな清麗なうるおいのある新鮮な洗練されたスマートな知的な風流なエレガントな気品のある女らしい清潔なさわやかな青春の若々しい明快なスピーディなモダンな合理的な緻密なおごそかな風格のある本格的な貫録のある伝統的な味わい深いダンディな真面目な優雅なやすらいだあどけない子供らしいユーモラスなたのしいポップなカジュアルなにぎやかな温厚なくつろいだ家庭的なのんびりした甘美なロマンチックな清麗なうるおいのある新鮮な洗練されたスマートなエレガントな気品のある女らしい清潔なさわやかな青春の若々しい明快な優雅なやすらいだhttp://www.ncd-ri.co.jp/参考：日本カラーデザイン研究所13年10月4日金曜日

問題6見本のデザインの配色イメージを自分なりに「言葉」で表してくださいhttp://www.benitos-hat.com/13年10月4日金曜日

イメージマップ13年10月4日金曜日

Kulerhttps://kuler.adobe.com/13年10月4日金曜日

まとめ「色」を言葉で表すことの重要性「説得力」のための配色セオリーイメージの具体化、調和と強調の循環配色スキルは磨くほど高くなる13年10月4日金曜日

プロとして配色に責任を持つなぜその「色」なのか（理由）その色によってどんな効果が生まれているのか（メリット）プロらしさ（説得力）裏付け（調査）13年10月4日金曜日

任意のWebサイト（紙でもディスプレイなどでもOK）の色のイメージを言語化課題／配色の分析をしてみよう13年10月4日金曜日

質疑応答13年10月4日金曜日

Movatterモバイル変換

Change Language

Webデザインのための配色セオリー

Recommended

More Related Content

What's hot

Similar to Webデザインのための配色セオリー

More from webcampusschoo

Webデザインのための配色セオリー