実技 ECサイトデザイン実習① 2025年11月18日
講師:若松 勇次 先生
– 本日のアジェンダ –
1限目
実技 ECサイトデザイン実習①
Photoshopの機能について
2限目
実技 ECサイトデザイン実習①
Photoshopの機能について
3限目
実技 ECサイトデザイン実習①
サムネイル画像 作成
4限目
実技 ECサイトデザイン実習①
サムネイル画像 作成
5限目
実技 ECサイトデザイン実習①
サムネイル画像 講評
本日のテーマ
サムネイル画像 について
サムネイル画像とは?
サムネイル画像は、親指(サム)の爪(ネイル)のように小さい画像という意味で、実際に撮影した画像から解像度を下げたり、圧縮したりするなどの手法で、ファイルサイズを小さくしたデータです。 情報量が少ないので読み込みが早く、一覧表示で多くの画像を素早く見ることができます。
参考サイト
本日の課題
-サムネイル画像 作成練習 –
サムネイル画像作成し、
4限目終了までにご自身のポートフォリオサイトにアップしてください。
5限目に講評を行います。
※目標2つ以上で制作しましょう。

【タイトル】
スキンケア商材 サムネイル画像 モノクロ・ポートレート
【目的】
光と影の差を強調したモノクロ表現で印象が残るサムネイルを製作することを目的としました。
被写体の横顔をシンプルに際立たせ洗練された静かな雰囲気を作り出しています。
【ターゲット】
美容・スキンケアに関心の高いユーザー、特に落ち着いたデザインを求める大人の女性の層
【製作環境・使用ツール】
Adobe Photoshop 2025
【製作時間】
50分
【制作内容(レビュー)】
美容液の存在を邪魔しないモノクロ調にしたことで全体の統一感が出て上品な印象にしました。光のコントラストが肌と美容液の質感を引き立て、シンプルなデザインにすることで視認性の高い仕上がりにしたところがポイントです。

【タイトル】
スキンケア商材(フェイスオイル)サムネイル画像
【目的】
スキンケア商材を紹介するため、人物写真と製品写真を自然に合成し、統一感のあるサムネイル画像を制作することを目的とした。
【ターゲット】
美容・スキンケアに関心のある20〜40代を想定。
【制作環境・使用ツール】
Adobe Photoshop 2025
レイヤーマスク、ブラシ、トーンカーブ、自然な彩度、カラーバランスを使 用。
【制作時間】
約1時間30分
【制作内容(レビュー)】
人物写真と製品写真をレイヤーマスクで合成し、境界部分をぼかして違和感を軽減しました。
また、トーンカーブで明るさを調整し、自然な彩度とカラーバランスで全体の色味を統一しました。全体として柔らかい雰囲気を保ちつつ、製品が見やすいサムネイルに仕上げるよう工夫しました。

【タイトル】
スキンケア商材(フェイスオイル)サムネイル画像
【目的】
美容液の透明感と優しい質感を視覚的に伝えるため、花の要素と肌の光を組 み合わせたサムネイルを制作しました。
落ち着いた雰囲気の中で、製品の清潔感と柔らかさが伝わる構成を意識しています。
【ターゲット】
スキンケアや美容に関心のある大人の女性。特に自然な潤い、透明感を求め る層を想定。
【制作環境・使用ツール】
Adobe Photoshop 2025
描画モード調整、ガウスぼかし、トーンカーブ
【制作時間】
30分
【レビュー】
花の柔らかい色調が肌の質感と自然に馴染み、美容液のやさしい光を引き立てる仕上がりになりました。要素を最小限にしつつ、清潔感と上品さが伝わるよう意識して制作しました。
