![見出し画像](https://assets.st-note.com/production/uploads/images/163630605/rectangle_large_type_2_07f8dcad70d1d4e7559f3d5515e15d13.png?width=1200)
vol.10 WEBデザイン勉強奮起 -デザインのドリル編-
こんばんは!
今日も一日お疲れ様です。
本日はフリーマーケットのチラシデザインです。
色数をしぼった場合の見せ方を学んでいきます!
コチラがトレース画像です。
![](https://assets.st-note.com/img/1733191645-kgFo1b3UeRlKi9uxyzAYP8OC.png?width=1200)
使用するカラーを3色!
イラストも全て同じ3色に絞ることで、一体感のあるデザインになりますね!
1.目標時間
コチラの目標時間は、45分!
対して私は1時間!!
イラストの配置の微調整と、意外と苦戦したのが「レモンの形のような白い部分」
ただただ練習あるのみですね…。
2.わたしの解釈
素材を手書き感のあるイラストにすることで、親しみやすい印象になる
「黄色」と「紫」が、補色関係にあるため、互いの色を引き立て合いそれぞれの色の特色を高めている
真ん中に重心を置き、要素を周りに配置することで全体のバランスをとっている
黄色がメインとなり、明るい雰囲気になっている
3.苦戦したところ
-白い背景部分-
![](https://assets.st-note.com/img/1733193328-Wqa0MrTpleDAHYOgd6yjvc4Q.png)
見本の画像に合わせて、「ペンツール」を使用して作成したのですが...
・上手く曲線が作れない
・背景が白くならない
と頭を悩ませました。
曲線が作れない
まるっこいフォルムだったので、「曲線ペンツール」を使用したことがまず間違いでした!
そして「ペンツール」をうまく扱えていなかったからだー!!
始点をきめたら、次の点を打つときに
「クリックしたままスクロールする」
この部分が抜けていたがために、思い描いた丸みが作れず苦戦していました…。
![](https://assets.st-note.com/img/1733203537-lRuSUfkdprB8ZCWjTgJPwD70.png?width=1200)
おおまかに形ができれば、最後に微調整してトレースの完成!
カラーの設定ができない
こちらの原因は、
「ペンツール」にしたときに、画面左上部分の設定が「パス」になっていたせいでした!
![](https://assets.st-note.com/img/1733194489-1UBqTMGCwfs2S6DoN4FvWZgk.png)
「シェイプ」に変更したことで、しっかりカラーの設定ができるようになりました!
こんなちょっとしたことでも苦戦しているから時間がかかるんですよね…。
今回苦戦したことしっかりインプットして、次にまた同じ苦戦の仕方をしないように気をつけます!!
4.さいごに
限られた色数の中では、しっかり色の相性を考えることが必要だなと思いました。
見本のような「補色関係」にあることや、vol.8のデザインのような「同系色」を使用するとまとまりがよくなるんだなと思いました!
配色のセンスがなくても、デザインの内容にあわせて、色の組み合わせ方を考えると配色をしやすくなりそうですね!!
直観で選ばず、しっかり色の関係性を考えて選んでみようと思います。
そして、自分では気が付けなかったけれど今回のポイントとしては、
・明度に差をつける
・文字情報には明度が低い色を使用するとよい
・余白を活かす
・3色になっても考え方は一緒
です!
言われてみると、なるほど!となります。
「明度」に注目して考えてなかった!!
直観だけでなく、そういったところを意識するといいんですね!
自分の見方だけでは、気が付けないことを知ることができるのは大事なことだ!
ではでは、今回も最後まで読んでくださりありがとうございました!
また明日~!