テンプレートの中身
- ノード数
- 11
- パック
- フローチャートワイヤーフレーム
- カテゴリ
- UX・マーケティング
Free プランで使えます:ダイアグラムあたり 15 ノード+メモ・テキスト・ステッカー・マインドマップのトピック 150。
ユーザーフローは、ある人が目的にたどり着くまでに目にする画面と、途中で行う選択を図にしたものです。このテンプレートは初回訪問を追います。アプリを開いてからダッシュボードに着くまでに、ようこそ画面、アカウントの有無による分岐、そして登録とログインの画面があります。
画面は実際のコントロールを備えたシンプルなワイヤーフレームなので、ユーザーがどこへ進むかだけでなく、何を目にするかもわかります。プロダクトに必要なエラー状態、パスワードを忘れた場合の経路、オンボーディングの手順を加え、画面を作り始める前にデザインとエンジニアリングでフローを確認しましょう。
使いどころ
- 詳細なモックアップを作る前に、新機能やオンボーディングの流れを設計するとき。
- 既存の導線を見直して、行き止まりや不要な手順を見つけるとき。
- 開発者、テスター、サポート担当にフローを説明するとき。
- 登録や購入手続きの2つの案を比べるとき。
使い方
開始点と終了点の名前を、設計しているゴールに合わせて変えます。
ワイヤーフレームの画面を編集し、ユーザーが目にする手順ごとに画面を追加します。
道が分かれる場所に判断を加え、各矢印にそこへ進む条件のラベルを付けます。
エラーや例外のケースを加え、レビューのためにフローを共有するか、設計ドキュメント用に書き出します。
よくある質問
画面のために別のデザインツールが必要ですか?
フローを描くだけなら必要ありません。ワイヤーフレームパックには、構造を示すのに十分な画面、ボタン、入力欄、ナビゲーション要素があります。ピクセル単位の見た目が必要になったら、デザインツールに移りましょう。
ユーザーフローとカスタマージャーニーマップの違いは何ですか?
ユーザーフローはプロダクト内の画面と判断を扱います。ジャーニーマップは、感情やプロダクト外の接点も含め、時間の流れに沿ったより広い体験を扱います。