ワーママ Webデザイナーを目指す デザインドリルやってみた07

07【デザイントレース】美容クリニックのバナー

Lesson2に進みました
今回は7回目のバナー
ここでは、色の選び方を学びました

見本はこちら

トレースしたものは、こちら

目標時間:30分
実際の作業時間:90分

○このデザインを見て感じたこと
・中央揃えになっているので、文字がみやすい
・清潔感のある青色で統一感が出ている
・強調したい部分が大きく太くなっているので分かりやすい
・バナー自体はシンプルなものにしてあり、興味がある方はクリックをして詳しく見れるよう誘導してある

○トレースする上で工夫した点
・見本を隣に置いて位置など確認しながら進めていったこと
・文字カラーは、カラーピッカーで選択したこと
・時間を意識したこと
・囲みのデザインを調べて参考にしたこと
こちらのブログを参考にさせていただきました(https://hatsuweb.design/exercise07/)
・同じフォントを持っていなかったので、マッチフォントから似ているものを探したこと

○難しかった点
・文字の間隔を見本と同じにすること
・角を凹ませるデザインの方法
・記載のあるフォントを選択していたが、同じようにならなかった。

【今回の学び】
①なぜ青を使っているのか?
→色はそれぞれの”印象”を持っているので、「デザインを見た人にどんなイメージを与えたいか」によって色選びをすることが大切
「青」:信頼感、誠実な印象
「オレンジ」:明るく親しみやすい印象
「緑」:ナチュラルな印象で、安心感を与える。

青ではなく、オレンジや緑をメインにしてデザインするだけでガラッと印象が変わることも学べました

オレンジ色で統一されたデザインも挑戦してみました

見本はコチラ

トレースはコチラ

「もう肌のことで」というカーブが難しかったです。
テキストの円弧を利用して行ったが、なかなか苦戦、、、

詳しくは、コチラの後のアイコンの色の変更は、下記サイトを参考にしました参考にしたサイト
https://kmy.website/svg-font-color-change/#google_vignette

オレンジにする狙いとしては、上記記載の印象を与えるため「気軽に相談い乗ってくれそう」と親近感を抱いてもらう狙いが持てるのだそう

自分でデザインする際は、色も意識して行っていきたいと感じました‼️

 

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