
デザインをどう学ぶ?バナー勉強会拡大版【イベントレポート㊗️#30】
こんにちは、ひろクリギルドのやんこです。
2024/07/16 (火) に開催した『デザインをどう学ぶ?バナー勉強会拡大版』のレポートをお届けします。
ついに!第30回目を迎えた今回のイベントは、ひろクリギルド恒例(毎月第二・第四火曜日21:30〜開催している)バナー勉強会の拡大版。
そもそもバナートレースとは、バナーのあるべき見せ方とは、という概念の部分からしっかりじっくり学べるイベントとなりました。
講師紹介
今回の講師は、毎月第二・第四火曜日にオンラインでバナー勉強会講師をされているお馴染みのおふたりでした。

マスべサチ(ひろクリギルド代表 / デザイナー)𝕏
ひろクリギルド代表としてクリエイターの学びと交流に尽力しつつ、フリーランスデザイナーとして活動中。また、デジハリ広島や穴吹専門学校で講師業も行う。去年のAdobeMAXではオープンブースセッションに登壇。この春、Adobe Community Expertに就任。
Tantan(ひろクリギルドスタッフ / デザイナー)𝕏
グラフィックデザイナーを経て、現在はWebデザイナーとして活動中。Web制作会社フォノグラムに所属しつつ、 デジハリ広島の講師もされています。2022年にはAdobeMAXにXD関連のセッションに登壇。
セミナーの内容
前半セッション (マスベ:バナートレースについて)
「バナートレースって意味あるの?」
という投げかけから始まったマスべさんのセッションでは、
“バナートレースは、デザインにおける「筋トレ」である”という考えのもと、デザインの肝となる【相対的感覚】を養う方法について細かく教わりました。
まずはフォントのタイプや【相対的フォント感】について。
トレースする時に、似たフォントを探すのって本当に大変ですよね。でも、フォントのタイプがわかっていたらかなり探しやすくなる!そんな内容を “ストイックマスべ” ならではの切り口からお話しいただきました。

トレースも、実際バナー制作する時にも役に立ちます。
フォントのタイプと「相対的フォント感」についてマスべさんが紹介された記事を参考までに貼っておきます👇🏻
その後、バナートレースは完全完コピの必要はないが、「完コピすべき部分」と「完コピが不要な部分」があるという考えをもとに、完コピすることで必然的に培われていくデザイン筋肉についてのお話へと話は展開していきました。
完コピが必要な部分は、ドロップシャドウなどの効果(エフェクト)のような「細かな処理」部分。曖昧に眺めるのではなく、しっかり観察することがポイントです。

有料セミナーだったためクリアにお見せできないことが残念でならぬ・・ぅぅ!!
終始 “ストイックマスべ” 炸裂の内容の濃さ。論理的かつわかりやすく描かれた説明スライドに参加者一同、目が釘付けでした👀。このイベントに参加できなかった方はぜひ有料会員登録でアーカイブ動画をご覧ください!
また、完コピする必要がない部分とは、日々のデザイン筋トレで身につけた「相対的デザイン力」で対応していきます。例えば、フォント・イラストや写真素材・色などがそれに該当します。
※ ちなみに、マスべさんのセッションでは、簡単なトレースの実演もありましたが、途中でタイムアウトとなったため別撮りした動画が参加者のみなさんには配布されています。2週間限定のアーカイブとなっておりますので、ぜひお早めにご覧ください。
後半セッション (Tantan:バナー制作について)
さてさて、後半はTantanのセッションでした。Tantanといえば、私が転職してデザイン畑にやってきた右も左もわからぬ頃から、初学者向けのデザイン勉強会を積極的に開いていただき、「お世話になった」という軽い言葉では済まされないくらいお世話になった(←結局このワードしか出てこない語彙力の無さよ😂w)すーんばらしいデザイナーさんです💪🏻
そんなTantanのセッションは、以下の流れで展開されました。
バナーの内容について(バナー制作時の思考の流れを解説)
デザインについて(バナー制作実演)
まず「バナーの内容について」のセッションでは、日頃Tantanがバナー作成時に無意識に行っている思考回路を言語化したチャートを見ながらの説明となりました。

これだけの思考の流れを言語化できる上に、これだけ見やすくデザインできるとは・・
こ・・これぞベテランデザイナー!!
この思考チャート表は、すでにある程度デザインを習得している人ならは深く納得(同意)できる内容でしたが、デザインの勉強歴がまだまだ浅い人だと、ピンとこない部分もありそうだと感じました。逆に、デザインを学びながら時々見返せば、かなり強力な武器となってくれそうな資料です。
この資料はアンケート特典としてプレゼントされるシートだったので、本セミナーにご参加いただいた方はぜひ7月中にアンケートにお答えして資料を手に入れていただきたい!!

斜に構えてバナーを見てみるのも手法のひとつ。
Tantanセッション後半は、実際のバナー制作をAdobe Illustratorを使って実演。アートボードに参考となるバナーを散りばめ、バナーに入れ込む写真とテキストを置いたら制作の始まりです。


土台ができたら「遊ぶ」というのもTantan先生がよくおっしゃるポイント。
Tantanのバナー制作で、目から鱗だったこと❶
バナー下部の丸みがかった帯。クラフト素材になっていて「素材サイトからダウンロードしたテクスチャだろうな」と思っていたのですが、Illustrator内で作ったものでした。じ…時短!便利!!
最近、素材サイトに頼りすぎている自分を恥じた瞬間でした…

Tantanのバナー制作で、目から鱗だったこと❷
素材写真で切れている部分、私ならPhotoshopに持っていって生成拡張するところですが、Tantanはちょちょいとパスで書き足しダンボールを完成させました。普段のバナー勉強会でも、初学者の皆さんがIllustratorやPhotoshopのアピアランスを駆使して作ろうとする部分をTantanはパスでちょちょいと操作して作ってみせることが多々あります。
「作り方を調べるよりも手で描いた方が早い時があるから」
その選択肢を瞬時に判断し対応できるようになれたら、制作時間的にも体力的にもかなり助かると感じました!

これにも配色と立体の箱を描く基礎的な画力は最低限必要。
まとめ
90分に渡る今回のセミナーでは、バナーの概念やトレース方法、制作中の思考回路など、バナーに関する多くの知識が学べました。
「バナートレースって意味あるの?」と聞かれると、今なら「絶対に意味がある!」と答えられるし、バナーだけではなくデザイン全般の筋トレにもなるから、迷ってないでどんどんやった方が良いよ!とも力強くオススメできます。みなさんにも、自分なりのデザイン勉強のやり方を見つけるヒントになったのではないでしょうか。
また、今回学んだ知識に関しては、90分でまとめて習得するにはスケールが大きすぎた感もありました。そういった意味でも、ひろクリギルドで月2回開催しているバナー勉強会は初学者の方にとって継続して確実に力をつける強い味方となり得ると痛感しました。
メンバー登録いただけると、有料・無料メンバー関わらず全員が受講できますので、ぜひこの機会にひろクリギルドへのメンバー登録と、バナー勉強会参加をご検討ください。
ひろクリギルドメンバー登録はこちらから
※「ひろしまクリエイターズギルド」というコミュニティ名ではございますが、今では全国から420名を超えるメンバーさんに在籍いただいております。お気軽にご参加くださいませ。
月2回のバナー勉強会は、メンバー登録後、Slackの「バナー勉強会チャンネル」からご確認いただけます。このクオリティの勉強会が、なぜ無料でできるの?と不思議になるほど超有料級の内容ですのでオススメです🉐
セミナー参加者様のご感想
イベントアンケートでの反応を一部ご紹介します。
バナートレース苦手です〜の質問をしました。「 甘ったれてるんじゃないよ!」と怒られるかと思いましたが、苦手ならオリジナルバナーの一部だけを他のバナーのトレースにしてみたら?というアドバイスが目から鱗でした。 完コピしないといけないと思っていたので、パーツだけでいい〜とか、提供素材はトレースしなくていい〜というやり方が参考になりました。
トレースでの明確な目的を持つこと、バナー制作時の細かい思考の流れを拝見できて、頭を整理してトレースや制作を進めるヒントを得られたと感じました。
バナーを作っていざ完成してもサイズ感に違和感がある…失敗することがよくあったので、ブラウザのスクショを元に作る方法が知れて勉強になりました!
画像の探し方やトレースの仕方、わかりやすかったです。また、句読点や「」の大きさ、詰め等は考えたことがありませんでした。参考になりました。バナー制作で逆の発想から戻って着地するということもあるんですね。勉強になりました。チャレンジしてみます。
イベント全体へのご感想もたくさんいただきました。
講師のおふたり、落ち着いててユーモアもあって楽しい講座でした!ひろクリギルドは運営さん同士の仲良し感、掛け合いが楽しいです🎵
タイムマネジメントが完璧でした。質疑応答もスムーズで、フォロー動画やお土産もあって大変ありがたかったです。
参加者アンケートを拝読すると、今回の成功も失敗も、丸ごと次へと活かしたい!と、ますますやる気になれます。みなさまのありがたいご感想ありがとうございました。
次回イベントのお知らせ
次回のイベントはSHIFTBRAINのアートディレクターである藤吉さんをお招きして『3社の事例から学ぶ ブランディング勉強会【ひろクリギルド#31】』です!みさとと。はどのようにして生まれたか、などをじっくりお聞きしたいです。
夏はひろクリギルドのメンバー限定イベントも満載!
毎月第二・第四火曜日21:30〜23:00『バナー勉強会(初級・中級)』
月ichi企画『育児も家事も仕事もぜ〜んぶしたくて工夫してたこと』(7月担当つむ)
月ichi企画『スタンドCOCOKO』(8月担当マスべ・よーこ・やんこ)
メンバー限定イベントはSlackにてご案内いたします。ご興味がある方はぜひメンバー登録をご検討ください。
さいごに
ひろしまクリエイターズギルドでは、今後も【交流】と【学び】に繋がるイベントを開催していきます。
今後の予定は、公式サイトやX(旧Twitter)アカウントにてお知らせしております。
ぜひチェックしてみてください。
暑い日が続きますが、夏好きの私としてはずっと今の熱気を吸っときたい!!!
みなさん、ともにこの暑さを楽しみましょう〜。やんこでした!