UXのためのUIデザイン
- 5. UXとUIの境界
UX = ユーザー体験
語られる言葉は、体験です。
UI = ユーザーインターフェイス
語られる言葉は、インタラクションであり、ビジュアルであり、アーキテクチャです。
UX UI
UX=UIではありません。ユーザーがUIを通して体験することがUXです。
UIで語られる言葉がどんなに素晴らしくても、それがすなわちUXを実現しているとは言えません。
UIデザインの理由
デザインには理由が必要です。
UXの実現をUIの目的とした場合、『デザインの理由=UXを実現していること』です。
しかし、体験をUIの言葉で語るには限界があります。そのため、UXとUIをつなぐ言葉が必要になります。
5
- 11. 1. 挙げる
言葉の粒度を意識しましょう。
e.g. 友達のオススメの場所を確認するアプリ
レコメンドされている FBにアプリを 新規のレコメンドに レコメンド
レストランの 場所を見る。 登録する。 場所の名前を されている場所に
ギャラリーの中の
予約をする。 場所を検索する。 新規のレコメンドに
入れる。 写真を選択する。 チェックインする。
写真を撮る。
コメントを
つける。
場所のカテゴリー
既存のレコメンドに 既存のレコメンドに レコメンドを
を選ぶ。
自分の写真を ログアウトする。 撮った写真を コメントを カテゴリーで レコメンドの詳細を
(撮影時) 新規にレコメンドを
追加する。 確認する。 つける。 フィルターする。 見る。
投稿する。
(閲覧時)
11
- 13. 2. 2つに分ける
2つの分類に入らないアクションは不要なので、思い切って捨てましょう。
分類1 分類2 不要なアクション
新規にレコメンドを
投稿する。 レストランの
レコメンドされてい
ログアウトする。 ギャラリーの中の
る 場所を検索する。 予約をする。
FBにアプリを 写真を選択する。
場所を見る。
登録する。
写真を撮る。
レコメンドの詳細を
新規のレコメンドに 見る。
場所の名前を
入れる。 レコメンドを
カテゴリーで
既存のレコメンドに 新規のレコメンドに 既存のレコメンドに フィルターする。
場所のカテゴリー コメントをつける。 コメントを 自分の写真を (閲覧時)
を選ぶ。 つける。 追加する。
(撮影時)
撮った写真を
確認する。
13
- 15. 3. 優先順位をつける
ユーザーにとって必要なことを知る。→ユーザーがUXを達成することが出来る。
分類1: UXを達成するためのアクション 分類2 : 二次的なアクション
1. レコメンドされている場所を見る。 1. 場所を検索する。
1.1. レコメンドの詳細を見る。 2. Facebookにアプリを登録する。
2. 新規にレコメンドを投稿する。 3. ログアウトする。
2.1. 新規のレコメンドに場所の名前を入れる。
2.2. レコメンドする場所のカテゴリーを選ぶ。 分類2 : UXを高めるためのアクション
2.3. 写真を撮る。
2.3.1 撮った写真を確認する。 4. 新規のレコメンドにコメントをつける。
5. 既存のレコメンドに自分の写真を追加する。
6. 既存のレコメンドにコメントを付ける。
15
- 17. 4. つなげる
場所の名前を
自分の写真を
レコメンドの 入れる。
追加する。
詳細を見る。
FBにアプリを
登録する。
場所のカテゴ
コメントをつ リー
ける。 を選ぶ。
レコメンドの レコメンドを
場所を見る。 投稿する。
写真を
写真を撮る。
確認する。
場所を検索す コメントを
る。 つける。
ログアウト
17
- 20. 振り返り
UXのためのUIデザインをするために、 UX
1. アクションを元にUIデザインをする。
2. やらないことを捨て、できないことを残す。 アクション
挙げる
3. 必要なアクションを適切な場所に入れる。 2つに分ける
優先順位をつける
1. 1.
2. 2.
3. 3.
UI
つなげる
描く
20