Presentation for Mobile Daigaku

HCD（人間中心設計）を活用したWebプロジェクト設計

2010.8.2株式会社コンセント

大岡旨成

HCDとは Webプロジェクトでの活用活用事例まとめ

自己紹介

名前大岡旨成（OHOKA, Munenari）所属株式会社コンセント職種ディレクター、プロジェクトマネージャー資格人間中心設計推進機構認定人間中心設計専門家主な実績株式会社東京国際フォーラム、株式会社カネボウ化粧品、

六本木ヒルズ（森ビル株式会社）、青山商事株式会社他趣味神輿を担ぐ、ブラジル、育児

経歴

201020092008200720062005200420022001

デザイナー～ディレクター

ディレクター（コーディング等も少々）

ディレクター

プロジェクトマネージャー

2003

2003年5月コンセント入社

東京国際フォーラム

カネボウ化粧品青山商事六本木

ヒルズWebアプリ開発

HCDとは

HCDとは


HCDとは

人間中心設計Human-Centered Design＝User-Centered Design

人間中心設計推進機構http://www.hcdnet.org/

人間中心設計専門家認定制度・2010年3月末に第1期合格者を発表（119名）・申請者のこれまでの実績（実務5年以上）を審査し、合否判断・プロジェクトマネージャーや組織管理者など、設計担当者以外も対象に含まれる


HCDとは

利用者の観点で製品を作る

従来、個人/制作者側の意識として注意してきたものを、

プロジェクトのプロセスとして取り入れる

発注者側もこのプロセスを理解し、プロジェクトを進行していく


HCDのプロセス

利用の状況把握と明示（観察）

ユーザーと組織の要求事項の明示（理解）

設計による解決策の作成（設計）

要求事項に対する設計の評価（評価）

基本的な進め方：製品の構想段階から対象ユーザーとその要求を明確にし、要求に合ったものを設計し、満足度合いを評価します。

※ ISO 13407 (JIS Z 8530)：インタラクティブシステムの人間中心設計プロセス

解決策が妥当と評価されるまで繰り返す


製品のライフサイクル

売上(利用者数)

製品A 製品B 製品C

設計フェーズを十分に設けずに開発を行った製品は、発売直後の売上に貢献するため機能や性能にこだわった作りになる傾向がある。短期間で連続した新製品が必要になる。

時間


HCDを利用した場合の製品のライフサイクル

時間

売り上げ（利用者数）

製品A製品A

実際にエンドユーザがその製品を「具体的に」どう使うのかまでを想定して「デザイン」することで継続的な製品利用、リピート利用・購入が見込める。

リニューアルからの経過年月東京国際フォーラム：6年カネボウ化粧品：5年


ユーザーとデザイナー

エンドユーザデザイナー



デザイナーとユーザーが全く異なる

デザイナーがエンドユーザーに一部含まれる

エンドユーザーとデザイナーが全く同じ

→理解が足りなく、良いものは作れない

→まだ知らないことがあるという前提が必要

HCDプロセスの方向


HCDのメリット

ユーザーの行動やデザインの妥当性をあらかじめ検証できる。

一度その製品を使ったユーザーが再度（継続的に）利用しやすい。

継続的な利用が見込めるため、製品ライフサイクルを長く見込める。

最適解が見出しにくい、デザインの評価軸になり得る。

プロジェクトを円滑に進めるための論拠となる。

永続的なPDCAサイクルを構築できる。

HCDとは

Webプロジェクトでの活用


Web制作のプロセス

調査・分析設計デザイン・制作ローンチ

評価

評価（効果測定）

HCDの主な関与領域

改善案の検討

評価


コンセントのワークフロー

調査・分析設計デザイン制作運用・

効果測定

コンセントの標準ワークフロー自体が、HCDプロセスに則っています。

受注後に詳細な調査・分析を行い、プロジェクトの要件定義を行った後、設計、デザイン、制作作業を実施します。

リニューアル後も、継続して運用・効果測定を行い、PDCAサイクルを繰り返し、常に成長するWebサイトを目指します。


調査・分析

ユーザーの理解、現状の課題や目指すべき方向性を探るためのステップ

・ユーザビリティテスト・エキスパートレビュー / ヒューリスティック評価・ヒアリング・ネットリサーチ / グループインタビュー・エスノグラフィ・競合調査・アクセスログ分析

ユーザーの把握、モデリング

結果のレポーティング


設計

概要設計

問題解決のための方針・方向性作り

ラフスケッチ手書きワイヤーフレームペーパープロトタイピングブレインストーミング

設計プロセスの認識共有

仮説の策定


設計

詳細設計

解決案の具体化、比較検討・妥当性判断可能な形への作りこみ

詳細ワイヤーフレームサイトストラクチャーユーザーエクスペリエンスフロープロトタイプ制作

専門家でなくても理解可能な形への落とし込み

多角的な検証

評価ポイントを策定する


評価

解決案が妥当かどうかの検証・評価

ペーパーでのユーザーテスト（紙芝居）ロールプレイ

など

アクセスログ解析ユーザーアンケート調査

など

ローンチ前

ローンチ後

プロジェクト担当者以外へのテスト

設計段階での仮説に対する評価


HCDを活用したプロジェクトのマネジメント

プロジェクトの目的・ゴールやプロセスを適切に設計・企画する。

上流工程から制作・実装までを一貫して運営する。

特に上流工程において、スケジュール遅延を防ぐ。

課題の管理と優先順位判断を行う。

クライアントサイドへの啓蒙・教育を行う。

HCDとは

活用事例



ユーザーモデルのセグメント化とコンテンツマッピング

一般のお客様見やすさ・わかりやすさ・親しみやすさ・利用しやすさ

イベント主催者

それぞれが持つニーズを素早く・確実に解決できる

プレス・マスコミ

ニーズが異なるターゲット毎にサイトを切り分ける必要な情報をスムーズに行き来できる動線設計



サイト評価・ログ解析を元に、ユーザー像を考察。妥当性についてヒアリングを重ねて検証を行った。コンテンツの類型化を行い、その役割と相関関係や優先度を整理。「どのユーザーが、どんなときに、どんな情報を必要とするか」ブランドの醸成効率的な運用を通じ、随時拡張・改善していける仕組み作り

サイト評価ログ解析

ユーザーモデリング

担当者へのヒアリング

コンテンツ /サイト設計運用

運用で得たデータを元にコンテンツ拡充


カネボウ化粧品

エンドユーザーの理解とニーズに沿ったサイト設計

ユーザーは、化粧品会社としての情報よりも取扱いブランドに対してのニーズが高い。

ブランドサイトの戦略は、マーケティングやメディア戦略、流通形態、ターゲットユーザーによって大きく異なっている。

エンドユーザーへの調査から・・・

ブランド担当者への調査から・・・

コーポレートサイトはコンシューマー向けに特化。ブランドを前面に展開する。

ブランドサイトに対し、一律の共通ヘッダーや分類ルールはブランド戦略の効果を阻害してしまうと判断し、最低限のレギュレーションのみ設定。また、コーポレートサイトは特定のブランドに偏らない中立的なポジションとして確立。


カネボウ化粧品

エンドユーザーニーズ調査

サイトにおける全情報の把握と

整理

ブランド担当者インタビューサイト戦略策定コンテンツ

再構成

オンラインモニター調査、化粧品売り場でのエスノグラフィ、ブレスト等によってエンドユーザーのニーズを調査・検討。ブランドサイトを含む、全ての情報を把握し、整理。ブランド担当者（15ブランド程度、1h/回）へのインタビューを実施。コーポレートサイトとブランドサイト、それぞれの役割と必要な情報を検討。ユーザー中心の考えに基づき繰り返し議論していくことで、企業担当者にも意識が強く根付いた。


LUNASOL

ブランドの特性とユーザーニーズによるサイト設計と運用設計徹底したヒアリング主義継続的な効果測定


LUNASOL

担当者へのヒアリング

エンドユーザーアンケート調査

サイト戦略策定運営方針設計動線・画面設計運用・

効果測定

ブランド担当者へのヒアリングを通じ、ブランドの特性、ターゲット、コンセプトなどを理解。エンドユーザーがWebサイトに何を求めているかを調査、検討。Webサイトを通じ、ブランドが継続成長していくための戦略を策定。商品の魅力を正確かつ最大限に伝えるために、商品理解が必要不可欠とし、ブランド戦略担当者、商品開発担当者とも協議を行う。これらの取り組みを4年以上、毎月実施している。


Webアプリケーション開発

業務担当者の頭の中にあるものを、アプリケーション化する。

知識・経験問題解決フロー

利用者からのよくある質問

この手続きどうやるの？自分でできた！

？！

専門知識を持った担当者に聞かなければ分からなかったことを個人で解決できる形で構築。


Webアプリケーション開発

インタビュー形式（15名程度へ数十回）による業務細分化と実態の把握を行い、フローを図式化（約半年）担当者ごとに違う対応方法の平準化制度の関連性や分類を利用者主体に再設計ワイヤーフレーム、仮組みHTMLでのユーザーテストとロールプレイを実施。記録者を用意して被験者のつまづきや誤操作を逐一記録して改善した

業務担当者へのインタビュー

ユーザーモデリング機能設計ユーザーテスト

ロールプレイ開発

改善点の発見→再検討疑問や不整合点を再確認


六本木ヒルズ

何を捨てて、何を拾うか。

サイトのターゲットユーザーを絞って設定「街」として持つ本来の価値を再構築外部アートディレクターと協調サイト全てをCMSで構築・管理


六本木ヒルズ

要件定義担当者インタビュー

ユーザーモデリング

機能・利用フロー検討

動線・画面設計

課題抽出、優先度設定などを行い、リニューアルによって達成することを定義。ユーザーペルソナを設定し、どのようにWebサイトを利用するかを検討・考察。多くの利用ユーザーから、メインターゲット層を選定。メインターゲット層に対して集中的に動線設計を実施し、興味・関心の形成を目的とした回遊型ナビゲーションを設計。

HCDとは

まとめ


まとめ

「誰のためのデザイン」か？評価・改善が重要様々な問題解決のアプローチとして適用できる一部の専門家のものではない

企業とエンドユーザーの橋渡し設計担当者はもちろん、デザイナーやコーダーに至るまでの意識統一クライアントへの啓蒙、プロジェクトの意識作り