スクリーンフローテンプレート
ユーザーフロー内の視覚的なスクリーンコンポーネントを検証します。
スクリーンフロー テンプレートについて
スクリーンフロー（「ワイヤーフロー」とも呼ばれる）は、ワイヤーフレームとフローチャート作成を組み合わせたものです。エンドツーエンドのフローは、各画面でユーザーが何を見るか、そしてそれが製品やサービスを通じてどのように意思決定プロセスに影響を与えるかをマッピングします。その情報を手に入れることで、インタラクションデザインに関する決定をより良く説明できます。
スクリーンフロー テンプレートを使用して、ユーザーエクスペリエンスをスムーズにし、開始から終了まで問題を感じさせない新しい機会を見つけましょう。
ワークをさらに発展させ、UXデザインの領域に入り、ユーザージャーニーを画面ではなくテキストとシンボルでフローチャートとして示したい場合は、ユーザーフロー テンプレートに興味があるかもしれません。
スクリーン フローについてさらに詳しく知るには、このままお読みください。
スクリーン フローとは何ですか？
スクリーン フロー（またはワイヤーフロー）は、フローチャートのように接続されたマルチスクリーンのレイアウトを組み合わせ、顧客の意思決定ポイントと移動を始めから終わりまでマッピングするものです。
ワイヤーフレームだけでは、インタラクティブかつページごとのユーザーフローがどのように見えるかのコンテキストが不足しています。UX フローは独自に存在する場合、より抽象的で、顧客が実際に何を見ているのかを示すことはできません。
ワイヤーフロー、つまりスクリーンフローは、両方のメソッドの強みを組み合わせ、ユーザーが目にするものがあなたの製品やサービスの体験にどのように大きな影響を与えるかを説明するのに役立ちます。
スクリーン フローを使用するタイミング
ワイヤーフレームは、UX と製品チームが顧客のジャーニーを一連の画面ではなく全体のフローとして考えるのに役立ちます。ワイヤーフローまたはスクリーンフローは、画面そのものと、サービスや製品とのユーザーのやり取りに焦点を当てます。
デザイナーはスクリーンフローをマップすることで、以下の場合に役立ちます。
シナリオの見逃しがないことを確認する：エンドツーエンドのジャーニーをマップすることで、お客様のニーズに適用されるすべての潜在的なユースケースを考慮することができます。
ユーザーのインタラクションを向上させる：サインアップ、確認、ポップアップなど、フロー内のあらゆるチャンスを通じてお客様をよく理解します。
より良いクロスファンクショナルなコミュニケーションを創造する：デザイナーと開発者を一緒に参加させ、別々の画面ではなく全体的な体験を考えるよう促します。
ステークホルダー教育に参加する：クライアントやチームがあなたの製品や体験を通じてお客様が何を見るかを今まで考えたことがない場合、フローに従うことでお客様のペインポイントへの共感を築く手助けをします。
自分のスクリーンフローを作成する
スクリーンフローの作成は簡単です。Miro のバーチャルコラボレーションプラットフォームは、それらを作成し共有するのに最適なキャンバスを提供します。スクリーンフローテンプレートを選択することから始め、次のステップに従って独自のものを作成してください。
1. ユーザーストーリーを定義する
視覚的なシーケンスをマッピングし始める前に、解決すべきユーザーのニーズと痛点を記述します。これが、スクリーンフローの開始点を設定するための基盤となります。
2. 主要な画面で何を表示するか決定する
旅の中での開始地点と終了地点をよく考えましょう。ランディングページは必要ですか？登録フォームの画面？確認ページ？プロセスにおいて、ページを分割する必要があるか、追加の画面が必要かなど、変更点や追加のステップを特定してください。Miroは完璧なワイヤーフレーム作成ツールであり、ワイヤーフレーム ライブラリーには15以上のUIコンポーネントがあり、簡単にスクリーンフローに追加できます。
3. 画面を接続する
Miroの接続線ツールを使用して、各画面の間に矢印を追加・移動し、タスクを進めるためにユーザーを誘導します。また、決定ポイントを含め、ユーザーが利用可能なすべての状況で何が起こるかを示すことができます。
4. チームやステークホルダーとスクリーンフローを共有してフィードバックをもらう
Miro のメンション機能を使って、チームまたは個々の人をタグ付けし、クイックフィードバックラウンドやデザイン批評、ライブワークショップセッション前のレビューを行うことができます。Miro のボードを誰とでも（登録していない人でも！）共有するには、メンバーを招待するボタンをクリックしてください。
ユーザーフローの例を発見して、次の大プロジェクトに役立てましょう。
スクリーンフローテンプレートに関するFAQ
UXにおけるスクリーンフローとは？
スクリーン フローは、主に製品スクリーンに焦点を当てて、ユーザーのインタラクションを分析するのに役立ちます。ワイヤーフレームとフローチャートの長所を組み合わせて、お客様の動線をより詳細に把握し、それに基づいてより良いユーザーエクスペリエンスを構築するためのより多くのデータを提供します。
UXにおけるスクリーンフローとは何ですか？
画面フローは、ユーザーの操作を分析するのに役立ちます。主に製品の画面に焦点を当てています。ワイヤーフレームとフローチャートの長所を組み合わせることで、顧客のフローをより詳細に把握でき、その結果、より良いユーザー体験を構築するためのデータが得られます。
ローファイ ワイヤーフレーム テンプレート
活躍するシチュエーション:
デスクリサーチ, 製品管理, ワイヤーフレーム
サイトを設計する際やアプリを作成する際は、初期段階で全体像を把握し、大きなアイデアを伝えることが重要です。ローファイ ワイヤーフレームは、見て実行する力を与えます。これらのラフなレイアウト（ナプキンに描いたスケッチのデジタル版と考えてください）は、チームやプロジェクトの関係者が、デザインミーティングがユーザーのニーズに合っているかどうかを迅速に判断するのに役立ちます。私たちのテンプレートを使用すれば、会議やワークショップ、プレゼンテーション、批評セッションでワイヤーフレームを簡単に利用できます。
アプリワイヤーフレーム テンプレート
活躍するシチュエーション:
UX デザイン, ワイヤーフレーム
アプリ作成を始める準備はできていますか？それがどのように機能し、ユーザーがどのように対話するかを想像するだけでなく、ワイヤーフレームに示させましょう。ワイヤーフレームは、各画面の基本的なレイアウトを作成するための手法です。ワイヤーフレームを作成する際は、プロセスの初期段階で行うのが理想です。各画面が何を達成するかを理解し、重要なステークホルダーからの同意を得ることができ、デザインやコンテンツを追加する前にこれを行うことで、時間とコストを節約できます。ユーザーの旅の観点から物事を考えることで、より魅力的で成功する体験を提供できます。
オンライン スケッチング テンプレート
活躍するシチュエーション:
UX デザイン, デスクリサーチ, デザイン思考
有望なアイデアについて全力で進む前に、それを高い視点から見て、その機能や目標への適合性を確認しておきましょう。それがスケッチの役割です。このテンプレートは、プロトタイピングの初期段階において強力なリモートコラボレーションツールを提供します。ウェブページやモバイルアプリのスケッチ、ロゴデザイン、イベントプランニングまで対応します。その後、スケッチをチームと簡単に共有でき、各段階を保存してから変更や改良を加えることができます。
ウェブサイト ワイヤーフレーム作成テンプレート
活躍するシチュエーション:
ワイヤーフレーム, ユーザー エクスペリエンス
ワイヤーフレーム作成は、ウェブサイトを構造レベルで設計するための手法です。ワイヤーフレームは、各ページのインターフェイス要素を示すウェブページのスタイライズされたレイアウトです。このワイヤーフレーム テンプレートを使用して、ウェブページを迅速かつ低コストで反復的に作成しましょう。ワイヤーフレームをクライアントやチームメイトと共有して、関係者と共同作業することができます。ワイヤーフレームにより、チームはあまり多くの時間やリソースを費やさずに、利害関係者の賛同を得ることができます。それにより、ウェブサイトの構造とフローがユーザーのニーズと期待を満たすことを保証します。