DailyUI #084 バッジ

1.DailyUI#084のお題

84日目のお題は「バッジ」。
ワークアウトアプリのバッジ画面を想定して制作しました。
グラフィック寄りのお題なのでイラレの練習として、個人的に良いなと思ったマネーフォワードのバッジデザインを参照しました。

2.ざっくりワイヤー

ざっくりワイヤー

3.制作したデザイン

制作したデザイン

「体幹初級」をすっ飛ばして「体幹中級」を獲得していることはスルーしてください…

4.デザインする上で考えたこと

バッジはユーザーの努力に応じて獲得できるものなので、獲得できた時に思わず嬉しくなるようなキラキラ感や立体感のあるデザインを参考にしました。
初級よりも中級、上級になるにつれてキラキラした装飾が増えて豪華に見えるという想定です。

5.反省点

級が変わるごとに色が銅→銀→金のように色が変わる方がステップアップした実感が湧いて嬉しいかもと思いました。

6.おわりに

今回はイラレの練習として既存のデザインを再現しました。立体感を持たせるためにいくつも影をつけていることが学べて面白かったです。キラキラの装飾を入れると一気にバッジ感が増すなと思いました。