見出し画像

○Daily UI_#007 【Setting】

4月4日・5日に7つ目のお題に挑戦しました。
お題は設定画面をつくるというものでした。
そこで私は、iphoneの壁紙の設定画面をリメイクするような形で作成しました。


・アプリ画面

◾️スクリーンショット

1枚目:既に追加してある壁紙をクリックすることで、ロック画面とホーム画面にそれぞれ設定できる想定です。新しい壁紙はいずれかの青いボタンをクリックすることで追加できる想定です。

2枚目:既に追加してある壁紙を長押しすることで、編集・ホーム画面またはロック画面に追加、削除をすることができる想定です。

3・4枚目:iPhoneの設定アプリ内に実際にある「壁紙」のスクリーンショットです。

5枚目:チェックボックスにチェックを入れて「壁紙を追加する」のボタンを押すことで、「ロック画面」「ホーム画面」のどちらにも壁紙が追加される想定です。

◾️実際の画面

https://www.figma.com/proto/TR0ACBRdlbz46P552KvwHN/%23007?page-id=0%3A1&type=design&node-id=1-2&viewport=323%2C353%2C0.18&t=t36sI37qjB138EgM-1&scaling=scale-down&starting-point-node-id=1%3A2&mode=design

◾️使用した色

(1)ボタンなど(ユーザーがクリックすることができるパーツ)
(2)背景
(3)文字
(4)文字(1・2枚目スクリーンショットの「ロック画面」「ホーム画面」)
(5)「ホーム画面」のアイコン(1・2枚目スクリーンショット)
(6)文字
(5枚目スクリーンショット、ポップアップ内・上の文字)
(7)ポップアップの背景
(5枚目スクリーンショット)


・意識したこと

現在のiPhoneの壁紙機能とは違い、ロック画面とホーム画面で自由に組み替えられるようにしました。
設定のアプリから「壁紙」を開くとワンクリックですぐに壁紙を変更できるようにしました。


・反省点

・見た限りでは分かりにくいですが、実際には色数が増えてしまったことです。
・6つ目のお題から時間を開けてしまったので、時間を気にせずに制作してしまったことです。


前回のDaily UI ↓

この記事が気に入ったらサポートをしてみませんか?