WEB制作ワークフローの「要件定義」を新任のWEB担当が最初に理解すべき理由｜失敗しないデザイン発注の教科書 Pt.3

もし、自社WEBのサイトリニューアル計画の担当を突然、任された場合、制作に携わって来た経験がないと依頼する制作会社に頼らざるをえません。

とはいえ、丸投げで物事が進むほど安心して居られないのも現実です。何故なら、全てのWEB制作会社やWEBデザイナーが共通の進行管理を確立しているわけでないからです。

新任のWEB担当者が、まずは押さえておきたいWEBサイトのリニュール作業工程の基本にして「肝」となるWEB制作ワークフローの「要件定義」についてポイントを紹介していきます。

キーワードは、WEB制作(サイトリニューアル)の指針となる「羅針盤」です。

 ページ最後に、新任WEB担当者向けWEB制作やサイトリニューアルに関する「用語集」 を設けてあります。

「WEB制作ワークフロー」とは

「要件定義」で適切なユーザー体験を提供する

新任のWEB担当者には、まずはどのような作業工程がWEB制作のワークフローにあるかを事前に把握しておくことで提案内容などに集中したディスカッションや社内調整に時間を費やせます。

「ワークフロー」の一般的な意味は、意志決定などにおける申請と承認を示すプロセスです。WEB制作においては、いきなりデザインを組み立てる前にサイトの構成や設計の仕様を整理する初期の段階(フェーズ:Phase)が重要になります。

それは、WEBサイトの目的や現状の課題を明確にしてサイトの基本仕様や構成となる要件定義をまとめるフェーズになります。その上で、デザインやコーディングの実制作(開発)に入ることで目的に即した適切なWEBのユーザー体験のシナリオを提供することが可能になるからです。

失敗に陥るWEB構築は、「要件定義」がしっかりと錬られていなく、ビジネス本来の目標を見失うケースが起こる。

ビジネス課題を解決する「3フェーズ構成」

新規サイト構築もサイトリニューアルにおいても、基本のWEB制作の大まかな流れは、「1.要件定義」、「2.実制作/開発」、そして「3.実装」の３フェーズ構成になります。

昨今のWEBサイトは、スマホやPCの両方への対応が必須でアクセス時に判別してサイトの画面サイズとレイアウトをプログラムで自動で変更する「レスポンシブ」機能の仕様が標準になります。

また、コーポレートサイトもB2B、B2Cなどのビジネス特性に関係なく顧客管理システムのCRMデータ連携によるマーケティング活動の自動化システム「マーケティングオートメーション（MA）」のプログラムをサイトに別途、導入することも法人サイトでは一般的になりました。

旧来のビジュアルとテキストのカタログのようなWEBサイトではなく、さまざまな機能やテクノロジーを手軽に組み合わせられるのが現在のWEBサイトの特徴でもあり、システム開発と同様の工程が必要になります。

まずは、最初の「1.要件定義」フェーズで現状分析を施して問題と課題設定を見定めてビジネスゴールの策定や技術仕様を確定させます。

次に、ビジネス課題を満たすためのデザイン開発に落とし込む作業が「2.実制作/開発」のフェーズです。ここでは主に、情報設計を中心にサイトのコンテンツや操作･機能に優れたユーザーインターフェース(UI)、そしてビジュアルデザインやコンテンツを開発します。

最後の「3.実装」フェーズでは、公開に備えたサーバー側の各種設定やテスト環境の動作確認を行い公開の準備を行います。

「要件定義」の解説

基本仕様を決める手順

WEBを構築することは、建築のプロセスと類似しています。その建物が住居か商業施設かで間取りや人流の回遊導線、設備が異なるように、WEBサイトも目的や用途により基本の設計や仕様が変わります。

例えば、コーポレートサイトではサービスや商品の理解を深めるコンテンツ構造や問合せにおける自動対応のチャット機能など、または、オンライン直販のECサイトでは決済機能やSNS連動による口コミ集客機能など導入する技術や仕様も目的によりさまざまです。

そのために、現状の問題点の洗い出し目的や目標に合わせたコンテンツ設計や導入すべき技術を選定することが必要になります。それが、サイトの基本仕様(Basic Design)を決めてWEB開発(Detail Design)に移る流れです。

一般的に、コーポレートサイトの要件定義の期間は約3週間〜4週間ほどのスケジュールで組まれる傾向があります。進行においては、制作会社が主導してヒアリングを行い提案とディスカッションでクライアント側の承認を得ながらプロジェクトを進めます。

Ⅰ. 現状分析・競合調査：Analytics & Research

WEBリニューアルの場合、現状のサイト分析を行います。評価軸は、サイト全体やナビゲーションなどの情報設計におけるユーザービリティ(=使いやすさの指標)やサイト内の回遊動線を確認します。時間と費用を掛けられる場合は、WEBサイトのログデータを分析するアクセスログ解析で実際の利用状況を確認します。

準備期間が短い場合は、専門家によるヒューリスティック分析で簡易的に現状のWEBサイトの問題点を目視で洗い出す方法もあります。

また、一般向けWEBサイトやアプリのリニューアルの場合、被験者を用いたユーザーテスト調査などもリニューアル前後に実施して改善の度合いを実測するケースもあります。

【参考サイト】ヒューリスティック評価とは(Wikiペディア)

Ⅱ. ビジネス要件：Business Requirements Document(BRD)

クライアントのビジネスでWEBサイトが誰に対しどのような目的と役割を担っているかをまとめます。事前にクライアントがビジネス要件を定めてない場合は、制作会社がクライアント内部の各ステークホルダー(関係者)へヒアリングを行います。ただし、インタビューする人選や日程調整など社内の調整に時間を要します。

クライアント側で事前に用意すべき前提情報として「プロジェクト背景」「WEBの役割と目的」、「想定ターゲット」、「競合他者の設定」、「WEB(評価)目標」、「作業範囲と納品物」などを簡易的にでもまとめておくと、発注先の業者はプロジェクト全体の理解も深まり、概算見積や簡易スケジュールの精度も高かまります。

そうでないと作業量が見えずに余裕を見据えた見積り、通称、「バッファー(buffer)」を積んだ概算見積やスケジュールが出て来ます。

Ⅲ. 機能要件：Functional Requirements Document(FRD)

サイトに必要な基本機能や導入を必要とする機能をビジネス要件の課題などと付き合わせて選定します。例えば、WEBサイト上の問合せの改善においては、FAQの設置やSNSアカウントとの連動、また、チャットBotを活用した自動問合せ機能など技術の導入を課題と付き合わせて選定します。

昨今のWEBサイトは、CMS(コンテンツ マネージメント システム)でWEBサイト全体の画像やテキストデータを管理するプログラムが主流になり、必要な機能の整理やテンプレートをカスタマイズするための技術仕様の整理も事前に必要になります。

さらに、運用面や保守、サイトの拡張性(CMSのアップデート対応)やセキュリティなど非機能要件についても制作業者と討議を重ねてコストとスケジュールから優先順位を付けてどこまで依頼するかを決めます。

Ⅳ. サイト設計：Site Structure Design

サイトのコンテンツをまとめたサイトマップや、画面遷移図などのサイト構成をビジネス要件や機能要件と合わせてサイト全体の構成を図式化(Diagram：ダイアグラム)します。

Ⅴ. デザインコンセプト：Visual & UX Design Concept

ビジュアルの方向性などユーザー体験(UX)の概念を言語化したデザインコンセプトで策定します。この方針により、後の詳細デザインで迷いが生じたい時に振り返る基軸となります。

また、サイト全体の配色構成、必要に応じてサイト全体のユーザーインターフェース(UI)やトーン&マナーなどの方向性を策定します。

Ⅵ. グランドスケジュール：Grand Schedule/WBS

各要件定義を定めて実制作の全体スケジュールと詳細作業をまとめ上げ担当者を明記したWBS(Work Breakdow System)を制作会社が作成します。WBSは、進捗状況を棒グラフで示したガントチャートと統合した様式で使われることがあります。

要件定義に入る前のプロジェクト開始のキックオフミーティングでは、プロジェクトの実施における双方のプロジェクト体制とプロジェクト運営の基本設計(日常の連絡手段、基本のデータやり取りに使うソフトの確認など)を確認しておくことが必須。

制作会社の経験や力量のバロメーター

サイト規模により初期フェーズの期間は変化します。今回の要件定義の項目は、約3〜４週間程の期間を想定したサンプルになります。

また、制作側の担当者によっては、クライアント側のリードが慣れていない場合などヒアリング項目の事前準備やそれ以降の提案作業に時間が掛かる場合もあります。

特にユーザー体験(UX)の方向性などを概念化した「デザインコンセプト」の初期提案では、制作会社のUXの実績や取り組みなどの経験値が色濃く表れます。

競合プレゼンなどを開催する場合に、提案の依頼項目に「デザインコンセプト」の目的を伝えて募ることで制作会社の実務経験の経験則を測ることも可能。