本日のテーマ
馴染んでください
1限目
実技 ECサイトデザイン実習③
クライアント確認について
2限目
実技 ECサイトデザイン実習③
バナー作成
3限目
実技 ECサイトデザイン実習③
バナー作成
4限目
実技 ECサイトデザイン実習③
バナー作成
5限目
実技 ECサイトデザイン実習③
バナー 講評
クライアントへの確認方法
デザインした制作物をクライアント(発注者)に確認を入れる場合は、そのまま見せる事が最も解りやすい方法です。バナーを作成したらページにそのまま当て込んで(テストアップ等)確認をとります。
ワンポイントアドバイス
バナーを作成したら、スクリーンショットしたページに当て込んでみましょう。違和感が無かったら成功です。ページに馴染むようにデザインの基本ルール「レイアウト」「文字」「配色」に気を付けて作成してみてください。
本日の課題
バナー作成練習 -あて込み-
ご自身で選んだジャンルのバナーを作成し、ページ画像に当て込んで下さい。
4時限目終了までにご自身のポートフォリオサイトにアップしましょう。
5限目に講評を行います。
※バナーサイズ設定は自由です。
※目標2つ以上で制作しましょう。
あ

左から2番目のバナーを作成しました。

作品名:架空アパレルブランドのスタッフ一押しアウター特集
コンセプト:20~30代の女性向け。大人カジュアルなアパレルブランド。
使用ソフト:Adobe Photoshop
製作時間:2時間半
工夫点:当て込む場所の色味に合わせて全体的に淡いカラーを使用しました。
複数人のモデルでレイアウトを組み、画像の背景を白っぽく寄せました。
秋・冬どちらの印象も持つように文字にシャドウやオーバーレイではかなさと透明感を演出しました。
当てこんだ周りは白文字が多かったため、白で統一するよう意識しました。
改善点:遠目で見ると小さい文字が読めない→アイボリーなどもう少し色をつける
「OUTER」の文字が人物の顔に被っている→文字の位置を少し下げるか、画像を上げるかするべきだった
左:元あった画像 右:当て込みで使った素材




右から2番目のバナーを作成しました。

作品名:キウイセット販売
コンセプト:甘酸っぱいキウイを1kgセットでお届け
使用ソフト:Adobe Photoshop
製作時間:1時間
工夫点:全体的にシンプルに仕上げました。
「1kg」が目立つように赤文字に白い影を入れました。
改善点:文字が見にくい→文字に白ふちをつけるor背景を簡素なものにするor背景をもっとぼかす
セット売り感がない→断面キウイの後ろにたくさんのキウイを配置する
「1kg」見やすく→白ふちをつけるor太く縦横比が同じフォントを選ぶ
左:元あった画像 右:当て込みで使った素材



<MEMO>
みんなの当て込みバナーを当てるのが楽しかった。上手く馴染んでいて完成度が高くて刺激を受けた。真似したい要素やどうやって作ったんだろうと思う部分がたくさんあって、見ているだけでも勉強になり楽しかった。