Web design

商品バナーの制作実績 | webデザイナーshio【2021年秋】

バナー制作実績【2021年秋】| webデザイナーshioの画像

こんにちは^^

最近デザインした商品バナーが増えてきたので、ここで一度まとめてみました。
2021年秋の制作実績です。

制作実績01【サーモン】

手書きのナチュラルなあしらいや、
背景にテクスチャを使用して、
カフェのような雰囲気を出しました。

制作実績02【バランスリム】

商品パッケージのカラーを使用し、背景をストライプにしたり、両側にパッケージと同じように黄緑のグラデーションのあしらいを足し、スリム感を出しました。

制作実績03【バスチュニック】

湯上がりのゆったりした時間に着用される商品なので、
全体的に優しい柔らかい女性向けのデザインにしました。

写真の切り抜きはふわふわした形に。
手書きイラストを入れてカジュアルに。

タイトルの背景に温泉マークをさりげなく入れて湯上がり感を出してます。

全体の背景はお風呂を連想させるような泡のテクスチャを薄く入れました。

フォントも優しい雰囲気の明朝体を選びました。

shio
shio
こちらの商品は最初に作ったバナーで、サイトで確認したら売り切れになっていたので嬉しかったです♥

制作実績04【おかゆでごはん】

  • パッケージの模様をバナーに散らして商品との統一感を出しました。
  • 背景は薄い黄緑に軽くチェック柄を足してカジュアルな印象を出しました。
  • 商品の中身の画像も右下に入れてあります。敢えて途中で切れる配置にすることで窮屈さを感じさせないようにしました。
  • 上から影をつけて奥行きを出しています。デザインのトレンドでもあります。

制作実績05【コーヒー】

文字が読みやすいように、配置、写真の調整をし、商品パッケージの紫をアクセントカラーとして使いました。

制作実績06【デーツ豆】

あしらいを使っておしゃれに仕上げました。
メイン画像は文字の下をぼかして、読みやすく調整しています。
箇条書きにしてイメージ画像を入れたり、文章を短く分けることで、読んでもらいやすくしました。

制作実績07【カラース豆】

1つ前のバナーと同じ系列の商品のため、同じようにナチュラルな雰囲気になるようにデザインしました。

webサイトのように長いバナー(LP)

情報量が多い商品はこのようにLP(ランディングページ)並みに長いバナーを制作します。

男性用グルーミングミスト
トマトポタージュ

最後に

shio
shio

インスタグラム(@shio_designer)では随時デザインした作品を投稿しています。
ストーリーズは仕事についてなど、自由に投稿しているので
フォローしていただけると嬉しいです♡

ピンタレストのこちらのボードにも掲載中。

また作品が増えてきたら、掲載しようと思います^^*

ポートフォリオ

resumeで作ったポートフォリオの画像 shioのポートフォリオのバナー

関連記事

ブログのバナー(アイキャッチ)も色々考えながらデザインしています。
良かったらあわせて読んでみてください^^

【1年前と比較】webデザイナーの想いを込めたブログバナー(アイキャッチ)のポイントのバナー
【1年前と比較】webデザイナーの想いを込めたブログバナー(アイキャッチ)作りのポイントこんにちは、shioです^^ 私は、ブログのバナー(アイキャッチ)を作ることでデザインの勉強をするようにしているます。なので記事を...

webサイトの制作実績はこちら

【デザイン未経験者の卒業制作】デジタルハリウッドLIGで猫カフェwebサイト制作のバナー
【デジタルハリウッドLIGの卒業制作】デザイン未経験から猫カフェwebサイト制作こんにちは、shioです。 今回は私がデザインスクール(デジタルハリウッド STUDIO by LIG)で作った卒業制作をご紹介し...
制作実績!読み聞かせユニット「えへへほん」 のwebサイトのバナー
【制作実績】読み聞かせユニット「えへへほん」のwebサイトをデザイン読み聞かせユニット「えへへほん 」のwebサイトを作りました! えへへほんのwebサイト webデザイナーとしての担当業務 ...

▼バナーデザイン等のご依頼はこちらからお願いいたします

お問い合わせはこちらからの画像
shio
shio
お気軽にご相談ください^^

それでは、また🐑🧡

制作会社のwebデザイナー
shio
webデザイナーshioのアイコン
未経験からwebデザイナーに転身。 最近はインテリアにハマっています^^ webデザイナーを目指したい方向けに、 【勉強方法|転職活動|ポートフォリオ制作|制作会社で働いてからのこと| webサイト制作 etc... 】について発信しています。 このブログとともにwebデザイナーとして成長していきたいです。よろしくお願いします^^
\ Follow me /
webデザイナーの就職活動で使うポートフォリオのバナー