SlideShare a Scribd company logo
1 of 47
Download to read offline
HOW TO
   め
                        ma
              Aoi Ebinu




理 詰                          →→→色彩編




スラ
Tuesday, April 23, 13
で す。
                        重要          ま す。    とも
                      も          めし
                て と て
                               すす けでは    ない
             おい             をお るわ
          作に      、      ター くな
     印 象操     場 合
                     ィ ネー うま                とり
 色 は       たい     ーデ 使いが                 図の
       知り      ーコ                     、構
 正 確に       カラ      ら色             使い
        定 、      たか             る色
    彩検        おえ              使え
  色        強し              ら、
       、勉               なが
   ただ      。        混ぜ     す。
        ます       例を     いま
    思 い       具体     と思
         で は、     たい
     こ こ      いき
           って
      方 をや




Tuesday, April 23, 13
色の組み合わせ
                        色の使い方




                                色の意味




Tuesday, April 23, 13
色の組み合わせ
                        色の使い方




                                色の意味




Tuesday, April 23, 13
色の使い方




                                これがイイタイコトです。




Tuesday, April 23, 13
色の使い方




                 目次の色と帯の色を一致させることで、
                         イメージを喚起することができる。
                         色はイメージの補強を行います。




Tuesday, April 23, 13
色の使い方


                         伝えたいことがあるときには、
           補色(次ページで説明)をつかうと効果的。
                        ただ同じ明るさの色で補色を使うと
                        目がチカチカしますね。
                         これをハレーションと言います。
                          同じ強さの主張でどっちが
                         伝えたいことかわかりません!

Tuesday, April 23, 13
Mancell Color Circle(マンセル色相環)




                                             補色はそれぞれの180 の
                                             位置にある色を示します。
                                             混ぜると黒・灰色・白の
                                            彩度をもたない色になります。




Tuesday, April 23, 13
色の使い方



                           イメージを連想させる。
                            何かを際立たせたる。
                             誤った印象を防ぐ。
                          洗練されたスライドを作る。


                         必要なのは、色の経験です。

                          知識はいりません。
Tuesday, April 23, 13
色の組み合わせ
                        色の使い方




                                色の意味




Tuesday, April 23, 13
色の意味



                                作 で
                         象 操
                    印             に
                           き    手
                         聞          チ
                                 ロー
Tuesday, April 23, 13
                               プ
色の意味




             この色の理由は??
                 色にはそれぞれのイメージがある。
               プレゼンのイメージにあう色彩をえらぼう!


Tuesday, April 23, 13
Navy
                        【濃紺】:大人・落ち着き・誠実・消極性 

                        【Word】:    荒れた大海




Tuesday, April 23, 13
Ultra
                        Marine
                        【群青】:   爽快・快活・元気・好感

                        【Word】:    澄み切った青空




Tuesday, April 23, 13
Sky Blue
                         【水色】:華やか・晴れ・眩しさ・明るさ

                         【Word】:    南国




Tuesday, April 23, 13
Green
            【緑】:   自然・安らぎ・中性 

            【Word】:    森林




Tuesday, April 23, 13
Yellowish
  Green
            【黄緑】:  生命・始まり・春 

            【Word】:    芽吹いた若葉




Tuesday, April 23, 13
Yellow
        【黄】:  喜び・興奮・注意・知性

        【Word】:    もぎたてレモン




Tuesday, April 23, 13
Orange         【オレンジ】:太陽・自由・開放・陽気

                        【Word】:    新鮮オレンジ
Tuesday, April 23, 13
Pink
                        【ピンク】:女性らしさ・控えめ・かよわい・かわいい

                        【Word】:    純愛   
Tuesday, April 23, 13
Red
                         【赤】:情熱・活発・攻撃・刺激・勝負

                        【Word】:    キャンプファイヤー     
Tuesday, April 23, 13
Shocking
                          Pink

                        【蛍光ピンク】:性的・快活・子供・刺激

                          【Word】:    エロ




Tuesday, April 23, 13
Purple
                        【紫】:高貴・下品・二面性・欲

                        【Word】:    古代の神秘




Tuesday, April 23, 13
Black
                         【黒】:   重さ・吸収・機能美・調和・安定 

                         【Word】:    未知の不吉




Tuesday, April 23, 13
White
                         【白】:   純白・清純・無垢・平和・清潔

                         【Word】:    雪 




Tuesday, April 23, 13
Appropriate
                        それぞれの色のイメージを連想して、適切な配色を使えれば、
                               印象的なプレゼン作れます。




Tuesday, April 23, 13
色の組み合わせ
                        色の使い方




                                色の意味




Tuesday, April 23, 13
色の組み合わせ




                         配色のルール


Tuesday, April 23, 13
色の組み合わせ




             ひとつ、明度
             ふたつ、彩度
                                  を整える。

Tuesday, April 23, 13
明度




             まずは、明度
                             を知る。




Tuesday, April 23, 13
明度




             まずは、明度
                                             い
                                            か
                              量が多いほど、明度は    た
        明度は、白の絵の具の量。

                             量が少ないほど、明度は   ひく
                                             い
Tuesday, April 23, 13
明度




             まずは、明度
  高
             まずは、明度          低



             まずは、明度
Tuesday, April 23, 13
彩度




         つぎに、彩度
                             を知る。




Tuesday, April 23, 13
彩度




             つぎに、彩度
                             彩度は、色の鮮やかさのことをいう。


       彩度が0とは灰色に近づいていくなどの、色彩にメリハリがなくなっていくことです。


                               上は彩度が整っています。




Tuesday, April 23, 13
彩度




             つぎに、彩度
             つぎに、彩度
             つぎに、彩度
                             これは彩度がある状態。
Tuesday, April 23, 13
彩度




             つぎに、彩度
             つぎに、彩度
             つぎに、彩度
                             これは彩度がない状態。
Tuesday, April 23, 13
配色のルール




                         配色のルール
                   色カラーさんのWeb Site がおすすめ。
                       http://iro-color.com/
                   色見本でイメージに合った構図を作ろう。


Tuesday, April 23, 13
色の組み合わせ




                         配色のルール


                           あ 。
Tuesday, April 23, 13
色の組み合わせ



                           後 に
                         最      】
                              象
                         配色のルール
                            印
                          【    ー ル
                           の ル
Tuesday, April 23, 13
印象のルール




                                      =
                                          !
  メインの色面積                        色数       印象



Tuesday, April 23, 13
印象のルール


                                      快活・子供




            第一印象                       =
                                           !
  メインの色面積                        色数           印象
  ※面積には文字も含まれます



                                 0 落ち着き・大人
Tuesday, April 23, 13
ためしに、




    Theme :TGIF
Tuesday, April 23, 13
華金。




                        Thank God. It’s Friday.


Tuesday, April 23, 13
華金。

                        白をメインにモダンで洗練
                         された配色、色の面積。

                           Thank God. It’s Friday.


Tuesday, April 23, 13
om n t o
                        M e
                         mor i
Tuesday, April 23, 13
5色以上の配色、彩度が高く陽気な色使い
       で、wiki の写真がparty nightに変わる。


                         om n t o
                        M e
                         mor i
Tuesday, April 23, 13
印象のルール



                             色は試行錯誤。




                         作った分だけ
                         うまくなる。
                                       責任は取れませんが。


Tuesday, April 23, 13

More Related Content

What's hot

なぜあの人のプレゼンテーションはいつもイイねと言われるのか0716
なぜあの人のプレゼンテーションはいつもイイねと言われるのか0716なぜあの人のプレゼンテーションはいつもイイねと言われるのか0716
なぜあの人のプレゼンテーションはいつもイイねと言われるのか0716
Dai Murata
 
高橋メソッドサンプル
高橋メソッドサンプル高橋メソッドサンプル
高橋メソッドサンプル
Takashi Fujimoto
 

What's hot (20)

色で失敗しない為に 〜理論に基づく配色フロー〜
色で失敗しない為に 〜理論に基づく配色フロー〜色で失敗しない為に 〜理論に基づく配色フロー〜
色で失敗しない為に 〜理論に基づく配色フロー〜
 
伝わるプレゼンをする方法
伝わるプレゼンをする方法伝わるプレゼンをする方法
伝わるプレゼンをする方法
 
プレゼンの技術
プレゼンの技術プレゼンの技術
プレゼンの技術
 
しょぼいプレゼンをパワポのせいにするな! by @jessedee
しょぼいプレゼンをパワポのせいにするな! by @jessedeeしょぼいプレゼンをパワポのせいにするな! by @jessedee
しょぼいプレゼンをパワポのせいにするな! by @jessedee
 
メンタルモデル・ダイアグラムで学ぶ定性(質的)分析・親和図法 :2015年1月31日 ワイワイCAFE BITTER
メンタルモデル・ダイアグラムで学ぶ定性(質的)分析・親和図法 :2015年1月31日 ワイワイCAFE BITTERメンタルモデル・ダイアグラムで学ぶ定性(質的)分析・親和図法 :2015年1月31日 ワイワイCAFE BITTER
メンタルモデル・ダイアグラムで学ぶ定性(質的)分析・親和図法 :2015年1月31日 ワイワイCAFE BITTER
 
事例で学ぶデザインの原則 by Life is Tech !
事例で学ぶデザインの原則 by Life is Tech !事例で学ぶデザインの原則 by Life is Tech !
事例で学ぶデザインの原則 by Life is Tech !
 
マーケティングとは何か
マーケティングとは何かマーケティングとは何か
マーケティングとは何か
 
Webデザインのセオリーを学ぼう
Webデザインのセオリーを学ぼうWebデザインのセオリーを学ぼう
Webデザインのセオリーを学ぼう
 
なぜあの人のプレゼンテーションはいつもイイねと言われるのか0716
なぜあの人のプレゼンテーションはいつもイイねと言われるのか0716なぜあの人のプレゼンテーションはいつもイイねと言われるのか0716
なぜあの人のプレゼンテーションはいつもイイねと言われるのか0716
 
つたわるスライド
つたわるスライドつたわるスライド
つたわるスライド
 
好みや多数決で決めない、デザインとの正しい付き合い方
好みや多数決で決めない、デザインとの正しい付き合い方好みや多数決で決めない、デザインとの正しい付き合い方
好みや多数決で決めない、デザインとの正しい付き合い方
 
プレゼン初心者にありがちなアンチパターン
プレゼン初心者にありがちなアンチパターンプレゼン初心者にありがちなアンチパターン
プレゼン初心者にありがちなアンチパターン
 
研究発表のためのプレゼンテーション技術
研究発表のためのプレゼンテーション技術研究発表のためのプレゼンテーション技術
研究発表のためのプレゼンテーション技術
 
ビジネスマン必見!キレイな提案書を作るためのデザインの基礎知識
ビジネスマン必見!キレイな提案書を作るためのデザインの基礎知識ビジネスマン必見!キレイな提案書を作るためのデザインの基礎知識
ビジネスマン必見!キレイな提案書を作るためのデザインの基礎知識
 
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司
 
Webデザインのための配色セオリー
Webデザインのための配色セオリーWebデザインのための配色セオリー
Webデザインのための配色セオリー
 
Data × UX - 定量分析と定性分析のシナジーをガチUXデザイナーが語る
Data × UX - 定量分析と定性分析のシナジーをガチUXデザイナーが語るData × UX - 定量分析と定性分析のシナジーをガチUXデザイナーが語る
Data × UX - 定量分析と定性分析のシナジーをガチUXデザイナーが語る
 
スタートアップの 3 分ピッチテンプレート
スタートアップの 3 分ピッチテンプレートスタートアップの 3 分ピッチテンプレート
スタートアップの 3 分ピッチテンプレート
 
高橋メソッドサンプル
高橋メソッドサンプル高橋メソッドサンプル
高橋メソッドサンプル
 
ドワンゴの新卒エンジニアが 新規サービスを立ち上げるまで
ドワンゴの新卒エンジニアが新規サービスを立ち上げるまでドワンゴの新卒エンジニアが新規サービスを立ち上げるまで
ドワンゴの新卒エンジニアが 新規サービスを立ち上げるまで
 

理詰めスライド(色彩編)

  • 1. HOW TO め ma Aoi Ebinu 理 詰 →→→色彩編 スラ Tuesday, April 23, 13
  • 2. で す。 重要 ま す。 とも も めし て と て すす けでは ない おい をお るわ 作に 、 ター くな 印 象操 場 合 ィ ネー うま とり 色 は たい ーデ 使いが 図の 知り ーコ 、構 正 確に カラ ら色 使い 定 、 たか る色 彩検 おえ 使え 色 強し ら、 、勉 なが ただ 。 混ぜ す。 ます 例を いま 思 い 具体 と思 で は、 たい こ こ いき って 方 をや Tuesday, April 23, 13
  • 3. 色の組み合わせ 色の使い方 色の意味 Tuesday, April 23, 13
  • 4. 色の組み合わせ 色の使い方 色の意味 Tuesday, April 23, 13
  • 5. 色の使い方 これがイイタイコトです。 Tuesday, April 23, 13
  • 6. 色の使い方 目次の色と帯の色を一致させることで、 イメージを喚起することができる。 色はイメージの補強を行います。 Tuesday, April 23, 13
  • 7. 色の使い方 伝えたいことがあるときには、 補色(次ページで説明)をつかうと効果的。 ただ同じ明るさの色で補色を使うと 目がチカチカしますね。 これをハレーションと言います。 同じ強さの主張でどっちが 伝えたいことかわかりません! Tuesday, April 23, 13
  • 8. Mancell Color Circle(マンセル色相環) 補色はそれぞれの180 の 位置にある色を示します。 混ぜると黒・灰色・白の 彩度をもたない色になります。 Tuesday, April 23, 13
  • 9. 色の使い方 イメージを連想させる。 何かを際立たせたる。 誤った印象を防ぐ。 洗練されたスライドを作る。 必要なのは、色の経験です。 知識はいりません。 Tuesday, April 23, 13
  • 10. 色の組み合わせ 色の使い方 色の意味 Tuesday, April 23, 13
  • 11. 色の意味 作 で 象 操 印 に き 手 聞 チ ロー Tuesday, April 23, 13 プ
  • 12. 色の意味 この色の理由は?? 色にはそれぞれのイメージがある。 プレゼンのイメージにあう色彩をえらぼう! Tuesday, April 23, 13
  • 13. Navy 【濃紺】:大人・落ち着き・誠実・消極性  【Word】:    荒れた大海 Tuesday, April 23, 13
  • 14. Ultra Marine 【群青】:   爽快・快活・元気・好感 【Word】:    澄み切った青空 Tuesday, April 23, 13
  • 15. Sky Blue 【水色】:華やか・晴れ・眩しさ・明るさ 【Word】:    南国 Tuesday, April 23, 13
  • 16. Green 【緑】:   自然・安らぎ・中性  【Word】:    森林 Tuesday, April 23, 13
  • 17. Yellowish Green 【黄緑】:  生命・始まり・春  【Word】:    芽吹いた若葉 Tuesday, April 23, 13
  • 18. Yellow 【黄】:  喜び・興奮・注意・知性 【Word】:    もぎたてレモン Tuesday, April 23, 13
  • 19. Orange 【オレンジ】:太陽・自由・開放・陽気 【Word】:    新鮮オレンジ Tuesday, April 23, 13
  • 20. Pink 【ピンク】:女性らしさ・控えめ・かよわい・かわいい 【Word】:    純愛    Tuesday, April 23, 13
  • 21. Red 【赤】:情熱・活発・攻撃・刺激・勝負 【Word】:    キャンプファイヤー      Tuesday, April 23, 13
  • 22. Shocking Pink 【蛍光ピンク】:性的・快活・子供・刺激 【Word】:    エロ Tuesday, April 23, 13
  • 23. Purple 【紫】:高貴・下品・二面性・欲 【Word】:    古代の神秘 Tuesday, April 23, 13
  • 24. Black 【黒】:   重さ・吸収・機能美・調和・安定  【Word】:    未知の不吉 Tuesday, April 23, 13
  • 25. White 【白】:   純白・清純・無垢・平和・清潔 【Word】:    雪  Tuesday, April 23, 13
  • 26. Appropriate それぞれの色のイメージを連想して、適切な配色を使えれば、 印象的なプレゼン作れます。 Tuesday, April 23, 13
  • 27. 色の組み合わせ 色の使い方 色の意味 Tuesday, April 23, 13
  • 28. 色の組み合わせ 配色のルール Tuesday, April 23, 13
  • 29. 色の組み合わせ ひとつ、明度 ふたつ、彩度 を整える。 Tuesday, April 23, 13
  • 30. 明度 まずは、明度 を知る。 Tuesday, April 23, 13
  • 31. 明度 まずは、明度 い か 量が多いほど、明度は た 明度は、白の絵の具の量。 量が少ないほど、明度は ひく い Tuesday, April 23, 13
  • 32. 明度 まずは、明度 高 まずは、明度 低 まずは、明度 Tuesday, April 23, 13
  • 33. 彩度 つぎに、彩度 を知る。 Tuesday, April 23, 13
  • 34. 彩度 つぎに、彩度 彩度は、色の鮮やかさのことをいう。 彩度が0とは灰色に近づいていくなどの、色彩にメリハリがなくなっていくことです。 上は彩度が整っています。 Tuesday, April 23, 13
  • 35. 彩度 つぎに、彩度 つぎに、彩度 つぎに、彩度 これは彩度がある状態。 Tuesday, April 23, 13
  • 36. 彩度 つぎに、彩度 つぎに、彩度 つぎに、彩度 これは彩度がない状態。 Tuesday, April 23, 13
  • 37. 配色のルール 配色のルール 色カラーさんのWeb Site がおすすめ。 http://iro-color.com/ 色見本でイメージに合った構図を作ろう。 Tuesday, April 23, 13
  • 38. 色の組み合わせ 配色のルール あ 。 Tuesday, April 23, 13
  • 39. 色の組み合わせ 後 に 最 】 象 配色のルール 印 【 ー ル の ル Tuesday, April 23, 13
  • 40. 印象のルール = ! メインの色面積 色数 印象 Tuesday, April 23, 13
  • 41. 印象のルール 快活・子供 第一印象 = ! メインの色面積 色数 印象 ※面積には文字も含まれます 0 落ち着き・大人 Tuesday, April 23, 13
  • 42. ためしに、 Theme :TGIF Tuesday, April 23, 13
  • 43. 華金。 Thank God. It’s Friday. Tuesday, April 23, 13
  • 44. 華金。 白をメインにモダンで洗練 された配色、色の面積。 Thank God. It’s Friday. Tuesday, April 23, 13
  • 45. om n t o M e mor i Tuesday, April 23, 13
  • 46. 5色以上の配色、彩度が高く陽気な色使い で、wiki の写真がparty nightに変わる。 om n t o M e mor i Tuesday, April 23, 13
  • 47. 印象のルール 色は試行錯誤。 作った分だけ うまくなる。 責任は取れませんが。 Tuesday, April 23, 13