おはよう！
デザイナーとして駆け出して2年目の管理人みっぽこです。
アプリのUIデザインのスキルアップのために始めたUIトレース。
今回は第2弾、セブンイレブン編です！
前回の記事はこちら▼
今回はハードルを下げて、バナーの配置が多めの画面を選んでみました！
シンプルな画面だけど、見れば見るほどなるほどな工夫がいっぱい！
それでは、セブンイレブンのUIトレースに挑戦！
いざ実践！セブンイレブンのUIトレース
今回のトレースで勉強になったのは、色の使い方。
バナーが多い場面だからこそ、華やかな画像の邪魔にならないようにグレーが多く使われていました。
会員コード、フッターの選択箇所にのみブランドカラーが使用されていて、色を多用していないからこそ、重要な部分が際立つ！
ヘッダーの下にブランドのメインカラーのグラデーションが適用された細いバーがあるんですが、これだけでもセブンイレブンというブランドの雰囲気を出せるので、いいアクセントになっていると思いました。
まとめ
何を見せたいかによって色の使い方は非常に大事！
グレーの濃度によってどのように情報の優先度を分けているのかを見るのも勉強になりそうだなと思いました。
それではまた次回！
コメント