【UIアウトプット】DailyUI #064_User Selection

【UIアウトプット】DailyUI #064_User Selection

シルスプのブログにようこそ

64目の課題は、User Selection

１．課題

課題の説明文には

ユーザープロファイルの選択を表すモーダル、ページ、トグル、
またはその他の要素を作成してください。

？？？？　なんのことかさっぱりわかりません。

AIに聞いてようやく理解しました。
要するに
アプリかサービスの入口で、誰が利用するか

・分かりやすく（どの人かわかるアイコンや名前）
・早く（ワンタップで切り替え）
・間違えにくく（誤操作防止の配置）

という3つを満たす画面を作るということです。
な～るほど。そういうことか。

切り替えるには、下記の３通りがあります。
・モーダル型（ポップアップで選択）
アプリ起動時や切り替え時に、中央にカード風のモーダルが出る。
丸いプロフィールアイコン＋ユーザー名を縦リスト表示。

・ページ型（独立ページで管理）
「プロフィール管理」ページとして、ユーザーアイコンをグリッド表示。

・トグル型（スイッチのように切替）
画面上部（ヘッダー）にドロップダウン形式で「現在のユーザー」を表示。
タップすると小さなメニューで他のユーザーに切替可能。

わかりやすいので、動画配信サービスを家族みんなで使える場面を想定します。
家族は、大人と子どもが使うことを想定します。

　・プロフィールカードを大きめに配置
　・ワンタップで切り替え
　・キッズ用の工夫

をしようと思います。

DailyUI #064_User Selection

・アイコン一覧をグリッド表示
・子ども用キャラクターはカラフルで楽しい絵柄、
大人用はちょっと凝ったキャラクターにしました　www
・子どもと大人がわかるようにアイコンを変えました

課題は、User Selectionでした。
なんの画面にいるかわかるようにして、
アイコンは大きめにしました。

キャラクターは、ちょっとやりすぎたかなぁ
でも楽しいしいいよね。
画像を提供いただきました方に感謝します

では、またねぇ～