【5つの気づき。】iPadでバナートレース10個やってみた。

Web design
始めにお読みください
  • まず、iPadでの達成であることを強調しておきます。
  • 求人では応募要件に「IllustratorやPhotoshopが扱える人」の記載が多くあります。
  • また、実際の現場を見たことがないので全力のオススメはできない立場です。
  • これを見て、容易にWebデザイナーになりたいからiPad買うという発想はやめましょう。
  • AppleユーザーならMacBook、またはWindowsを買いましょう!

なぜiPadでバナートレースを始めたか?

  • 私がMacBookが届くのを待っていられなかったから
  • Affinity Desiner・photoが半額期間中・買い切り制だったから

Affinity Desiner・Photoって何?

  • Affinity Designer  → Illustrator
  • Affinity photo → Photoshop

という感じです。

ちなみにパソコン版もあります。こちらも買い切り制です。

Affinity Designer – プロフェッショナル向けのグラフィックデザインソフトウェア
Windows、Mac、iPadで使えるAffinity Designerは、デザインの世界に新たな業界標準を打ち立てた、受賞歴のあるベクターグラフィックスソフトウェアです。

〜 バナトレ10個達成して得られた5つのこと 〜


実施期間:2020年 6月24日〜7月1日 の1週間。

1. 〉ソフトの操作になれた。【6/26 : 3日目】

これは4つ目の作品です。

サウスパークに出てくるキャラクターを4体トレースしています。

もちろんとんでもなく時間がかかりました。

なんなら1回目のキャラのトレースは水の泡とかしています。

iPadの複製操作は画面を2本指で長押ししながらアップルペンシルでスライドさせます。

キャラやアイコンはパズルと考えて図形ツールを組み合わせていくという感覚を掴みました。

2. 〉”難しそう” と ”簡単そう” の見分けがついた。【6/29: 6日目】

難易度としては…

文字のみ → ②文字+イラスト → ③文字+写真 です。

私自身のトレース歴と共に順に見ていきます。

① 文字のみ(難易度 ✴︎1) 

とにかくやってみるという気持ちで「これならできるかも…」と選んだバナーです。

初めてやってみた感想は「思ったよりできるじゃん…!」でした。

ノートを書いている時に男性ファッションブランドのクーポンバナーだったことを知りました。初日から実戦の勢いがついてきました。

② 文字+イラスト(難易度 ✴︎✴︎ 2) 

リボン、吹き出し、ロゴがイラストの仲間に入ると思います。

特に吹き出しと緑のロゴの突き出しはペンツールを使っているので難しかったです。

③ 写真+文字(難易度 ✴︎✴︎✴︎ 3) 

Twitter上で、10個中で最も触られたのが、このバナーでした。

私も個人的にこのバナーが好きです。

  • 余白が程よい。
  • 文字と背景もチョミント色。
  • 縦文字で日本の和菓子屋さんらしさを忘れていない。

操作は、初めての画像の切り抜きだったので難しかったです。💦

理解してしまえば「思うより簡単じゃん」となります。

③ 写真+文字 難しかった編(難易度✴︎✴︎✴︎✴︎4)

文字色の白・黒の2色に加えて、装飾にピンク・黄色・紫の3色までくると

写真の選び方にも影響が出てきますね。😅

もちろん色のことは考えもせず、やっとの思いで見つけた”同じ向き”の写真を選んでいます。

黒の服と背景のグレー味の背景は、就・転職というよりは

転職成功体験・セミナーのような雰囲気があります。

③ 写真+文字 難しかった編(難易度✴︎✴︎✴︎✴︎✴︎5)

✔️ 値段の文字「0」一部の色が抜かれて「円」がかぶさっているデザインに大苦戦。

AffinityDesignerは、というかiPadの本体に全然なく、ここが最大の難点です。

大替えフォントがうまく合わさらず結局、メインの数字(5140円)は全てペンツールで書いています。しかし、とても良い経験になりました!

✔️ 写真を波線の形に抜く方法がわからず大苦戦。

この時は、前記の「0」事件で疲れ果てて、マスク機能と筆でごまかしました。笑

この日に学んだことは「魅力的に見えるバナーは凝りに凝っている。

3. 〉流行りのデザインが見えてくる。【6/28 : 5日目】

枠線が人物を強調のために部分的に抜かれている。

って伝わりますかね?

iPadの使い方についての動画を出しているamity_sensei

【上級】Affinity Photoでマスクを使いまくるデザイン【難しいよ!】

動画編集の大川優介さんの「オシャレなサムネの作り方!」

カッコいいサムネイルの作り方

の動画を見て、自分もやってみたいという行動に移した結果が

この日のオリジナルバナーになりました。🙏

4. 〉シチュエーションを考えるようになった。【6/28 : 5日目】

同日の作品の中で、構成と枠組みだけを使った

女性が半袖・白色のオフショル/麦わら系の帽子だったので

背景を夏ぽく海が背景の写真を選びました。

しかし、完成してみると

  • 一体何をテーマにしているんだろう?
  • 何を伝えたいんだろう?

という疑問が浮かび上がってきました。

この日の当初の課題、ツールの実践ができたのでクリアとしています。笑

この日以降、バナーは

✔️ どんな人をターゲットにしていて

✔️ どの情報を受け取って欲しいのか。

考えながらバナートレースをするようになりました。

5. 〉疑問を持つようになる。【07/01 : 7日目】

バナーを作成する前のパッと見からは

インテリアショップではなく不動産だと思っていましたし、

バナー作成中にじっくりみる中で

  • 3Dを使って理想の部屋のイメージを作ってくれること
  • 相談無料
  • 参加者には1万円クーポンの配布

という非常に有益な情報を知りました。

せっかく有益なイベントなのに大事なところを強調しないんだろう?と思いました。

ここから私が思ったのは、

  • お客さんは”相談会”というイベントだけで来るのだろうか?
  • ショップ側はあまりお客さんに来て欲しくないため意図的にこのバナーにしたのか?

という疑問が生まれました。

改善や提案が何かできるわけではないですが、よくないバナーに入ってしまうのかな?と想いました。

しかし【お家の形の写真型抜き】や【アーチ旗の作成】は良いトレース素材だと想いました!

やっておいて良かったこと


今日の気付き・反省の記録。

毎日Twitter更新で、バナーの見本と自分自身が完成させたものを貼り付けて、その日に発見した気づきを素直に書いています。

共に、配色を作る。フォントを調べる作業。をしていますが

  • ベースカラーが3色まで
  • 明度と彩度が揃ってる。
  • フォントは1〜3種類まで

という気づきがありました。

作業は結構めんどくさいです。笑

後から後悔・苦労するより「今苦労しとこう」スタンスです。

これは、これからの

  • バナートレースをする際の良いバナーの見つけ方に繋がる
  • オリジナル作品を作る際の考え方の軸になる

と思いました。

また反省からは、

次の機会こそはスムーズできるようになりたい!

と、つまづいた箇所が含まれているバナーを選んだり、

明日はあのジャンルのバナーやってみようかな。。

と、新しい好奇心や挑戦が生まれやすくなります。

また、私がこうして今「バナートレース10個やってみた」の記事が書けているのも

毎日1個ずつの積み重ねがあってこそだと思います。

”バナートレースやってみたい人” に伝えたいこと。


とにかくやってみてほしい。

私はパソコンを持っていないけど、早くやりたくなってiPadで初めてみたら、

少しだけですが自分自身が見えるデザインの世界が変わってきた気がします。

既に手元にパソコンを持っているなら超リードしていると思いますし、

私のようにiPadしか持ってないとう方も、ソフトやアプリを選ばなければ

文句や駄々を言えないレベルで、素材も勉強法も無料でネットで手に入る時代です。

特に、バナートレースは手軽にできるwebデザインの勉強法だと思います。

私自身も引き続き、30days charangeの達成に繋げるためにもバナートレースをやっていきます!

それと、#1日1サイトレビュー を初めてみました。

もしかしたら、こちらの方がもっと手軽かも?!しれないです。(人による?)

良かったら見てみてください!

最後まで読んでいただきありがとうございました!

お互いwebデザインの勉強がんばっていきましょう♪

コメント

タイトルとURLをコピーしました