縁の下のUIデザイン―少しの工夫で大きな改善!
第22回 画面単位ではなく,画面遷移を意識した改善
Webサービスやアプリケーションはリリースして終わりではなく,
今回は,
画面単位での改善の落とし穴
冒頭に小さな改修に目が行くと全体の流れが損なわれると書きましたが,
- 施策が小粒になってしまい,
ユーザーが良くなったと実感してもらえるレベルに達しない - 改善が部分最適になり,
前後の文脈に違和感が出て, 改善した箇所以外が改悪になるケースがある
図1はバナーのキャッチコピーの変更による効果改善策で,
このように,
一部の数値は向上しても流れの中で不自然な動きが多くなると,
画面遷移を意識した改善の手順
サービスの改善はUIデザインだけに限った話ではなく,
体験をストーリー単位で考える
画面遷移を意識した改善を行う場合,
具体的には以下のようなイメージです。
- ❶ 週末天気が良さそうなので家族でどこかに出かけようと思った
- ❷ アプリを使って日帰りで行ける関東のお出かけ先を調べてみた
- ❸ 子どもたちが鳥を見たいというので動物園や公園などに絞って探した
- ❹ いくつか候補を見つけたので家族の意見も聞きたいためLINEでシェアした
- ❺ 行き先を確定したので,
当日の天気や開園時間などをチェックし出発時間を決めた - ❻ 当日使えるクーポン券があったので忘れないように保存した
このように,
すべての画面変化を書き出す
ストーリーを決めたら,
- ❶ 特定の画面のロードが遅い
- ❷ インジケータが不用意に出る
- ❸ トランジションに違和感がある
- ❹ 手続き完了までのフローが長い
図2は,
画面遷移図に落とし込む際は,
UIデザインの改善を行う場合,
「課題」と「解決案」を記載する
画面遷移に書き出せたら,
1つの課題に対して複数の解決案が思い付くこともあれば,
実際に課題を書いてみると,
今回は,
本誌最新号をチェック!
WEB+DB PRESS Vol.128
2022年4月23日発売
B5判/160ページ
定価1,628円
(本体1,480円+税10%)
ISBN978-4-297-12789-3
- 特集1
演習で慣れる!
データベース入門
SQL操作,テーブル設計,分析用データ処理 - 特集2
クラウド構築ツールの大本命!
ゼロから学ぶTerraform - 特集3
チャットやIssueでちゃんと伝えたい!
エンジニアのための英語
バックナンバー
縁の下のUIデザイン―少しの工夫で大きな改善!
関連記事
- 2021年3月第4週号 1位は,パンくずリストをデザインするヒント,気になるネタは,グーグル,「Chrome」にリアルタイムの自動字幕起こし機能
- 2021年1月第5週号 1位は,自分にはTailwind CSSが向かない理由,気になるネタは,反Facebookの「MeWe」が急成長--広告なし,プライバシー重視のSNS
- お客さまと同じ立場に立ち共にサービスをよくしていく――お客さまのマインドまでも変えていく大規模システムでのUXデザインへのチャレンジ
- 2020年10月第4週号 1位は,UIデザインのためのユーザビリティの経験則10選,気になるネタは,グーグル検索,気になる曲をハミングすると曲名を教えてくれる新機能
- 動詞ではなく名詞を起点に画面を構成する ~OOUIでソフトウェアを使いやすく~