WEBデザイン勉強用メモ
デザインの際に確認するメモ
・デザインの4つの基本原則のコントラスト/近接/反復/整列を意識して作成する。
・明るいトーンは優しいイメージ,暗いトーンは重くて重厚なイメージになる
・暖色かつ明度の高い色は前に出て見え、寒色かつ明度の低い色は実際より後ろにあるように見える
・デザインの色彩を考える場合3色程度にとどめる
・色の配色割合 ベース:70% メイン:25% アクセント:5%
・メイン→ベース→アクセントの順番で決めるとわかりやすい
・タイトルや見出しなどの文字を大きく使う場合トラッキングする
・行間は初期設定よりも少し広げることで見やすくなる
色の印象
白
・病院・クリニック系(内科・歯科・美容外科など)
・ウェディング・ブライダルサイト
・清掃業・ハウスクリーニング
黒
・ハイブランド(アパレル・時計・ジュエリーなど)
・クラブ・バー・音楽イベント
・高級家具・インテリア販売
灰色
・IT企業・SaaSサービス
・法律事務所・会計事務所
・ニュースメディア・コラムサイト
赤
・焼肉屋・ラーメン店・ファストフード
・スポーツジム・トレーニング系
・アパレル(ストリート・ユースカルチャー)
・セール・キャンペーン特設ページ
・ガチャ・くじ・エンタメ系アプリ
青
・銀行・証券・保険など金融系
・大学・塾・eラーニングなど教育系
・医療機関(白+青で鉄板の組合せ)
・クラウドサービス・システム系
・空港・交通インフラ系サイト
緑
・農業・オーガニック食品
・健康食品・サプリメント系
・自然保護団体・環境NPO
・アウトドアブランド・登山用品
・園芸・インテリア植物ショップ
黄色
・子供向け商品・おもちゃ
・ゲーム・アニメ・サブカル系
・ファストフード・カフェ
・教育・学習教材(幼児〜小学生向け)
橙色
・イベント告知・フェス系サイト
・ジム・スポーツ施設
桃色
・コスメ・美容サロン
・スイーツ・カフェ
・恋愛系アプリ・メディア
・女性向けファッションブランド
紫色
・占い・スピリチュアル系
・アート・ギャラリー系
・高級感ある美容・ヘアケア製品
茶色
・カフェ・ベーカリー
・木工・クラフト雑貨
・ビンテージ・古着系ショップ
・和風飲食店(そば屋、和菓子など)
代表的なフォント
明朝体
・ヒラギノ明朝
・游明朝
※高級感・大人・和のイメージ
ゴシック体
・ヒラギノ角ゴ
・メイリオ
※ターゲットを老若男女選ばず使えるので汎用性が高い
セリフ体フォント(英語の明朝体みたい)
・Garamond (ギャラモン、ガラモンド)
・Times New Roman(タイムズ・ニュー・ローマン)
※装飾性が高くエレガントで上品な印象を持たせることができる
サンセリフ体フォント(英語のゴシック体みたい)
Arial(エイリアル)
Helvetica(ヘルベチカ)
※「シンプル」「新鮮」「カジュアル」といったイメージを与える
図解の例
序列や階層構造
工程や順序
関係性
物事の量やその推移
【引用元】
Discussion