の活用~ iot時代に要求される サービス・ui/ux品質とは? ·...
TRANSCRIPT
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
株式会社 U’eyes Design
価値の多様化時代に要求される品質とは? ~一歩先を行く品質の視点、SQuaREの活用~
IoT時代に要求されるサービス・UI/UX品質とは?
~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
2015年8月28日
株式会社U’eyes Design
代表取締役 鱗 原 晴 彦
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
ネットワーク技術の飛躍的な発展により、モノとモノがつながる時代
が到来しています。この技術的な価値を、生活者/ユーザが認識し、
享受するためには「人との接点(サービス・UI/UX)」が必要不可欠で
す。 すなわち、IoT時代のシステム・ソフトウェアには、実ユーザが
実環境下で、サービス・UI/UXを利用した際に感じ取る品質(印象、
心象、経験価値)を高めることが求められます。本講演では、
SQuaREにおいて定義されているUI/UXに関する品質特性・副特性
の活用の仕方について解説します。
1 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
目次
1.ソフトウエア品質ガイド編 ~第3章 今注目したい品質の視点~
1)品質モデルの概略(第2章より)
2)ユーザビリティの定義と考え方
3)ユーザビリティ観点を作り込むために
2.SQuaRE品質モデル活用リファレンス編 ~第5章 利用時の品質 品質特性表~
1)利用時の品質特性表1 有効性「課題達成率」 効率性「NEM」
2)利用時の品質特性表2 満足性「SUS the System Usability Scale」
3)利用時の品質特性表3 リスク回避性、利用状況網羅性「シナリオベース」
3.SQuaRE品質モデル活用リファレンス編 ~第6章 製品品質 品質特性表~
1)製品品質特性表1使用性 運用操作性「直接操作と間接操作の画面遷移数」
2)製品品質特性表2使用性 ユーザインタフェース快美性「等比級数 黄金比」「色彩学」
3)製品品質特性表3使用性 アクセシビリティ「WAIV」
2 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
会社紹介
HCD認定専門家 約30名創立25年
IPA/SEC 各委員会にてユーザビリティ系の情報を提供HCD-Net理事長CCDS 監事
http://www.hcdnet.org/
http://www.ueyesdesign.co.jp/index.html
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
1.ソフトウエア品質ガイド編
~第3章 今注目したい品質の視点~
3 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
つながる世界のソフトウエア品質ガイド 第2章 30p.
図2.3-3 システム・ソフトウエア製品の品質モデル
つながる世界のソフトウエア品質ガイド 第2章 30p.
図2.3-4 利用時の品質モデル
1-1)品質モデルの概略(第2章より)
4 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
図3.1-1 ユーザビリティの定義より(ISO 9241-11、 9241-210) 図3.1-2 ユーザビリティの良し悪しは変化する
図3.1-3 ISO 9241-210のプロセス
1-2)ユーザビリティの定義と考え方
5 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
既存の枠組み
形状/重さ加工精度キーボード押下圧耐久性・・・
全体サイズ画面サイズキーピッチ処理速度・・・
利用状況・ユーザー:主婦、初心者・作業: 家計簿、友人との電子メールの連絡・作業環境:食卓、主に午後、・購入動機:そろそろ私も買ってみようかな
ボーナス商戦での割安購入→使える度合いを把握できないまま入手
etc.
仕様品質製造品質
Keyboard
利用品質
小樽商科大学 平沢尚毅氏 ESEC2005専門セミナー資料より
Keyboard
文字のアサイン機能のアサインH/WとS/Wの良好な関係(MSG※の向上)
※MSG:Matching between SUI & GUI**SUI: Solid User Interface GUI: Graphic User Interface
(ハードウエアの操作性) (ソフトウエア画面の操作性)
契約できない、
設定できない、
必要な文字が打てない、
別の人に送っちゃった
メールでこんなに
簡単に沢山の人と
お話できるんだ!
新機能、高性能、先端デザインだが結局・・・
使えない、使いにくい、情報を紛失した・・・
こんな事象を防ぐ品質
パソコンで言えば
6 /30
1-2)ユーザビリティの定義と考え方(参考)
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
機能適合性
性能効率性
使用性
互換性
信頼性
セキュリティ
適切度認識性
習得性
運用操作性
ユーザーエラー防止性
ユーザーI/F快美性保守性
移植性 アクセシビリティ
製品品質特性 副特性
表3.2-2 SQuaRE「使用性」副特性と
ユーザビリティ検討項目との対応関係(株式会社U'eyes Designの事例)
1-3)ユーザビリティ観点を作り込むために車載機器HMI領域における使用性の検討項目例
表3.2-1 車載用HMIの検討項目例(株式会社U’eyes Designによる)
7 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
NE比4.5倍以上
NE比4.5倍未満
14
12
10
8
4
0
120
60
20
0
NE比
6
2
100
80
40
秒3.5
3.0
2.5
2.0
1.5
1.0
Novice操作時間
Expert操作時間
秒
15
10
5
0
NE比2倍以上
NE比2倍未満
NE比
2.04.5
9.8
図3.2-2 カーエアコン操作の場合(株式会社U’eyes Designによる)
1-3)ユーザビリティ観点を作り込むために
図3.2-3 カーナビの設定操作の場合
8 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
操作ルート1
0
20
40
60操作ルート2 操作ルート1
秒
自治体 第1位 自治体 第2位
0
2
4
6
NE比
自治体 第3位
操作ルート1
2.52 3.51 4.73操作ルート2 操作ルート2
4.5
図3.2-4 Webサイトの場合
1-3)ユーザビリティ観点を作り込むために
「地方自治体Web サイトのユーザビリティ評価2009 ~子育て&引越タスク編~」
9 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
2.SQuaRE品質モデル活用リファレンス編
~第5章 利用時の品質 品質特性表~
10 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
2-1)利用時の品質特性表1
SQuaRE品質モデル活用 リファレンス編
第5章 利用時の品質 品質特性表 134p.
SQuaRE品質モデル活用 リファレンス編
第5章 利用時の品質 品質特性表 132p.
有効性「課題達成率」 効率性「NEM」
11/30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
・有効性 課題達成率の例
12 /30
テストの目的
目標課題達成率成功の条件部分的成功の条件
失敗の条件
結果
文書作成ソフトウェアの罫線機能を使用して表入りビジネス文書を作成する事ができるかチェックする80%罫線機能を使って表が正しく作成されている事(スコア=1)罫線の表が少なくとも部分的に正しく作成されている事(スコア=0.5)罫線機能を使わなかった、または罫線表を半分以上正しく作成できなかった(スコア=0)被験者20名中成功 5名 スコア 1× 5=5部分的成功 10名 スコア 0.5×10=5失敗 5名 スコア 0× 5=0
平均スコアは 50%となり目標達成率に満たなかったため、次回のテストでは罫線機能のどこに問題があるかの調査を行う事を決定した。
9章 結果のまとめ方 9.4有効性に関するデータの処理 表9-1 課題達成率の例ユーザビリティテスティング 共立出版株式会社(2003年)
2-1)利用時の品質特性表1
1020=50%
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
開発者とユーザの意識のズレを客観的に明示
ユーザテスト結果から操作時間に着目した結果
・効率性の例 NEM:Novice Expert ratio Method (問題点の発見)
ある操作ステップから
次の操作ステップに移るまでの時間を測定
客観的な数値情報となって現れた!
13 /30
Three aspects mental model by D.A.Norman
the designer’s conceptual model
the system image
the mental model
2-1)利用時の品質特性表1
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
Time
Time
40
30
20
10
0
40
30
20
10
0
初心者
一般ユーザ
(Novice)
設計者
熟練ユーザ
(Expert)
次のボタンが押せない 表示の意味
が不明入力がたいへんで時間が掛かる
内容を確認する
慣れていても 入力はたいへん
内容は確認する
倍率20
15
10
5
0
Tni
TeiRi=
初心者・一般ユーザの操作時間
設計者・熟練ユーザの操作時間
‥‥m = i1413121110987654321操作ステップ
操作ステップ
操作モデルが一致操作性能の限界
操作モデルの不一致改善が可能
(2005年米国特許取得)
(2007年日本特許取得)
14 /30
NE比はできるだけ小さく1を目指す(4.5倍以上は致命的な欠陥がある)
2-1)利用時の品質特性表1
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
e-GOV NEM評価 6.20(付属資料4 電子政府ユーザビリティ基本調査結果報告)
15 /30
・効率性の例 NEM 電子政府ユーザビリティガイドライン
NE比はできるだけ小さく1を目指す(4.5倍以上は致命的な欠陥がある)
2-1)利用時の品質特性表1
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
SQuaRE品質モデル活用 リファレンス編
第5章 利用時の品質 品質特性表 140p.
SQuaRE品質モデル活用 リファレンス編
第5章 利用時の品質 品質特性表 139p.
満足性 快適性「SUS」the System Usability Scale
2-2)利用時の品質特性表2
16 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
1. この商品をしばしば使いたいと思う
2. この商品は不必要なほど複雑であると感じた
3. この商品は、私にも容易に使えると思った
4. この商品を使うのに専門家のサポートがいるかもしれない
5. この商品にある様々な機能が良くまとまっていると感じた
6. この商品では一貫性のないところが多くあったと思った
7. たいていのユーザは、この商品の使い方について素早く習得できるだろう
8. この商品は、とても扱いにくいと思った
9. 私はこの商品を使いこなせる自信がある
10. この商品を使い始める前に私が学ぶべきことが多くあると思った
今回の一連の操作を実施した時点での、この商品に対するあなたの印象を教えてください。本格的に使う前の現時点の印象からの推測ということで気楽にご回答ください 。
全くそうは思わない すごくそう思う1 2 3 4 5
・満足性 快適性 SUS (the System Usability Scale)
60点以下は・・・80点以上なら優秀と言える
2-2)利用時の品質特性表2
17 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
SQuaRE品質モデル活用 リファレンス編
第5章 利用時の品質 品質特性表 142, 143, 147p.
リスク回避性、利用状況網羅性「シナリオベース」
2-3)利用時の品質特性表3
18/30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
・リスク回避性、利用状況網羅性全利用シーン(シナリオ総数)に対する対応シナリオ数
・標準シナリオ
乗降客がエレベータに乗り込んでから行先階ボタンを押し、何もしない【3秒後に自動で閉まる】
乗降客が行先階で降り、誰も乗らない、他の階からも呼ばれない【3秒後に自動で閉まる】
・応用シナリオ
足に障害のある乗降客が、降りる人を待ってから、ゆっくり乗り込む【3秒以上かかると非安全】
足に障害のある乗降客が複数人、乗り込む際に、他の階から呼ばれる【急に閉まり非安全】
・想定外シナリオ
エレベータ内で気分が悪くなり、行先階で降りられず、自動で扉が閉じたまま停電し途中階で停止
【停電時のセーフティ機能がなければ非安全】
A社 B社
× ×
××
80% 40%
(※%数値の扱いは各社にて設定)
エレベータ扉における自動開閉の想定シナリオで言えば・・・
利用特性シナリオ(仮称)の網羅性を意味する
エレベータで言えば、下記○印は「待ち時間の解消シナリオ 5W1H」で考察する
2-3)利用時の品質特性表3
19 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
【5】運用的側面Contextual Reseach、シナリオの世界ユーザセグメント、ペルソナ、利用特性
暮らし方の多様性、ここが最も重要な分析考察を要するところ
○
ユーザモデル2
ユーザモデル3
○
ユーザモデル1
○
○ △○
△ ×○
■想定シナリオメトリクス
・標準シナリオ
・応用シナリオ
・想定外シナリオ
2-3)利用時の品質特性表3(参考)
20 /30
・グッドストーリーのみで考えている設計事例
○○銀行ATM 現金投入口蓋の自動開閉設計の例
1
2
3
4
5
6
7
利用状況を観察しないと見えてこないケース
親切設計のつもりが、余計な動きに・・・
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
3.SQuaRE品質モデル活用リファレンス編
~第6章 製品品質 品質特性表~
21/30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
SQuaRE品質モデル活用 リファレンス編
第6章 製品品質 品質特性表 164 168p.
3-1)製品品質特性表1使用性
SQuaRE品質モデル活用 リファレンス編
第6章 製品品質 品質特性表 169p.
運用操作性「直接操作と間接操作の画面遷移数」
22 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
・運用操作性 直接操作と間接操作の画面遷移(Path)数
自分のお金を引き出す自分のお金を預ける他人にお金を振り込む現在の預金状況を確かめる現在の資産状況を確かめる・・・
自分の口座を指定する銀行を選ぶ支店を選ぶ口座種を選ぶ口座番号を入力する
目的の取引を成立させる必要な金額を入力する確認する
三菱東京UFJ
三井住友みずほりそな埼玉りそな・・・
赤坂赤羽板橋飯田橋宇都宮江古田荏田尾久
上石神井亀戸外苑前吉祥寺九品仏久我山京王桜ヶ丘国分寺
小平佐江戸坂下清水丘新橋神泉隅田川住吉
世田谷瀬谷外神田外堀通り雑司が谷玉川立川高田馬場
横浜群馬阿波仙台千葉・・・
縦方向:サービスを享受する(直接操作)
横方向:分割された必要情報を獲得する(間接操作)(本来は一覧したいが画面のサイズに入りきらない場合)
A
B
C
2
1
3 41
1
【直接操作の事例】 銀行ATMでサービスを受けるのに必須の操作
(引き出す、預ける、振り込む等サービスの選択操作)
【間接操作の事例】 銀行名、支店名を50音キーボードで検索する操作
(システムの都合でユーザが強いられる操作)
直接操作
間接操作
3-1)製品品質特性表1使用性
23 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
B1
B2 B3
A1
C1 1 Path
3 Path
3 Path
1 Path
1 Path
直接操作Path数 3=1+1+1
B1
B2 B3
A1
C1 1 Path
3 Path
3 Path
1 Path
1 Path
直接操作Path数 3=1+1+1
B4
3 Path
3 Path
間接操作Path数 6=3+3 間接操作Path数 12=3+3+3+3
間接操作をできるだけ少なく設計するために
同じタスクにおけるPath数で品質を管理する
【カウント例】直接操作の画面遷移を 1 Path とカウント
間接操作の画面遷移を 3 Path とカウント
A銀行 B銀行
(※Path数値の扱いは各社にて設定)
・運用操作性 直接操作と間接操作の画面遷移(Path)数
画面操作のしやすさの度合い=1-間接操作のための画面遷移数
タスク遂行のための全画面遷移数
1-6/933.3%
1-12/1520%
>
3-1)製品品質特性表1使用性
24 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
SQuaRE品質モデル活用 リファレンス編
第5章 利用時の品質 品質特性表 131p.
SQuaRE品質モデル活用 リファレンス編
第6章 製品品質 品質特性表 170 171p.
ユーザインタフェース(UI)快美性「等比級数 黄金比」「色彩学」
3-2)製品品質特性表2使用性
25 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
かたちのデータファイル Ⅲかたちの技術 Ⅲ-6 黄金分割
高橋研究室 彰国社刊 54 55p.
Φ矩形の性質
白銀数 τ= ≒2.4141+√2 1:(τ-1)≒1:1.414白銀比
黄金数 φ= ≒1.6181+√5
21:(φ-1)≒1:0.618黄金比
『日本の黄金比』といわれ、日本の建築技術(木造建築)に欠かせないものである。古くから「曲尺」という大工道具で使われてきた。また、 「法隆寺」や「雪舟の山水画」 「浮世絵」などでも白銀比が見られる。実生活においては、A4 版の用紙〔白銀長方形)が最も身近な白銀比である
A4サイズ
黄金・白銀・青銅 一数と比と形と率と一 NTT-Electronic Library Service 経済学研究 第74巻 第4号岩本誠一〔九州大学大学院経済学研究院教授〕 江口将生〔九州大学経済学府研修生・東鷹高校教諭〕吉良知文〔九州大学経済学府博+前期課程〕
・UI快美性 等比級数 黄金比
3-2)製品品質特性表2使用性
26 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
・UI快美性 色彩学 背景色と表示色<悪い例>
◆色の組み合わせの問題に注意するコントラストがほとんどないのも問題である。白地に黄色の文字や黒字に茶色の文字を想像してみるとよくわかる。「ユーザーインタフェースの設計 第2版」より
暗い背景に対して赤と青の文字を使用しない方がよい。あからさまな色の深さの違いは目障りになることもある。「GUIのお作法」より
青みの量だけが違うような近接色は使用しないこと。このような2色の境界はぼやけて見えてしまうだろう。「見せるインタフェースデザイン」より
青系統の色を互いに近付けて置くのは避ける。人間の眼は、青色で濃さだけが違うものの輪郭を認識するのは得意ではないからである。「ソフトウエア開発のためのユーザーインタフェース」より
RGB YMCK
マンセル値など
測定ツール カラー・コントラスト・アナライザー以下のサイトより無償でダウンロードすることができる。http://www.infoaxia.com/tools/cca/
3-2)製品品質特性表2使用性
27 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
SQuaRE品質モデル活用 リファレンス編
第6章 製品品質 品質特性表 172 173p. アクセシビリティ 「 WAIV 」Web Available Intellectual Verification
3-3)製品品質特性表3使用性
28 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
1:表示速度(85.71点)
2:概要の理解(50.00点)
3:完全なアクセス(56.25点)
4:ユーザーによる操作(87.50点)
5:本文の読みやすさ(75.00点)
6:適切な読み上げ(64.29点)
7:コンテンツの視認性(81.25点)
JIS X8341-3:2010 等級A 達成率(52.6%)
JIS X8341-3:2010 等級AA 達成率(62.5%)
JIS X8341-3:2010 等級AAA 達成率(54.1%)
WAIVの自動生成レポート例と測定結果
WAIV GUI
・アクセシビリティ WAIV(自動評価ツール)
3-3)製品品質特性表3使用性
29 /30
IoT時代に要求されるサービス・UI/UX品質とは? ~SQuaRE「製品品質:使用性」と「利用時の品質」を理解する~
Copyright (C) 2015 U'eyes Design Inc., All Rights Reserved.
ご清聴ありがとうございました。
30 /30
株式会社U’eyes Design 鱗原晴彦