UXデザインのプロセス｜工程の実物と、手戻りが起きる場所

料理を始めたころ、レシピどおりに作っているのに段取りだけが悪い、という時期がありました。肉を焼き始めてから野菜を切り、たれの調合で火を止める。工程は全部知っているのに、いつ・何を・どこまで仕込んでおくかが分かっていなかったのです。

UXデザインのプロセスを調べると、「共感→定義→発想→試作→検証」のようなきれいな5段階の図がたくさん出てきます。あの図は工程の一覧としては正しいのですが、料理でいうレシピの材料欄のようなものです。段取り——「各工程で何を作り、どこで手戻りが起きるか」——までは教えてくれません。今日は、その段取りの側の話をしていこうと思います。使うのは、うちが研修で実際に使っている社内教科書のスライドです。前置きはさておき、本題に入ります。

① UXデザインのプロセスとは

UXデザインのプロセスとは、利用者の体験を起点にプロダクトを設計するための工程の進め方のことです。教科書的には、次の5ステップで語られます。

1. プロジェクトの目的の明確化。
2. 利用者の調査・分析。
3. ユーザー体験の設計。
4. プロダクトの設計・実装。
5. プロダクトの評価。

世の解説では、デザイン思考の5段階（「共感→定義→発想→試作→検証」）や、6ステップ・7ステップの流儀も見かけます。実は、数え方が違うだけで背骨は同じです。どの流儀も、国際規格ISO 9241-210がまとめた人間中心設計の変奏です。「利用者の理解から始め、試作と評価を繰り返す」という1本の輪を、何分割で言うかの違いにすぎません。だから、何ステップかで悩む必要はありません。

この5ステップ自体は、うちの現場でも変わりません。ただし実務で効くのは、ステップの名前ではなく、各ステップの出口で何が完成しているかです。以下、そこを順に見ていきます。

② 全体の範囲図｜企画とデザインの橋渡し

まず、プロセス全体のどこにUX設計とUI設計が挟まるかの範囲図です。

流れは、ビジネス／サービス企画 → 要件・仕様定義 → デザイン → 実装、と進みます。UX設計の仕事は、曖昧さを含んだ体験の企画を詳細化・明確化すること。成果物は「体験のフロー（シナリオ）と機能リスト」です。UI設計の仕事は、その体験を画面に落とすこと。成果物は「画面遷移・構成要素リスト・ワイヤーフレーム」です。ちなみにこの範囲図は、研修の1枚目に置いている図でもあります。最初に見せる理由は単純で、自分の工程が全体のどこにいるかを知らないまま作ると、隣の工程に渡らない成果物ができるからです。

この図で覚えてほしいのは、UX設計が「企画とデザインの橋渡し」だという位置です。橋を架けずに企画から画面へ飛ぶと、後の工程で必ず請求書が来ます。

③ 各工程の出口｜何が完成していれば次へ進めるか

5ステップを、出口の成果物で書き直します。

工程	やること	出口の成果物
1. 目的の明確化	誰の何を解決する企画かを言葉にする。	目的の1文と、成功の判断基準。
2. 調査・分析	利用者の行動と背景の事実を集める。	事実の一覧（発言・行動の記録）。
3. 体験の設計	体験の流れをシナリオに書き、機能を抽出する。	シナリオ、機能リスト。
4. 設計・実装	画面遷移を区切り、ワイヤーフレームに落とす。	画面遷移図、ワイヤーフレーム。
5. 評価	実物を利用者に当てて確かめる。	検証結果と、直す一覧。

2の進め方はユーザーインタビューの記事に、3のシナリオの書き方は構造化シナリオ法の記事に詳しく書いてあります。

3から4への変換は、教科書ではこう整理しています。

画面遷移はシナリオから、要素・コンポーネント・モジュールは機能リストから、配置はレイアウトの決めごとから導く。つまり4で決めることの拠り所は、全部3までの成果物の中にあります。この対応が繋がっていれば、「この画面、何のためにあるんだっけ」という会話は起きません。

④ 手戻りの正体｜レベル感のギャップ

プロセスどおり進めたのに手戻りが多い、という相談をよく受けます。原因として一番多いのは、工程の順番ではなく、成果物のレベル感の擦り合わせ不足です。

たとえばワイヤーフレームには、線の粗さで3段階あります。手描きに近いLow-Fi、構成要素が揃ったMid-Fi、寸法まで決まったHi-Fi。「ワイヤーはこっちで作りました」「それならすぐデザインできます」という会話は、双方が想像しているレベルが同じときにしか成立しません。画面遷移は全画面ぶんあるのか、主要な流れだけか。機能リストに当たり前の品質の機能まで入っているのか。構成要素は企画済みか。このレベル感がずれたまま進むと、後の工程がまるごとやり直しになります。

対策は単純で、工程の受け渡しのたびに、成果物の粒度を先に宣言することです。「今回のワイヤーはMid-Fi、主要シナリオの12画面ぶん、寸法は未定」。この1行があるだけで、手戻りの大半は消えます。

⑤ アジャイル時代の回し方

ここまでの流れは、企画→設計→デザイン→実装と一方向に描いてきました。ただし実際の提案や構想の段階では、正確さよりも、議論のたたき台を速く作ることに重きが置かれる場面が多くあります。

その場合は、5ステップを1本の滝ではなく、細い輪で回します。スコープを絞る→体験の当たりを付ける→粗く可視化する→QAで直す、を短い周期で繰り返し、確からしくなった部分から精度を上げる。生成AIで画面のたたき台を作るコストが下がったので、この回し方はさらに速くなりました。ただし速く回せるほど、④のレベル感の宣言が重要になります。粗いものを速く出す働き方は、「どこまで粗いか」の合意とセットで初めて機能します。輪の周期は、うちでは1週間から2週間に収めることが多いです。それより長いと滝に戻り、短いと合意の時間が消えます。

⑥ 実案件では、こう転ぶ

きれいごとだけだと嘘になるので、現場で実際に起きることも書いておきます。

まず、プロセスが実案件でどう組み変わるかの実例から。百貨店とアパレルをつなぐ衣服のシェアリングサービスcarite（カリテ）では、戦略の策定からサービス企画・UX/UI設計・開発までを1本のプロセスで通しました。特徴的だったのは工程3〜5の回し方です。ところが普通のテストではなく、モックアップを関係者のロールプレイングで検証し、直しては演じる反復で「所有より借りたい」という意思決定の文脈を作り込みました。さらに開発は、品質基準の厳しい大企業側の要件に合わせて、アジャイルとウォーターフォールを融合した形に組んでいます。とはいえ、出口の成果物で管理するという背骨は変えていません。教科書の5ステップは、案件の制約に合わせてこうやって変形させて使うものです。

調査（工程2）を飛ばして体験設計に入った案件は、後で利用者の事実に当たったとき、シナリオの根っこから書き直しになります。頭の中の利用者と、実在の利用者は、だいたい別人だからです。飛ばした工程は消えるのではなく、後の工程に姿を変えて出てきます。逆に、調査に凝りすぎて工程2で数か月使うと、確かめる前に予算が尽きます。うちの目安は、最初の1周を小さく——調査は5人前後、シナリオは主要な1本、ワイヤーはMid-Fi——で通してから、2周目で厚くする形です。1周目の目的は完成ではなく、全工程を1回通して「レベル感の合意」と「詰まる場所の発見」を先に済ませることにあります。2周目からは、1周目で見つかった詰まりに厚みを配分できるので、同じ期間でも進み方がまるで変わります。

⑦ 現場で使うなら、このチェックリスト

プロセスを設計するとき・受け渡しのときの7個の問いです。

1. 目的は1文になっているか。成功の判断基準はあるか。
2. 調査の成果物は「事実の一覧」になっているか（印象の箇条書きになっていないか）。
3. シナリオと機能リストは対応しているか（機能の出所がシナリオで説明できるか）。
4. 画面遷移は、シナリオのどの流れを区切ったものか言えるか。
5. 受け渡しのたびに、成果物の粒度（Low/Mid/Hi-Fi・範囲）を宣言したか。
6. 1周目は小さく通す設計になっているか。
7. 評価で直す一覧が、次の周の入力に繋がっているか。

⑧ 一緒に覚えておきたい概念

プロセスの各工程から枝分かれする概念です。

• ユーザーシナリオ — 工程3の中核の成果物。書き方・例・テンプレート
• 構造化シナリオ法 — シナリオを価値・行動・操作の3層で書く方法。3つのシナリオと書き方
• カスタマージャーニーマップ — 体験の流れの可視化。作り方と基本要素
• UXデザインの全体像 — この記事の親。UXデザインとは？何をデザインする仕事か

よくある質問

Q. UXデザインのプロセスは何ステップですか？ A. 教科書的には、目的の明確化→調査・分析→体験の設計→設計・実装→評価の5ステップです。ただし実務で効くのはステップの名前ではなく、各工程の出口で何が完成しているか（シナリオ・機能リスト・画面遷移・ワイヤーフレーム）の管理です。

Q. 人間中心設計やデザイン思考との関係は？ A. どちらも「利用者の理解から始めて、試作と検証を回す」という同じ背骨を持つ考え方です。この記事の5ステップは、その背骨を受託開発の工程に落とした実務版に当たります。

Q. 手戻りを減らすにはどうすればよいですか？ A. 工程の受け渡しのたびに、成果物の粒度を先に宣言することです。ワイヤーフレームのLow/Mid/Hi-Fi、画面遷移の範囲、機能リストの深さ。レベル感のギャップが手戻りの最大の原因なので、そこを合意してから渡します。

Q. 小さなチームでも全工程をやるべきですか？ A. 工程を省くのではなく、1周を小さくするのがお勧めです。調査5人前後・シナリオ1本・粗いワイヤーで全工程を1回通し、2周目から厚くする。工程を飛ばすと、飛ばした工程のぶんだけ後で書き直しが返ってきます。

Q. デザイン思考の5段階とこの5ステップは違うものですか？ A. 背骨は同じです。共感→定義が調査・分析に、発想→試作が体験の設計と設計・実装に、検証が評価に対応します。どちらもISO 9241-210の人間中心設計の輪の変奏なので、社内で馴染んでいる呼び方を使えば十分です。

Q. UXデザインのプロセスで最初にやるべきことは何ですか？ A. 目的を1文にすることです。誰の何を解決する企画で、何が起きたら成功か。ここが曖昧なまま調査に入ると、集めた事実の使い道が決まらず、工程全体が漂流します。

Q. 成果物のテンプレートはありますか？ A. 形よりも、各工程の出口に何があるべきかを押さえるのが先です。目的の1文、事実の一覧、シナリオと機能リスト、画面遷移図とワイヤーフレーム、検証結果と直す一覧。この5点が揃っていれば、書式は自由で構いません。

Q. 発注側としてプロセスのどこに関わるべきですか？ A. 工程1の目的の合意と、工程の受け渡しごとのレベル感の宣言には必ず入ることをお勧めします。この2か所の合意が甘いまま任せると、最後の納品で「思っていたものと違う」が起きます。逆にこの2か所さえ握れば、中の進め方は任せられます。

この記事を書いた会社について

アルチェコ（ARCHECO）は、UXデザイン・AI開発・新規事業開発を組み合わせた事業共創スタジオです。この記事のスライドは、社内研修・社外研修で使っている教科書「2時間でマスター」シリーズの実物で、5ステップの型は10年前の連載から自社の案件で回し続けてきたものです。プロセス設計からの伴走は、UX/UIデザインのサービスページをご覧ください。

余談ですが、料理の段取りは、結局「同時に火にかけてよいのは2口まで」という自分の限界を認めたら上手くなりました。プロセスの設計も、理想の工程図より、チームの限界に合わせた1周の小ささから始めるのが近道だと思っています。

以上です。