-本日のアジェンダ-
1限目
学科 ECサイトデザイン基礎②
Photoshopの機能について
2限目
学科 ECサイトデザイン基礎②
Photoshopの機能について
3限目
学科 ECサイトデザイン基礎②
サムネイル画像 作成
4限目
学科 ECサイトデザイン基礎②
サムネイル画像 作成
5限目
学科 ECサイトデザイン基礎②
サムネイル画像 作成
本日のテーマ
サムネイル画像 について
サムネイル画像とは？
サムネイル画像は、親指(サム)の爪(ネイル)のように小さい画像という意味で、実際に撮影した画像から解像度を下げたり、圧縮したりするなどの手法で、ファイルサイズを小さくしたデータです。 情報量が少ないので読み込みが早く、一覧表示で多くの画像を素早く見ることができます。
参考サイト
本日の課題
-サムネイル画像 作成練習 ①-
サムネイル画像の作成をして下 さい。
作成したバナーを5限目終了までにドロップボックスにUPしてください。
※ファイル名は、img001_xxxx_20221220.jpg
-サムネイル画像 作成練習 ②-
サムネイル画像の作成をして下さい。
作成したバナーを5限目終了までにドロップボックスにUPしてください。
※ファイル名は、img002_xxxx_20221220.jpg
昨日までの基本知識
ECサイトについて
ECサイトとは、自社の商品やサービスを、インターネット上に置いた独自運営のウェブサイトで販売するサイトのことである。ECとは英語: electronic commerceの略。 複数の企業や個人商店がインターネット上の1か所で出店する形態のウェブサイトは、電子商店街の項目を参照。 ウィキペディア
参考サイト
バナー広告とは？
バナー はウェブページ上で他のウェブサイトを紹介する役割をもつ画像のこと。本来、旗印を意味し、ウェブページ上で広告が目立つように使われたことから、この通名で呼ばれ定着した。 主に広告・宣伝用に作られ、ウェブサイトへのハイパーリンク用にも利用される。 ウィキペディア
参考サイト
ワンポイントアドバイス
バナー作成はデザインの全ての要素が詰まっている作品です。
ポートフォリオに掲載する最も効果的なアイテムとなりますので、しっかりと良い作品作りが出来るように進めていきましょう。
覚えておくと良い基本操作
- シェイプ・パス・ピクセル
【Photoshop】シェイプとは？ピクセルとは？パスとの違いは？ - 描画ツール
Photoshop のシェイプツールを使ったシェイブの描画 – Adobe Help Center - パス選択ツール
パス選択ツール – パスの操作 – Photoshop養成ギプス
Photoshop基本操作まとめページ 基本操作⑦
バナー制作で覚えておきたい復習
- スマートオブジェクト
- 調整レイヤー
- トリミング復習
- レタッチ復習
- クリッピングマスク
- レイヤーマスク
- ベクトルマスク
バナー制作で覚えておきたい技術
- 枠作成（レイヤースタイル）
- グラデーション（レイヤースタイル）
- 境界線（レイヤースタイル）
- 光と影（レイヤースタイル）
- レイアウト/文字/配色
- カンバスサイズ
- Web用に書き出し（ jpg gif png ）