INDEX|MECHA

課題② バナーデザイン|Photoshop・Figma

バナー
切り抜き元

課題② バナーデザイン|Figma

 メインビジュアル
課題名 Adobe Phptpshopを使った架空の雑貨屋の新装開店バナーデザイン作成
課題内容 架空の雑貨店の新装開店を告知するバナーを制作。
限られたスペースの中で、告知内容や必要な情報が伝わるように、
文字・画像・色彩などの要素を組み合わせてデザインしました。
制作意図
  1. 本課題では、新装開店という告知の目的を明確にし、見る人に必要な情報を分かりやすく伝えることを意識してバナーを制作しました。

  2. バナーは表示できる面積が限られているため、すべての情報を同じ強さで見せるのではなく、最初に目に入ってほしい情報と、補足として伝える情報を整理することが重要だと考えました。

  3. そのため、文字の大きさや配置、色の組み合わせ、各要素の余白などを調整し、視線の流れと情報の優先順位を意識した構成に取り組みました。また、雑貨店の告知として親しみやすさを持たせながら、新装開店という目的が伝わるデザインを目指しました。

  4. 制作を通して、見た目の印象を整えるだけでなく、告知の目的や伝えるべき情報を踏まえてデザインを組み立てることの大切さを学びました。
サイズ Web広告やSNS広告で使われる標準的な横長寸法 ( 1200 x 628 px )
制作時間 5時間
制作環境 Adobe Photoshop
課題名 Figmaを使用したバナーおよびECサイトデザインのWeb向け再現
課題内容 Photoshopで制作したバナーをもとに、Figmaを使用してWebでの利用を想定したデザインとして再現しました。
制作意図
  1. 本課題では、Photoshopで制作したバナーのデザイン意図を維持しながら、Figmaを使用してWeb向けのデザインとして再現することに取り組みました。

  2. 単純に見た目を模倣するのではなく、文字や画像などの各要素の配置、余白、サイズのバランスを確認し、Web上で使用するデザインとして整理することを意識しました。

  3. また、同じデザインでも制作ツールによって操作方法や作業の進め方が異なることを踏まえ、それぞれのツールの特徴を理解しながら制作しました。

  4. この課題を通して、デザインの意図を保ったまま別のツールで再現する力と、Web制作を見据えてデザインデータを扱う基礎を身につけることを目指しました。
サイズ 1440 x 2620 px
制作時間 8時間
制作環境 Figma

ページの先頭に戻る

© 2026 実践AIマーケティングWEBデザイナー科(短時間) 第01期生 生徒作品