講義名：学科ECサイト運用基礎①
受講日：2023年10月17日(火) 晴れ
受講形態：オンライン
講師：田中先生
本日の資料：「デザインの考え方の教科書④」
今まで、ピクトグラムやロゴ、アクセスマップなどを作ってきて、これから先の課題は絶対に提出しないとダメ、というものではないが、学校の課題は最終的には自分のポートフォリオに載せるものになる。（名刺になる。）就職のために作る作品になる。
今までやってきたものはWebだが、ここからはWebデザインになってくる。まずはバナー。
バナーとは何か？
・バナーとは、DMに近くDMよりもっと情報を凝縮したもの。ポチッと押したらページに飛んでいくやつ。バナー広告のこと。面積が小さいので端的にやらないといけない。
・バナーはIllustratorで作る人もいるが、Photoshopで作るケースが多い。
・本日の資料に載っているものは、斉藤先生が作ったバナー。
・バナーの印刷物と違う点はサイズが決まっていないこと。
・ECサイトなどはバナーを作る機会多い。さまざまなジャンルを見ていく。
・バナーはサイズの決まりはない。依頼を受けた時にサイズ入ってくる。
バナー制作初心者＝完全模写（完コピ）
・初心者がバナー制作をするにあたり、まずは既存のバナーを完全模写（完コピ）する＝一番最初のステップとして良い。
・どんなバナーが売れるか、人の研究をしてみる。可愛い、かっこいい、言語化する必要がある。
・模写をすると、このデザイナーはどういう意図でこれをやったのか？がだんだんわかってくる。
・その後は商材を変えてみる。
・この世にオリジナルのものなどない。普通の仕事の依頼に対して依頼主は奇抜なデザインを求めていない。売れるデザインはこの世に既にある。
・諸先輩デザイナーの作品をパクる。オリジナリティは入れていいけどクライアントが求めているものと乖離しやすい。バナーのいいところを徹底的にパクる。今から訓練としてやっていくべき。パクって自分のものにする。
・文字の見やすさ、レイアウトをまんまパクって良い。文字、配色をしっかり意識して真似をする。
バナー制作の制限時間は1時間！
・1時間を意識する。
・コツは「手間」「無駄」「無理」をしない。
・就職のための面接で技術テストがあったりする。その際に制限時間が1時間だったりする。
・1時間以上かけると目が慣れてしまって、そこにどんどん依存してしまう。
・バナーは普段見る側として3秒程度しか見ていないものを作成に1時間以上かけてしまうと、依存してしまって脳が危険。時間をかけすぎるとうまくいくものもいかなくなってしまって、デザインの依存性が強くなる。
・なので手間かけない。無駄な作業をしない。ポイントはソフトの理解をする。操作がサクサクできるなら1時間以上かけない。
・「予算」と言う話もある。本当の理想はバナー制作30分。
バナーの単価は安い。
バナーの単価は安い。フリーでやってくなら、ココナラ・ランサーズなどでバナー1本1万円。（例えば5種類、2回のリテイク込み。）バナー制作に時間をかけていたら商品価値が落ちてしまう。時間をかけすぎると客観視できなくなる。思った通りにうまくいかないときはやめて違うものを作る。作業を戻りたい、と思うときは、新しく作った方が良いことがある。一旦時間をおくと見えてくることがある。離れてみることも良い。または完全やり直すか。とにかくあまり時間をかけないこと。
レイアウトデザイン
これがレイアウトする上での基本。余白は心の余裕につながる。心の余裕がない人はキチキチのデザインになる。「スペースが美しければ、作品も美しくなる。」
まずはレイアウトをきちんと取ることが基本。一番大事な言いたいことを一番面積をとる。あと商品画像。
余白のポイント
①作品の周りに余白を取る
②各項目の周りにも余白を取る
③枠の中は窮屈にしない
余白は本当に大事。思っている以上に余白がないと読みづらい。バナーなんかは一瞬でいいと思えばクリックするし、悪ければクリックされない。余白のないレイアウトはすごく素人臭い。余白は本当に大事。
配置した内容のグループ化とポイント
①近接 (Proximity)
②整列 (Alignment)
③反復 (Repetition)
要素の配置とグループ化について。見出しと本文、見出しと本文、は同じレイアウトを使うこと。反復しないと内容が伝わりづらい。情報をきちんとグループ化すること。
アクセントのポイント
①コントラスト (Contrast)
②ジャンプ率を変える
③アイキャッチを考える
文字デザイン
①可読性
②視認性
③判読性
とにかく読みづらかったら意味がない。線の細いものは目が疲れない。
グラデーションが安易だとダサく素人臭くなる。
バナーに関してだと、可読性高い方が良い。説明文を読ませるものではないので、色で可読性を高くする。
最後に配色
まずはレイアウトで、色は最後に入れる。白黒で作っていってアシライなんかも黒にした方が良い。
パクることは悪いことではない！
引き出しが多く活用が上手い人の方がデザイン上手くなる。徹底的に要素をパクろう。バナーは作品として載せやすい。Illustratorメインで作る人もいるが、Photoshopメインと学校で言っているのは、時間短縮のため。先生はIllustratorの方が好きだが、最近はPhotoshop一本になっている。ただ、適材適所で使っていけば良い。
Googleで「バナー ギャラリー」で調べると参考ギャラリーサイトがある。引き出しを増やすためにやってはいけないと思わないこと。「LIGバナーライブラリー」「バナー広場」等ブックマークしておくと良い。例えば「春のケーキ」はバナーではどんな感じ？パクることは悪いことではない。
バナー制作にあたっての注意点
商用利用okのサイトなら素材集を使って問題ない！「シルエットデザイン」とか、どんどん使う。自分で書くことでめっちゃ時間がかかるのであれば使った方が良い。ただ、商用利用してokかどうかは気をつける。
素材集のものはロゴには使ってはいけない。ロゴは商標登録できる。それを利用して商標登録してしまうのはNG。無料素材だけど、グッズ展開はダメ、とかも結構ある。グッズ展開とロゴはダメ！！！！ただ、積極的にバナーであればどんどん使って良い。
次回は完全模写＋その後は商材を変えて模写。（メンズ服→レディース服）。商材を変える模写も勉強になる。
コメント