見出し画像

はじめてのUIデザイン #BONO_UI

UIデザイナーに転職したく、今学んでいることをまとめていきます。
今日は、BONOの「はじめてのUIデザイン」コースの”連絡帳のUIデザイン”
作りました。

◆作ったもの


自分が作ったのは7画面です。
完成まで大体、2時間ほどかかりました。

  1. 連絡先一覧

  2. 新規連絡先_完了前

  3. 新規連絡先_完了後

  4. 連絡先追加後

  5. プロフィール画面

  6. プロフィール編集画面_完了前

  7. プロフィール編集画面_完了後

色味は”黒”をベースにして強調したい色は青を採用
参考アプリ:iOSの連絡帳アプリ、LINE

◆作って学んだこと

  • ナビゲーションの役割は”ユーザーが今どこにいるかをわかるようにする道標”

    • ヘッダーは今どこのページかわかるようにページの役割や目的がわかるような名前をつけてる

  • オブジェクト重視=コンテンツ重視で作ること

  • アイコンを多用してどうゆう状態か視覚的に伝えること

    • 例えば、メッセージ画面を選択中は”アイコンを塗りつぶし状態”にし、色で差分をつける

メッセージのページを選択中
連絡先のページを選択中

全体

いいなと思ったら応援しよう!