8 million
IDs

This blog introduces interaction designs in the world!

UI, IX, UXデザイン,あるいは,スパイラル・モデル型UXデザイン

2012 年 5 月 9 日

全く放置気味のこのブログだけど,最近UXデザインに関する話題が散見されるので,そろそろ筆者が過去に提案したデザインメソッドを応用して,UXデザインフレームワークでも構築してみるかと思い立った次第.せっかくなので,UIデザイン,IXDデザイン,UXデザイン,サービスデザインまで含めたテキストをつらつらと書きとめておくことにした.

まずは,UIデザイン,IXデザイン,UXデザインについて,それぞれ説明するところからはじめよう.

UI,IX,UX

UIデザイン

UI(User Interface)デザインは,ユーザからの情報の入力とシステムからの情報出力を実現する境界面のデザインである(図1).UIデザインの場合,原則UIそのものに時間軸が存在しないため,平面もしくは立体物を表現するデータ,物理的に接触可能なオブジェクト,あるいは,システムへ情報を送ることのできる装置それ自体のデザインを指す.

例えば,ウェブの場合,2次元のグラフィックが中心である.実世界インタフェースとして有名なインタフェースに,kinect,wiiリモコンがある.展示物などの実世界体験型インタラクティブシステムの場合,接触型もしくは非接触型インタフェースをデザイナ/エンジニアが新たに構築することになる.


図1. UI

IXデザイン

IXD(Interaction Design)は,UIを通じての,ユーザとシステムの間の情報のやりとりのデザインである(図2).UIを介して,ヒトが情報(アクション)をシステムに提供する,システムはその情報(アクション)に基づいて処理を行い,その処理結果をユーザに返す(フィードバック)というループのデザインである.IXDの場合,UIと異なり,1回のインタラクションが起こる,すなわち,ループが成立する単位時間が存在する.

例えば,ウェブの場合,ボタンをクリックすると,フロントもしくはサーバサイドでの処理が行われ,新たな要素がページ上に表示されたり,ページが遷移するといったインタラクションが考えられる.展示物などの実世界体験型インタラクティブシステムの場合,任意のオブジェクトを触ると,システムがこのアクションを解析し,ディスプレイに当該オブジェクトに紐付けられた情報が提示されるといったインタラクションが考えられる.このインタラクションに必要な要素すべてがデザインの対象となる.


図2. IXD

UXデザイン

UX(User Experience)デザインは,インタションを繰り返して伝えられるユーザの経験のデザインである.1度のインタラクションを通じて伝えられるユーザ体験もあれば,複数回のインタラクションを通じて伝えられるユーザ経験もある.UXデザインの場合,1回のインタラクションではなく,1回のユーザ体験が単位時間となる.これは,ある時点からある時点までインタラクションが連続して起こる時間を意味する.

UXデザインを語る場合,ハニカムモデル[1](図3)がよく引き合いに出される.Useful(役に立つこと),Usable(使いやすいこと),Desirable(好ましいこと),Findable(探しやすいこと),Accessible(誰でも使えること),Credible(信頼できること),Valuable(価値があること)の7要件である.これは,インタラクションの結果として,ある時点で,あるいは,最終的にどのような経験を目指すかという指標である.したがって,ハニカムモデルは,メソッドではなく,UXデザインにおけるゴールを説明したものと言える.

[1] User Experience Honeycomb (2004) User Experience Design.


図3. ハニカムモデル

ハニカムモデルがゴールを説明したものでるならば,このモデルで示されるようなUXをデザインするための妥当なメソッドが必要となる.そのメソッドのひとつとして考えられるのが,デザインパタンである.デザインパタンは,「あるコンテキストにおけるデザイン上の特定の問題に対するソリューションを提供することを目的としたデザインメソッド」と定義される.デザインパタンの概念は建築で生まれ、ソフトウェア、HCI(Human Computer Interaction)へと移行してきた.HCIの分野では,Jan O. Borchers[2],Martijn van Welie[3]らによるパタンコレクションが有名である.これらのパタンコレクションは,すでにその効果が認められたパタンを収集したものである.

[2] Jan O. Borchers. HCI Patterns.
[3] Martijn van Welie. Patterns in Interaction Design.

 

これらのパタン以外にも,インターネット上には,様々なデザイナが数え切れない遺産を残してくれている.美しいデザイン,心地良いデザイン,楽しいデザインなど,様々なデザインパタンが,すでに世の中には存在しているのである.デザイン初心者は自分自身のパタンをコレクションするところから始めるのがよい.自分だけのパタンコレクションを増やすことで,デザインのバリエーションは飛躍的に増加するだろう.この時,デザインの裏にある哲学,ストラテジも同時に学ぶことが必要だ.デザイナと同じ思考プロセスと経ることで,自らの思考プロセスのパタンを増加させることができるだろう.

一見,万能に見えるデザインパタンであるが,問題もある.パタン同士のインテグレーションだ.個別の問題を解決するためのインタラクションデザインは,その問題に対応したパタンで対応できる.しかなしながら,複数のインタラクションのインテグレーションはパタンでは解決できない.建築家が複数のパタンを統合しても優れた家や都市をデザインできない現象と同様に,システム全体を通じた包括的なユーザ体験は,パタンだけでは実現できないのである.

個別のパタンを適用してサービスを構築できないのであれば,インテグレーションを放棄して,あるサービスの全体像をそのままコピーするという考え方もある.しかしながら,多くの場合,単なる劣化コピーに留まるだろう.すでに市場において優位を占めるサービスを駆逐するために,そのコピーを構築するということは戦略的には勝負を放棄していることも同然だ.なぜならユーザが,優位を占めるサービスを放棄して劣化コピーに移る理由はどこにもないからだ.

では,パタンを利用しつつインテグレーションをも可能とする,新たなフレームワークを考えてみよう.この新たなフレームワークこそ,スパイラル・モデル型UXデザインである.

スパイラル・モデル型UXデザイン

スパイラル・モデルは,ソフトウェア開発手法として1980年代に生まれたものである.開発と検証のループを繰り返し,少しずつ改良を進めていくという考え方である.この考え方について馴染み深い読者もいるだろう.そう,アジャイル開発手法だ.アジャイル開発手法は,スパイラル・モデルをより進化させたものである.スパイラル・モデルとアジャイルの相違点として,検証単位の短期化,顧客の存在などが挙げられる.本フレームワークにスパイラル・モデルという名称を付与したことは,ウォーターフォール型開発の対局としての適応的開発というポジショニングを主張するためである.

スパイラル・モデル型UXデザインは,フィードバックを伴うインタラクションプロセスにおけるつどのインタラクションを1つの「タッチポイント」としてみなし,タッチポイントごとのユーザ体験を設計し,システム全体としての統合的なユーザ体験のデザインを試みるものである.スパイラル・モデル型UXデザインを採用したシステムは,フィードバックプロセスを採用しているため,デザインパタンを適用したタッチポイント同士は,インタラクションごとのデータを引き継いでいくことになる(図4).


図4: フィードバックプロセスにおけるタッチポイント

フィードバックプロセスにおけるタッチポイントは,ゴールに向かって2つのデータを紡いでいく.2つはシステム側から見たデータ,もう1つはヒトというシステムから見たデータである.システムの視点から見れば,タッチポイントごとのインタラクションにおいて,ユーザからのアクションに基づくシステムからのフィードバックとして量的のデータを引き継いでいく.一方,ユーザの視点から見れば,タッチポイントごとのインタラクションにおいて,インタラクションの結果起こる経験としての質的データ(感情)を引き継いでいく.

スパイラル・モデル型UXデザインでは,デザイナがタッチポイントごとのデータの連続性をどのように設計していくか,全体設計をどのように行うかといった点がポイントとなる.この鍵となる手法がストーリーテリングである.

ストーリーテリング

ストーリーテリングは,コンセプトを表現するためのストーリーの伝え方である.スパイラル・モデル型UXデザインでは,タッチポイントごとの経験をデザインパタンを用いてデザインしたのち,複数のタッチポイントをつなぎ合わせた場合の全体としてのストーリーを効果的に伝える必要がある.

ストーリーの伝え方は,起承転結,序破急など様々な手法があるが,まず,いつ,どこで,誰が,何を,どのように感じるのかという点について考える必要がある.続いて,コンセプトを意識しつつ,それぞれのタッチポイントを設計する.タッチポイントごとに常にコンセプトを意識してデザインを施すことで,ユーザ体験のスタートからゴールまで,全体のプロセスを通じて,ユーザに任意の感情を残しつつ,同時に,コンセプトを理解させることができる.

スパイラル・モデル型UXデザインは,システムにおけるインタラクションデザインに対してデザインパタンを導入し,ユーザにおける経験デザインに対してストーリーデザインを導入することによって,フィードバックプロセスを通じてユーザに対して常にコンセプトを意識させながら,体験終了時にゴールへ到達させることを狙いとしている.

サービスブループリント

スパイラル・モデル型UXデザインは,タッチポイントの概念をサービスブループリントモデル[4]より継承している.リン・ショスタック(Lynn Shostack)によって提案されたサービスブループリントは,サービスの最適な構造を把握するためのモデルである.従来のサービスブループリントは,顧客とサービス提供者のタッチポイント,および,バックエンドのシステムのフローを可視化することを目的としていた.したがって,サービスの全体性を担保することができる.しかしながら,タッチポイントごとのサービスならびにシステムをいかに設計するかというユーザ経験の具体的なデザインを考慮しなかった.

[4] Shostack, G. Lynne (1984) Designing Services that Deliver. Harvard Business Review, vol. 62, no. 1, pp. 133–139.

 

ここでサービスブループリント,デザインパタン,スパイラル・モデル型UXデザインのそれぞれの特徴を整理しておこう(表1).

サービスブループリントは,タッチポイントベースでサービスフローを可視化する.そのため,サービスの全体設計が可能である.一方で,ユーザ体験の設計をツールとして提供していない.また,フィードバックプロセスを明示的に採用していない.

デザインパタンは,個別のユーザ体験の設計を実現している.しかしながら,パタン同士のインテグレーションが困難であるため,サービスの全体設計が困難である.また,建築ではヒエラルキーという概念でパタン同士の関係性を内包していたが,HCIの場合,これを考慮していない.これに対して,スパイラル・モデル型UXデザインでは,ヒエラルキーの概念に変わる概念として,フィードバックの概念を導入し,パタン同士の関係性の構築を試みている.

スパイラル・モデル型UXデザインは,インタラクションの起きる場所をタッチポイントと捉え,フィードバックプロセスを通じてタッチポイント同士をつなぎ,ユーザをゴールへ導く.個別のタッチポイントの設計は,デザインパタンを活用可能でありつつ,フィードバックプロセスとストーリーテリングを導入することによって,サービスそれ自体の全体設計も実現している.したがって,サービスブループリント,および,デザインパタンの問題点の解決を可能とするフレームワークと言える.

表1. サービスブループリント,デザインパタン,スパイラル・モデル型UXデザイン

全体設計 経験設計 フィードバック
サービスブループリント
デザインパタン
スパイラル・モデル型
UXデザイン

様々なタッチポイント

ここからは,スパイラル・モデル型UXデザインの適用領域について簡単に述べたい.

1. ウェブサービス
ウェブサービスの場合,ユーザの接点たる画面がタッチポイントと言える.画面1つ,あるいは,画面におけるパーツ1つをとっても,コンセプトを常に意識しつつ,この画面で何をユーザに伝えたいのか,どういった体験を提供しなければならないのかといった点を考慮しながらデザインする必要がある.

ウェブサービスが実世界に存在するプロダクトと結びついた場合,例えば,ECサイトの場合,商品の送付業者,梱包方法,同梱物もタッチポイントとして考えられる.商品を配送する業者をユーザが選べたり,梱包が魅力的であったり,同梱物にサンプルが入っていたり,様々なタッチポイントに対して,個別の目的を設定し,魅力的なユーザ体験の提供を設計していくことがポイントである.

2. モバイルアプリ
PCオリエンテッドなウェブサービスと比較した場合,iPhoneアプリやAndroidアプリのようなモバイルアプリは,GPS,マイク,カメラなどセンサ情報などを利用できるため,実世界と結びついたより複合的なユーザ体験を提供可能である.とはいえ,モバイルアプリもまた,ウェブサービスと同様に画面を1つのタッチポイントとして,全体のコンセプトを意識しつつ,個別のタッチポイントにそれぞれの目標を設定した上でデザインするという点では,ウェブサービスと同様のプロセスを必要とする.

3. イベント
スパイラル・モデル型UXデザインの最も効力を発するものがイベント設計である.イベントには様々な現場でのタッチポイントに加えて,事前告知を目的としたウェブ,ソーシャルメディアのキャンペーン,イベント終了後の体験共有の場,そして,次回イベントまでの継続した関係の構築のための活動など,数多くのタッチポイントが存在する.それぞれのタッチポイントは個別の目的が設定されているため,イベントのコンセプトを踏まえた上で,個別の目的を達成するためのアプローチをデザインしていくことが求められる.

以上,UIデザイン,IXデザイン,UXデザインの概念を説明したのち,スパイラル・モデル型UXデザインの理論的枠組とその応用について述べた.機会があればこのフレームワークを利用して実際に構築したサービスについても執筆したいと思う.

Appendix

余裕のある読者のために,スパイラル・モデル型UXデザインの元となったデザインメソッドについて簡単に説明しておく.より詳しい説明は認知学会論文誌に掲載された論文[5],もしくは,博士論文[6]を参照されたい.

[5] – (2010) Adjustive Media:フィードバックを伴うメディア作品の制作手法. 認知科学会論文誌.Vol.17, No.3, pp.536-548.
[6] – (2007) 創造行為を伴う遊びCreatioのためのデザインメソッド. 慶應義塾大学.

博士論文

筆者は博士論文にて,創造行為を伴う遊びのためのインタラクティブシステムを対象として,フィードバックを伴うインタラクションプロセスを通じてユーザに楽しさを得させるためのデザインメソッドについて論じた.フィードバックプロセスをインタラクティブシステムに採用することで,1回のインタラクションで生じた誤差を次のインタラクションに引き継ぐことことが可能となる.その結果,インタラクションを繰り返すことで,ユーザは,少しづつゴールへ近づくことが可能となる.博士論文では,このゴールとして,ユーザがインタラクションを通じて楽しさを得ること,と設定した.ユーザは,1回のインタラクションで楽しさを得られなくても,インタラクションを繰り返すことで最終的に楽しさを得ることができることを目指した.

しかしながら,どのようなアプローチで楽しさをデザインするのか?筆者はインタラクションデザインの手法として,チクセントミハイのFlow理論を採用した上で,インタラクションデザインのチューニングとして,デザインパタンを採用した.

Flowは,社会学者・心理学者Csikszentmihalyiが提唱した概念であり,「一つの活動に深く没入しているので他の何者も問題とならなくなる状態,その経験それ自体が非常に楽しいため,純粋にそれをするということのために多くの時間や労力を費やすような状態」と定義される.現象学的観点からヒトの楽しさを調査した上で,構築した概念であることから,楽しさを包含する概念と位置づけられる.

Flow理論は,ヒトがフローに至る過程を理論化したものであり,Flow構成要素(表1)とFlowチャンネルモデル(図5)で構成される.まず,Flow構成要素は,ヒトがフローに至る際の8つの心理的条件である.これらの要素は,Csikszentmihalyiが数十年に渡って数千人に対して,ヒトが最も楽しいと覚える時どのように感じていたかについて広範な調査を行った結果として体系化された.一方,Flowチャンネルモデルは,適切なSkill(能力)とChallenge (挑戦)のバランスが生じる場合に初めて,ヒトがFlowに到達するというモデルを指す.

表2. Flow構成要素
1. 挑戦的活動: A challenge activity that requires skills.
2. 行為と意識の融合: The merging of action and awareness.
3. 明確な目標: Clear goals.
4. 直接的なフィードバック: Direct feedback.
5. 注意集中: Concentration on the task at hand.
6. 統制感: The sense of control.
7. 自意識の喪失と体験後の自己感覚の強化: concern for self disappears,
but sense of self emerges stronger afterwards.
8. 時間の変換: The transformation of time.


図5. フローチャンネルモデル

本デザインメソッドは,つどのインタラクションをユーザとシステムとのタッチポイントと捉え,タッチポイントごとにFlowモデルにもどづく設計を施している.本デザインメソッドで構築されるシステムは,フィードバックプロセスを採用しているため,各タッチポイントのゴールに対する差分は,次のタッチポイントへ継承される.したがって,インタラクティブシステム全体のユーザ経験を通じて,ユーザに楽しさを提供する確率は飛躍的に向上する.

同時に,本デザインメソッドは,パタンを個別に適用するわけではなく,ある目的(ここでは楽しさ)を達成するためのタッチポイントごとのインタラクションのチューニングに用いている.チューニングとはいえ,パタンを採用していることには変わりないため,インテグレーション問題が発生する.しかしながら,フィードバックプロセスが,ユーザ体験の全体性を担保するための仕組みとして機能する.

以上のようなデザインメソッドは,創造行為を伴う遊びのためのインタラクティブシステムを対象としたデザインメソッドであった.創造行為を伴う遊びのためのインタラクティブシステムを,サービスを含むより広いシステムへ,楽しさのデザインを,より広いUXのデザインへと拡張を試みたフレームワークが,スパイラル・モデル型UXデザインである.

 

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です