カテゴリー: 学科　ECサイトデザイン基礎

-本日のアジェンダ-

1限目
実技 ECサイトデザイン実習⑤
コンペ結果の発表

2限目
実技 ECサイトデザイン実習⑤
ポートフォリオ用作品の整備

3限目
実技 ECサイトデザイン実習⑤
ポートフォリオ用作品の整備

4限目
実技 ECサイトデザイン実習⑤
ポートフォリオ用作品の整備

5限目
実技 ECサイトデザイン実習⑤
ポートフォリオ用作品の整備

本日のテーマ

これまでの作品をポートフォリオ用にブラッシュアップしましょう。

-本日のアジェンダ-

1限目
学科 ECサイトデザイン基礎③
課題発表

2限目
学科 ECサイトデザイン基礎③
バナー作成

3限目
学科 ECサイトデザイン基礎③
バナー作成

4限目
学科 ECサイトデザイン基礎③
バナー作成

5限目
学科 ECサイトデザイン基礎③
バナー発表

本日のテーマ

贈答品（食品）のバナーを作成してみましょう。

本日の課題

• お題：贈答品（食品）。 『敬老の日』に贈り物をする人がクリックしたくなるバナーを作成しましょう
• リンク先：実在する商品購入ページ（楽天以外でも良いです。写真画像はリンク先ページから取得しましょう）
• サイズは不問です。
• 2商品以上作りましょう。
• 提出先：【作品】バナー④敬老の日バナー_200831
• 4限目途中13:40修了時に提出

提出ファイルの形式について

①作成したバナー： task_〇〇〇〇_yymmdd_1.jpg
　※ 〇〇〇〇はお名前です。
　※複数作成するので末尾に数値を付けてください。
②遷移先のURL： task_〇〇〇〇_yymmdd.txt
　※terapadで作成して提出してください。

画像取得時の留意点

Chromeで、画像を右クリック＞「名前をつけて画像を保存」をしようとして、WebP形式のファイルだった場合
①画像を右クリック >「新しいタブで画像を開く」
②新しいタブのURLを画像の形式（JPG等）に変更する。
③ 「名前をつけて画像を保存」

拡張子「WebP（ウェッピー）」のファイルをJPEGやPNGなどに変換する方法

Photoshopの操作

• （横書き・縦書き）文字ツール
• 長方形ツール
• 整列ツール（等間隔に分布 ・〇〇方向に分布 ）
• レイヤースタイル（境界線・ カラーオーバーレイ・ 光彩（外側）・ドロップシャドウ）
• アートボードツール
• 書き出し形式…（①ファイル＞書き出し②レイヤー右クリック）
• グラデーションツール（レイヤーマスクへの適用）
• レイヤーの『不透明度』と『塗り』（境界線の掛け方）