バナーデザインお題10個【ポートフォリオ掲載OK】作成の練習にも◎

当ページのリンクには広告が含まれています。

ポートフォリオに載せるバナー作品がない…

バナーの練習したいけどお題が思い浮かばない。

今日は駆け出しWebデザイナーさんに向けて「バナーデザインのお題」を10個、提案します☺️

ハッシュタグや引用は不要なので、気軽に使ってもらえたら嬉しいです。

実績がなくてポートフォリオに載せる作品がないのに、ポートフォリオがないと案件に応募できない…

私もポートフォリオに載せるオリジナルの作品がなくて、困った経験があります💦

お題を考えるのも一手間ですのでサクッと当記事を参考に、デザイン作成して案件にどんどんチャレンジしてくださいね◎

この記事を書いたひと

Webデザイナー × 在宅ワーク ×アラサーまま

フリー+業務委託2社契約中

Webデザイナー歴3年

多忙なままがWebデザインで失敗しないコツ

いまから始めても最短で稼ぐコツを発信

Webデザインのスキルでお悩みのままさん、SHElikesでガツっと学んで案件獲得オススメです♡

SHElikesの入会は今がお得✨

キャンペーン内容:

  • 初月月謝無料(最大16,280円OFF)+入会金1万円OFF=26,280円引き…!
  • MacBookPro や iPad&ApplePencil が当たるチャンス
  • 抽選で16円が当たる(入会金が無料!)

2024年2月29日(水)まで無料体験レッスンに参加するだけで、
抽選で豪華商品が当たります!

さらに、その場で入会を決めた方は最大26,280円割引の特典もありますよ◎

\ 無料体験レッスンの日程をみてみる /

無料体験レッスンの予約は1分で完了します◎

目次

バナーお題の注意事項

  • 引用やハッシュタグは不要ですが、著作権は「まめ」にあります。
    コンセプトやキャッチコピーをデザイン作成者が作ったと勘違いさせてしまうような表現はおやめください。
  • 使用する画像はフリー素材をお使いください。
    フリー素材以外の画像を無断で使用すると、著作権侵害にあたります。

節度を守ってご活用いただくようお願いいたします☺️

バナーお題を選ぶポイント

お題を選ぶポイント
  • 興味のある業界(携わりたいジャンルなど)
  • 得意なジャンル(「私こういうデザイン得意です!」とアピールするため)
  • 苦手なジャンル(練習のため)

クラウドソーシングに提案・応募する際

依頼内容と似ているジャンル・雰囲気のサンプルデザインを提示できると、案件獲得の確率がグッとあがります。

これからどんなお仕事をしたいか想像して、選ぶのもオススメです◎

バナー作成の事前準備

バナーサイズ

バナーサイズは各お題に記載していますが、他サイズでも問題ありません。

バナーサイズの例
  • 300 × 250px
  • 336 × 280px
  • 468 × 60px
  • 728 × 90px
  • 320 × 50px
  • 320 × 100px

すべて 横 × 縦 のサイズです

例えば…同じお題でもリサイズしてみると勉強+いろんなサイズのバナーが得意!とアピールできていいですよ☺️

↑は「思わずクリックしたくなる バナーデザインのきほん」に記載されているデザインを練習したものです💡

あわせて読みたい

フリー素材

バナーに使用する画像は、フリー素材サイトからダウンロードしてお使いください。

使用する際は各サイトの利用規約にそったご使用をお願いいたします。

オススメのフリー素材サイト

写真ACは無料会員だと検索やダウンロードに制限があるけど、素材数も多く、素材の加工OKで使い勝手も良いですよ◎

写真素材ダウンロードサイト【写真AC】※無料会員登録はこちら

バナーを作る際のポイント

バナーを作る際は、以下のポイントに気をつけて作業を始めることをオススメします。

バナーを作る際のポイント
  • コンセプトを考えてから作る
  • 作業時間をはかる
  • 工夫したところ・苦戦したところをメモしておく

クライアントがポートフォリオを見る際、ただバナーが並んでいるよりも…

  • このバナーはコンセプトが〇〇だからこういうデザインにしたんだ!
  • 制作時間がこのくらいなら納期を確実に守ってもらえそう!
  • キャッチコピーを目立たせるためにこういう工夫をしているのか!
  • 苦戦したところ(振り返り)も書かれていて、これからの成長も期待できる!

など、デザインへの姿勢もアピールすることができます◎

バナーお題一覧

お待たせしました!本題のバナーお題一覧です。

以下の10個から好きなお題をお選びください☺️

↓お題をタップすると詳細にとびます🕊️

*お題ごとに画像を添付していますが、ブログ装飾のためバナーのイメージ画像ではありません。

例:1. 保護猫カフェのオープン告知

私が駆け出しの頃にポートフォリオに掲載していたオリジナルバナーのお題です☺️

依頼内容

バナー設置場所:地域の情報サイト
ターゲット:30代の女性
イメージ:ベージュをベースに温かみのあるナチュラルな雰囲気
バナーサイズ:336×280(レクタングル)

入れる要素

テキスト:
保護猫カフェオープン
4月7日(日)10:00←英語表記でもOK
夢丘駅徒歩1分
20匹以上のかわいい猫がお出迎えします
新しい家族に会いにきてね


画像:
室内にいる猫の写真を使用してください

私が実際に掲載した画像と紹介文↓

コンセプトは「ほっこり」
保護猫カフェは営利目的と猫の支援を両立している場所ということで
来てくれる方に寄り添うようなデザインを心がけました。
制作時間:2時間
制作ツール:Illustrator・Photoshop

私は保護猫活動に携わりたかったので、動物関係のバナー・ポスターをいくつか作りました🐈♡

2. 占いのオンラインスクールの生徒募集

依頼内容

バナー設置場所:占いブログのサイト
ターゲット:20〜30代の女性
イメージ:白を基調に紫やピンクを使用。怪しい感じはNG・爽やかな印象。
バナーサイズ:336×280(レクタングル)

入れる要素

テキスト:

  • 占いオンラインスクール MyFortune(サービス名)
  • 好きを副業に
  • 基礎から実践まで独立するスキルを習得
  • 無料体験レッスンはこちら


画像:
女性が微笑んでいる写真を使用してください。

3. 結婚相談所のオンライン相談会申込

依頼内容

バナー設置場所:婚活サイト
ターゲット:25〜35才の女性
イメージ:ピンクと白をベースにエレガントなイメージ。フォントは明朝体や筆記体など綺麗めな感じ。
バナーサイズ:336×280(レクタングル)

入れる要素

テキスト:
Online Bridal House(サービス名)
婚活をもっと身近に
オンライン相談会はこちら
画像:ウエディングドレスを着た女性の写真を使用してください

4. 英会話塾:短期講習の告知

依頼内容

バナー設置場所:公式サイト
ターゲット:25〜40才の女性(小学生の子どもを育てるお母さん)
イメージ:楽しそう+親しみやすい雰囲気・カラフル・
バナーサイズ:336×280(レクタングル)

入れる要素

テキスト:
「もっと英語で話したい」
短期集中レッスン
3月12日(火)〜受付開始
各レッスン8名まで
詳細はこちら
画像:
小学生の子ども(男女)が笑ってる写真を使用してください

5. ネイルサロン:定額コースキャンペーン

依頼内容

バナー設置場所:公式サイト
ターゲット:20〜30代の女性
イメージ:シンプル・エレガントでサービス内容がハッキリと伝わるように。
バナーサイズ:336×280(レクタングル)

入れる要素

テキスト:
ジェルネイル定額コースキャンペーン
シンプル・ハーフアート・フルアート
+ストーンつけ放題(キャンペーン内容)
サンプルを見てみる
画像:ジェルネイルをしている指先、または施術中の写真を使用してください

6. トリートメントの新商品PR

依頼内容

バナー設置場所:公式サイト
ターゲット:20〜30代の女性
イメージ:白・緑・ベージュを使用。清潔感のある雰囲気
バナーサイズ:336×280(レクタングル)

入れる要素

テキスト:
moon treatment(サービス名)
あなたの髪は今日から変わる
サンプルプレゼント中
応募はこちら
画像:
髪の毛が綺麗で長い女性の写真を使用してください

7. 花屋:母の日のプレゼント

依頼内容

バナー設置場所:公式サイト
ターゲット:20〜30代の女性
イメージ:白・緑を使用して写真が目立つように。大人シンプルな印象。
バナーサイズ:336×280(レクタングル)

入れる要素

テキスト:
Mother’s Day
ありがとうを花束に込めて
5月12日(日)
hanaoka flower(店名)
画像:
カーネーションの花束の写真を使用してください

8. 脱毛サロン:お友だち紹介キャンペーン

依頼内容

バナー設置場所:公式サイト
ターゲット:20代の女性
イメージ:ピンクを基調にかわいい印象(子どもっぽい印象はNG)
バナーサイズ:336×280(レクタングル)

入れる要素

テキスト:
お友だち紹介キャンペーン
あなたもお友だちも20,000円キャッシュバック
詳細をみてみる
画像:
笑顔の女性(2人)の写真を使用してください

9. パスタ専門店:期間限定メニューの告知

依頼内容

バナー設置場所:公式サイト
ターゲット:25〜35才のカップル
イメージ:パスタの写真を大きく・秋らしいあしらいをつけて。
バナーサイズ:336×280(レクタングル)

入れる要素

テキスト:
秋の大感謝祭
たっぷりトマトのパスタ
席を予約する
画像:
トマトパスタの写真を使用してください

10 . お弁当屋さん:スタッフ求人

依頼内容

バナー設置場所:公式サイト
ターゲット:30〜40代の女性
イメージ:親しみやすい・楽しそうな雰囲気
バナーサイズ:336×280(レクタングル)

入れる要素

テキスト:
お弁当のテイクアウト専門店:おてさげ
調理スタッフ募集中
土日休みOK
週2・5時間〜
まかない有り
画像:
エプロンをしている女性の写真を使用してください

バナー作成後のチェック項目

バナー作成後に最低限確認したい内容は以下のとおりです。

  • 必要なテキスト・画像を正確にすべて入れている
  • 色覚チェックをしている
  • カラーモードはRGBカラーを選択している
  • サイズはpxを選択している

デザインのチェック項目(目線の流れや適切なあしらいなど)はたくさんありますが、まずはここさえ間違えなければ問題ありません◎

駆け出しの頃、SNSの画像作成依頼だったのにCMYKで作成してしまい、納品直前に急いですべて修正したことも💦

色覚チェックとは

色の見え方は人によって個人差があります。

  • P型(1型)色覚:赤を感じとりにくく、赤〜緑の区別がつきにくい
  • D型(2型)色覚:緑を感じとりにくく、赤〜緑の区別がつきにくい

日本人男性の5%(20人に1人)、女性の0.2%程度は、色が見えにくい「色覚特性」を持っています。
*参照:色彩検定公式サイト

Illustrator、Photoshopには簡素的な色覚チェックができる機能があるので、確認しましょう!

表示→構成設定→P型(1型)色覚 or D型(2型)色覚を選択

どちらのツールも操作は同じです。

ポートフォリオサイトがない方はいま作る!

バナーがひとつでも作れたら、ポートフォリオサイトに載せましょう🌸

「ポートフォリオサイトはバナーが10個できてから作ろう」は危ない考えだと思っています…!

作ったものを元にどんどん営業していく」が 稼げる最短距離ですよ。

ここだけの話…🤫

ポートフォリオがなくてもサンプル画像1つあれば案件応募・獲得できます!←私の経験談🙋
*ポートフォリオ必至の場合を除く

forrio ならコーディング知識ゼロ、ドメイン取得やサーバー契約も不要、1分で作成→公開までできます◎

forrioで作ったポートフォリオのサンプル

ポートフォリオサイトを作ることが目的ではなく、仕事を獲得するための手段なことをお忘れなくです。

作ったら公開→営業→デザインを追加→営業…このループを心掛けると「ずっと勉強で辛い…モチベ下がる…;;」を避けることが可能です!

Canvaで限界を感じている方へ

ここまでバナーお題について書いてきましたが、

Canvaでバナー練習してるけど…仕事にできるかな?

と不安に思っている方、多いのではないでしょうか。

正直、Webデザイナーとして稼ぎ続けていきたいならCanvaでは限界があると感じています。

なぜ、Canvaでは限界があるの?

理由は、Canvaは誰でも使えるデザインツールとして開発されているため、細かい調整はできません。

例えば…

  • 本格的な画像加工/合成ができない
  • 文字間の細かい調整機能がない
  • クリッピングマスク機能がない

模写やトレースをしたことがある方は痛感しているのではないでしょうか。

実際に仕事でCanvaは使わない?

私自身、Canvaを使う仕事を受けることもあります◎

Canvaを使ったInstagramのテンプレート制作は、Web系に慣れていないクライアントに納品する際に最適だと思っています。

しかし、ココナラやランサーズの公開依頼では「Canva不可」の案件も増えてきて、逆に「Adobe(Photoshop・Illustrator)で制作」を指定されているクライアントが多い印象です。

クラウドソーシングでCanvaのテンプレート制作の案件は応募者が多く、争奪戦になっています。

Canvaじゃないなら何を使うの?

それは「Adobe(アドビ)」です。

Photoshop(フォトショップ)やIllustrator(イラストレーター)はAdobeのツールです💡

世界中のWebデザイナー、デザイン会社が日常業務においてメインのデザインソフトとして採用しています。

私もAdobeがないと仕事ができません!

WebデザイナーでPhotoshopやIllustratorが使えて損することはありません。

けど…Adobeって月6,000円超えだし高いな…

って方は、絶対に公式サイトから契約するのはちょっと待ってください。

以下の方法で契約すると年間3万円以上も安くなるので、Adobe契約を悩んでいる方は必ず読まないと後悔します。

収入を増やす(単価を上げていく)ためには、細部までこだわるデザインが求められますし、クライアントも対価に見合ったデザインを納品できなければ、仕事は減っていきます。

これからWebデザイナーとして稼いでいきたいなら、早めにPhotoshopやIllustratorを使い始めるのがオススメです◎

さいごに

オリジナルバナーの制作は、模写やトレースとは全くの別物です。

素材集め・配置・グルーピング・配色・フォント…

すべて自分で考えながら作業するので、驚くほど時間がかかると思います。

私の人生初バナーは8時間かかりましたよ💦

バナー上達の道は実践あるのみ!

何個か作ってみたら案件にチャレンジして実践でスキルを身につけていくのが近道です◎

「お題」活用してスキルアップしてくださいね☺️♡

いまだけ限定!SHElikes の無料体験レッスンのキャンペーンはこちら

SHElikes は累計参加者数7万人突破の女性人気No.1スクール♡

無料体験レッスンに参加するだけで…

  • 初月月謝無料+入会金1万円OFF=26,280円お得!
  • MacBookPro や iPad&ApplePencil が当たる
  • 抽選で入会金が無料になる

2024年2月29日(水)まで無料体験レッスンに参加するだけで、抽選で豪華商品が当たります!

\ 無料体験レッスンの日程をみてみる /

無料体験レッスンの予約は1分で完了します◎

目次