画面フローテンプレート

画面フローテンプレートについて

画面フロー（「ワイヤフロー」とも呼ばれます）は、ワイヤーフレームとフローチャートを組み合わせたものです。エンドツーエンドのフローは、ユーザーが各画面で見るものをマッピングし、それが製品やサービスを通じて意思決定プロセスにどのように影響するかを示します。この情報を基に、インタラクションデザインに関する判断をより良く説明することができます。

画面フローテンプレートを使用して、ユーザーエクスペリエンスを始めから終わりまで摩擦のない、ストレスフリーのものにするための新たな機会を見つけましょう。

仕事をさらに発展させ、画面ではなくテキストと記号を使ったフローチャートとしてユーザージャーニーを示すことができるUXデザインの領域に進みたい場合は、以下に興味を持つかもしれません。ユーザーフローテンプレート。

このまま読み進めて、画面フローの詳細を学びましょう。

画面フローとは何ですか？

画面フロー（またはワイヤフロー）は、複数の画面レイアウトを組み合わせ、フローチャートのように接続して、顧客の意思決定ポイントや始まりから終わりまでの動きをマッピングします。

ワイヤーフレームだけでは、インタラクティブでページごとのユーザーフローがどのように見えるかのコンテキストが欠けています。一方、UXフローは抽象的で、実際に顧客が何を見ているかを示すことはできません。

ワイヤフロー、または画面フローは、両方の手法の強みを組み合わせ、ユーザーが見るものが彼らの製品やサービスの体験にどれほど強い影響を与えるかを立証するのに役立ちます。

画面フローの使用タイミング

ワイヤーフレームは、UX や製品チームがカスタマージャーニーを一連の画面ではなく、全体のフローとして考えるのを助けます。ワイヤーフローや画面フローは、画面自体とサービスや製品との顧客のインタラクションに焦点を当てています。

デザイナーは、必要なときに画面フローをマッピングできます...

• 抜けているシナリオがないことを確認してください。エンドツーエンドのジャーニーをマッピングすると、顧客のニーズに応じたあらゆるユースケースを考慮することができます。

• ユーザーとのインタラクションを改善する：サインアップ、確認、ポップアップなど、フローのあらゆる機会を通じて顧客を把握しましょう。

• より良い部門横断的なコミュニケーションを構築する：デザイナーと開発者が共に一緒に働き、分離された画面ではなく全体の体験について考えることを奨励しましょう。

• 利害関係者への教育に従事する：もしクライアントやチームが、製品や体験を通して顧客が何を見ているかを考えたことがない場合、フローを追うことで顧客の痛点に対する共感を築くのに役立ちます。

自分の画面フローを作成する

画面フローを作成するのは簡単です。Miro のバーチャル コラボレーション プラットフォームは、それを作成し共有するための最適なキャンバスを提供します。まず、画面フローテンプレートを選択し、その後、独自の画面フローを作成するために次のステップを実行してください。

1. ユーザーストーリーを定義する

視覚的なシーケンスをマッピングする前に、解決すべきユーザーのニーズとペインポイントを説明します。これが、画面フローを設定するための基盤となります。

2. 主要な画面に何を表示するかを決定する

旅の始まりと終わりのポイントを考慮します。 ランディングページが必要ですか？ 登録フォーム画面？ 確認ページ？ 必要に応じて、分割が必要なページや追加が必要な画面など、プロセスに対する変更や追加ステップを特定します。 Miroは完璧なワイヤーフレームメーカーと共にワイヤーフレーム ライブラリー15 以上の UI コンポーネントがあり、画面フローに簡単に追加できます。

3. スクリーンをつなぐ

各スクリーン間に矢印を追加して移動し、ユーザーをタスクの先に進めます。Miro のコネクションライン ツール。意思決定ポイントを含め、それぞれの利用可能なインスタンスでユーザーに何が起こるかを示すこともできます。

画面フローをチームや関係者と共有してフィードバックをもらう

使用できますMiro のメンション機能チームや個人をタグ付けして、迅速なフィードバックラウンド、デザイン批評、顧客とのライブワークショップセッション前のレビューを行えます。また、画面右上の[ボードを共有]をクリックすると、Miro ボードを誰とでも（登録されていなくても）共有できます。招待メンバー ボタン。

さらに詳しく知るユーザーフローの例次のイノベーションを創出するお手伝いをします。