ウェブデザインB 第14回 - ウェブデザインB | WordPress・jQuery・HTML・CSSのスニペット集 WEBCRE8TOR.COM

WEBCRE8TOR.COM

ウェブデザインB 第14回

webdesignb14

前回はバナーデザインについてやその役割、さらにバナーデザイン制作の工程をレクチャーしました。
今回は前々回のページデザインのテイスト別の特徴と、前回のバナーデザインの内容を踏まえ、
実際にバナーの制作を行ないましょう。

今回は「バナーデザイン制作課題A」の制作課題を用意しており、
今回と次回で制作・提出することになります。

授業評価アンケート

アンケートの説明や指示に従って、アンケートの回答をお願いします。
あなたの成績には一切関係がありません。出席は課題学習も含め出席回数を回答してください。

なお回答は1教科につき1人1回で、同じスマホやパソコンから同じ質問への回答はできない仕組みとなっているため、友人間でのスマホの貸し借りはしないようにしてください。またスマホを忘れた場合は、PDF内のアンケート回答用URLから、本日中に自宅のPCやスマホから回答してください。

ウェブデザインB 授業評価アンケート

Photoshopの基本設定

基本設定から行いましょう。まずはPhotoshopを起動してください。

バナーデザインの参考サイト

先週も掲載しましたが、まずはアイディアを膨らませるために参考アーカイブから見本となるデザインを以下の記事から探しておきましょう。

バナーデザイン制作課題A

1つ目の「バナーデザイン制作課題A」のテーマは以下です。
新規PSDデータ「バナーデザイン制作課題A.psd」を作り、課題の制作作業を行なってください。

夏の沖縄旅行のキャンペーンLPのバナー制作依頼

中短ツーリスト株式会社さんからのご依頼。
夏の沖縄旅行のキャンペーンがあり、申し込みのランディングページに誘導するバナーを作って欲しいとのこと。サイズは横300px x 縦250pxの1パターンで、設置場所はYahooJapanのトップページ3カラムの右側のプロフィール枠の上のバナー領域。
キャンペーンは2022年7月20日〜7月31日までの沖縄旅行へのお申し込みが対象で、先着20名様に旅行先で使える3万円分のギフトカードを進呈。画像は1点用意される。

そう、前回参考として制作したバナーデザインと全く同じものです。
全く同じ要件を使って全く別のバナーデザインを作ってみましょう。

ただし、今回は使用画像を以下の画像に変えましょう
以下の2枚の画像のどちらか1枚、もしくは2枚の画像を2枚とも使ってバナーの制作を行いましょう。

素材URL:空に向かって元気に咲き誇る沖縄の赤いハイビスカスのフリー画像|おしゃれなフリー写真素材:GIRLY DROP

素材URL:ひさびさの海にはしゃぐ女の子とまったり伸びをする女の子のフリー画像|おしゃれなフリー写真素材:GIRLY DROP

今回はぱくたそさんではなく、より女性的な写真素材の多い「GIRLY DROP(ガーリードロップ)」さんで写真を探しました。ダウンロードの仕方はリンク先のページで確認してくださいね。

こちらの画像は前回とは違い、1枚目はハイビスカスが右下にあったり、2枚目は女性2人が中央で立っていたりするので、主役として使った方がよさそう。

このバナーデザインのコツ

基本的には前回の①要件定義⑤画像素材を入れるまでをそのまま使えますね。
つまり、⑥装飾を行うからの流れに皆さんの個性を出してもらいたいと思います。
当然、装飾テクニックの基本は活かしつつ、皆さんらしさを出してみましょう!

参考:バナー 沖縄 – Google 検索

次回も引き続き制作と併せて提出を行いましょう。

WEBCRE8TOR.COM

SEARCH

PAGES

CATEGORY

ARCHIVE

LINK

CLOSE