WEBデザイン制作・開発講義WEB Design&Development Lecture

ハイブリッド型WEB配色レイアウト・シミュレーション

テイストによるカラーコーディネート・レイアウトシミュレーション【ハイブリッド型】

配色チャートの選択

  • 『フルカラー』
  • 『WEBセーフカラー』

テイストの選択

ロマンチック 初々しい
しなやか 柔和な
おだやかな なごやかな
メルヘンチック 未来的
希望 進歩的な
エレガント 優雅な
フェミニン しっとりとした
ドレッシー 女性的な
まがいもの ナチュラル
平和な 安らかな
素朴な 家庭的な
親密な のどかな
アース調 エコロジー
プリティ 可愛らしい
子供っぽい 可憐な
甘い キュート
クリア 純粋な
清潔な 清楚な
さわやかな ドライ
冷静な シンプルな
淡白な あっさりした
さっぱりした カジュアル
にぎやかな 楽しい
愉快な クレイジー
滑稽な 気楽な
ルーズ 意外な
フレッシュ 若々しい
新鮮な ストリート調
肌触りのよい 健康な
堅実な エステ調
進化 スポーティ
活動的な 大胆な
行動的な ヒップホップ調
カーニバル ダイナミック
強烈な 激しい
サイケ調 衝撃的な
アバンギャルド 革命的な
歓喜 楽観的な
風変わりな エポック
ゴージャス 豪華な
ぜいたくな 派手な
はなやかな セクシー
色っぽい エロチックな
充実した 円熟した
美昧しそうな まろやか
香ばしい 大人っぽい
恍惚 アクロバティック
エスニック 土着的な
辛い 酸っぱい
苦い 異国風の
風刺的な ワイルド
荒っぽい たくましい
粗野な アフロ
アーミー モダン
シャープな インテリ風
機械的な ハイブリッド
洗練された ノーブル
格調のある 気高い
貴重な 気品のある
敬意 優れた
シック おしゃれな
粋な 神秘的な
幽玄な 静かな
宇宙的な オカルト
クール 冷たい
スピーディ 都会的な
ネイビー フォーマル
正式な シリアス
儀礼的な 頑固な
ダンディ 渋い
落ち着いた 実用的な
カオス クラシック
重厚な 伝統的な
保守的な 堅牢な
男性的な スマートな
地味な ひなびた
質素な 日本的な
枯れた 古着風な
チープな 悲観的な
悲壮な 寂しい
  • 【ハイブリッド型WEB配色レイアウト・シミュレーションとは】
    160種類のテイスト(感性、イメージ語)に対応した配色レイアウト表示ができます。「テイスト」に関連した４色を「基調」「調和」「対比」「強調」に対応させた配色でそれをチェックし、カラーパレット・リストのカラー欄をクリック選択するとレイアウト上の該当するカラーが自動的に変更されます。Ajax技術による処理のため、操作がスムーズです。
  • 【操作手順】
    1. 配色チャートは、２種類あり、『フルカラー』対応と表示カラー限定した『WEBセーフカラー』対応のどちらかを選択をします。
    2. 次に『テイストの選択』欄から表示したい「テイスト」(感性、イメージ語)を選択すると該当するカラーパレットとレイアウト上に配色した内容を表示します。
    3. ２種類のレイアウトに対して、配色が「新」「旧」「強」「弱」の４種類のカテゴリがあり、そのカテゴリごとに４色の変更可能な「基調」「調和」「対比」「強調」があり、それらにチェックを入れて選択します。
    4. その後、上部に表示されたカラーパレット・リストのカラー欄をクリックするとそのカラーに変更され、何度も繰り返して、色々の配色を確認できます。 （注）『操作方法』のビデオ表示
  • 【カラーパレットの属性説明】
    ■基調カラーの白抜き文字 :^　■グラデーション t:3色上 m:3色中 b:3色下　 U:2色上 D:2色下　■５色目 *:統一感 +:アクセント

*

新

◆ CXMedia Corporation
Contrast
 Harmony Main color
Color coordinate
layout simulation
produced by
CXMedia Corp.		 Accent  
基調 調和 対比 強調

強

◆ CXMedia Corporation
Contrast
 Harmony Main color
Color coordinate
layout simulation
produced by
CXMedia Corp.		 Accent  
基調 調和 対比 強調

旧

◆ CXMedia Corporation
Contrast
 Harmony Main color
Color coordinate
layout simulation
produced by
CXMedia Corp.		 Accent  
基調 調和 対比 強調

弱

◆ CXMedia Corporation
Contrast
 Harmony Main color
Color coordinate
layout simulation
produced by
CXMedia Corp.		 Accent  
基調 調和 対比 強調

 

新

Harmony
CXMedia Corporation
           
Main color
Color coordinate layout simulation
produced by CXMedia Corp.		 Accent
基調 調和 対比 強調

強

Harmony
CXMedia Corporation
           
Main color
Color coordinate layout simulation
produced by CXMedia Corp.		 Accent
基調 調和 対比 強調

旧

Harmony
CXMedia Corporation
           
Main color
Color coordinate layout simulation
produced by CXMedia Corp.		 Accent
基調 調和 対比 強調

弱

Harmony
CXMedia Corporation
           
Main color
Color coordinate layout simulation
produced by CXMedia Corp.		 Accent
基調 調和 対比 強調

*

（注）この「ハイブリッド型WEB配色レイアウト・シミュレーション」は、 『フルカラー』（カラーイメージチャートにおける色相・トーンのカラー・タグ・テーブルを参照）が日本カラーデザイン研究所 編の『カラーイメージスケール』『カラーリスト』等の配色を参考にし、 『WEBセーフカラー』（WEB配色シミュレーションとカラータグチャートを参照）が南雲治嘉 著の『配色イメージチャート』『WEBカラーコーディネート』（グラフィック社）を参考文献にして開発したものです。

pagetopへ