〈43〉11/29ECサイトデザイン基礎⑤LPデザインカンプ準備

目次 1. デザインカンプについて 2. フォントについて 3. 配色について

1. 制作の順番はデザインの基本通り
  ・レイアウトは余白、グループ化、アクセント
  ・文字は読みやすく
  ・配色は作品の世界観を大切に
  ・表現…ボックス、各丸ボックス、罫線、点線、帯、アーチ、斜め、ハチマキ…

2. 文字デザイン
  ・可読性、視認性、判読性を意識して
 【フォントのはなし】
  ①ゴシック体…基本フォントの一つ。見出し、看板・ポスター、プレゼン資料
  ②明朝体…基本フォントの一つ。見出し、新聞、書籍、教科書、説明など
  ③デザインフォント…デザイン的に工夫された書体。さまざまな表情。
     フリーフォントで配布されているものも多いが、商用確認が可能かは要確認。
  ④毛筆フォント…毛筆で作られているような日本語フォント。

 【主なフォント】
  ・Noto フォント
   源ノ角ゴシック「Noto Sans」と源ノ角明朝「Noto Serif」。
   GoogleとAdobeが共同開発したシリーズ。無料。webフォントとしても利用可。
  ・小塚明朝・ゴシック
   Adobeのオリジナル和文書体。
  ・UDデジタル教科書体
   日本語ユニバーサルデザインフォント。2016年発売。
  ・メイリオ・MS・フォント
   WindowsVistaのために開発された和文フォント。デザイン性に欠けるらしい。
  ・ヒラギノフォント
   有料フォント。ベーシックかつ明るくシャープ。デザイン業界でよく使われている。

  【見やすくする工夫】
  太字や斜体はデザインを損なうので、ドロップシャドウ、光彩、境界線、ボックス、背景の色、
  ぼかしなどで対応を。

3. 配色デザイン 
  【注意点】
  ①配色はデザインカンプですべて決定しておくこと!
  ②16進数のカラー表記なのか、RGB表記なのか統一を。
  ③透過表現はRGBAなのか、PNG画像なのか。
  ④クライアントには複数案提出して、頭の中を具現化する手伝いをすること。

 【配色の意味と目的】
  色のもつイメージを大切に。
  赤…愛、情熱、命、危険、怒り、戦闘
  青…冷静、誠実、知的、冷淡、孤独、憂鬱
  黄…活発、無邪気、幸福、軽快、危険、幼稚、希薄
  紫…高貴、女性らしい、神秘的、優雅さ
  橙…元気、にぎやか、食欲、子どもっぽさ
  緑…自然、エコ、若さ、安全
  白…公正、平和、純粋、クリーン
  灰…上品、大人っぽさ、スタイリッシュ、知的
  黒…権威、気高さ、ラグジュアリー など

 【配色テクニック】
  ①イメージカラーを使う
  ②黒をどう使うか
  ③モノトーンでいく
  ④美しい配色バランス…70:25:15=ベースカラー、メインカラー、アクセントカラー

 【配色の印象】
  やわらかい、興奮する、軽い、硬い、沈む、重いなどの印象も念頭においてみましょう。

その後、LPの素材集めをしました。
HTML、CSSなどの知識が全くないので、この先のことが見えにくくはありますが、とにかくやってみます。

★お昼ご飯メモ
 夫がマルイの地下で「いちのやののり弁」を買ってきてくれた。なんと1200円もする。夫が誇らしげに、持ってみろ、と促すので手にすると、ずっしりと重い。蓋をあけると、海苔の乗ったご飯が敷き詰められていて、その上に白身魚のフライ、焼き鳥、きんぴらごぼう、ものすごく長い磯部揚げなどが足の踏み場もないほどに寝転んでいる。」
 1200円ののり弁など生まれて初めて食べる。最初は、「どれどれどんなもんでしょうかね!」という態度だが、食べているうちに、のり弁側の「絶対に満足させてやる」という気概が漏れ伝わってくる。「私はね、あなた、ただののり弁じゃあないですよ。果たして、あなたにその価値がわかるでしょうかね」と挑発してくる、いや、食べ手のことを試している。「わかりません」とは言えない雰囲気がある。どれも確かにおいしい。しょうゆが入っている魚まで黄金色である。お弁当の蓋の裏に一品一品の能書きが描かれていて、それを読みながら一生懸命に食べる。最後、焼き鳥がひとつ食べられないくらいに満腹になり、600円のから揚げ弁当をすでに食べ終わっていた夫に譲った。
 「いちのやののり弁」ではあるが、すべてののり弁の意地を見た気がする。すべてののり弁から託された希望、夢、未来を背負っている。あのずっしりとした重みは、その重さだったか。
 
 
 

おすすめ記事

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です