オブジェクト指向UIデザイン使いやすいソフトウェアの原理

2020年6月11日

オブジェクト指向UIデザイン──使いやすいソフトウェアの原理 WEB+DB PRESS plus

技術評論社

著者：ソシオメディア株式会社、上野学、藤井幸多
監修：上野学

はじめに

1 オブジェクト指向UIとは何か
1-1 目当ての現し
　ユーザー要求とタスク
　目当て＝オブジェクト
1-2 お金が先か，商品が先か
　明らかにおかしなUI
　テストするまでもない問題
1-3 オブジェクト指向UI
　オブジェクト指向UIの原則
　オブジェクトを知覚でき直接的に働きかけられる
　オブジェクトは自身の性質と状態を体現する
　オブジェクト選択→アクション選択の操作順序
　すべてのオブジェクトが互いに協調しながらUIを構成する
1-4 オブジェクト指向か？タスク指向か？
　対象オブジェクトを選ぶところから操作が始まる
　タスク指向UIの問題
　オブジェクト指向UIとタスク指向UIの対比
　タスク指向UIを改善するビデオカメラ画面
　タスク指向UIを改善するフードデリバリーサービス
　オブジェクトを前面に出す
1-5 UIがタスク指向になってしまう背景
　業務分析では「やること」がまとめられる
　利用手続きをデザインしようとする
　タスクに必要な情報オブジェクトを定義する

2 オブジェクト指向UIの設計プロセス
2-1 デザインプロセスのミッシングリンクをつなぐ
2-2 アプリケーションの手掛かり
　タスクを手掛かりにすると
　オブジェクトを手掛かりにする
2-3 ユーザー，タスク，オブジェクトの関係
2-4 ソフトウェアデザインのレイヤー
　UIは複数のオブジェクトを構造的に表象した合成物
　モデルユーザーの関心対象の模式
　インタラクション構造と機能
　プレゼンテーションスタイルやレイアウト
2-5 デザインの究極の目的は形である
　デザイナーのアブダクション
　一貫して作用する「原理」を備える
　道具の抽象性
2-6 オブジェクト指向UI設計の基本ステップ
　ステップ1. オブジェクトの抽出
　ステップ2. ビューとナビゲーションの検討
　ステップ3. レイアウトパターンの適用

3 オブジェクト指向UI設計の実践
3-1 オブジェクト指向UIの設計ステップ
3-2 本章でデザインするものの全体像
3-3 ステップ1. オブジェクトの抽出
　「名詞」を抽出する
　「名詞」とそれらの関係を抽出する
　「名詞」を汎化し，粒度を揃える
　「名詞」の関係性をつなげ，オブジェクトを特定する
　オブジェクトの中で「メインオブジェクト」になるものを特定する
　メインオブジェクトの多重性を特定する
　メインオブジェクトに付随するオブジェクトをプロパティとする
　コラムメインオブジェクト選びのポイント
　タスクからアクションを見つける
　コラムタスク，オブジェクト，プロパティ，アクション
3-4 ステップ2. ビューとナビゲーションの検討
　基本のビュー形式
　メインオブジェクトに「コレクション」と「シングル」のビューを与える
　コラムシングルビューとコレクションビューの省略
　コレクションビューとシングルビューの呼び出し関係を検討する
　メインオブジェクトの中からルートナビゲーション項目を選定する
　コラムルートナビゲーションの項目，アイコン，ラベリング
3-5 ステップ3. レイアウトパターンの適用
　ルートナビゲーションの配置パターン
　ビューの配置パターン
　メインオブジェクト同士の参照関係を踏まえて配置パターンを適用する
　コラムビューの配置パターン適用のポイント
　コレクションビューの表示形式のパターン
　コラムオブジェクトへのフォーカスとコレクションビュー
　コレクションの性質や用途に合わせて表示形式を決定する
　コレクションのフィルタリングのパターン
　シングルビューの表示形式のパターン
　コラムシングルビューの表示内容
　シングルビューの性質や用途に合わせて表示形式を決定する
　アクションの性質や用途に合わせて表示形式を決定する
　Create（作成）アクションのパターン
　Delete（削除）アクションのパターン
　Update（更新）アクションのパターン
　ビジュアルデザイン
3-6 タスクをどう扱うか
　タスクの特徴
　タスクはどこへ行くのか？

4 ワークアウト：基礎編
進め方
レベル1 メモアプリケーション
　ヒント・チャレンジ
　解説
レベル2 社員名簿アプリケーション
　ヒント・チャレンジ
　解説
レベル3 イベント店舗管理アプリケーション
　ヒント・チャレンジ
　解説
レベル4 会議室予約アプリケーション
　ヒント・チャレンジ
　解説
レベル5 家族で遊べる場所を探すアプリケーション
　ヒント・チャレンジ
　解説
レベル6 商品管理アプリケーション
　ヒント・チャレンジ
　解説
レベル7 商品管理アプリケーション
　ヒント・チャレンジ
　解説
レベル8 商品管理アプリケーション
　ヒント
　解説
レベル9 商品管理アプリケーション
　ヒント
　解説

5 ワークアウト：応用編
進め方
レベル10 スマートフォン用の営業支援アプリケーション
　ヒント
　解説
レベル11 イベント管理アプリケーション
　ヒント
　解説
レベル12 保険契約の顧客管理アプリケーション
　ヒント
　解説
レベル13 アセット管理アプリケーション
　ヒント
　解説
レベル14 サイト管理アプリケーション
　ヒント
　解説
レベル15 出張申請・精算アプリケーション
　ヒント
　解説
レベル16 契約管理アプリケーション
　ヒント
　解説
レベル17 通貨換算アプリケーション
　ヒント
　解説
レベル18 販売実績照会アプリケーション
　ヒント
　解説

6 オブジェクト指向UIのフィロソフィー
6-1 オブジェクトの原義
6-2 オブジェクト指向
　クラスとインスタンス
　イデア論
GUIにおけるオブジェクト
　プログラミングにおける記述法
6-3 GUI
　マン – マシンインターフェースからユーザーインターフェースへ
　インターフェースはユーザーとオブジェクトを接着する
　Whirlwind GUIという発想の原型
　SAGE 防空システムに組み込まれた最初期のGUI
　Sketchpad グラフィック言語による対話型コンピューター
　NLS 知的生産活動のためのコンピューター
　Smalltalk 誰もが使えるパーソナルコンピューター
　TUI テキストベースのUI
　Star GUIベースのビジネス用ワークステーション
　Macintosh 商業的に成功した最初のGUIシステム
　iPhone パーソナルコンピューターの新しいフォームファクター
　メタメディアとしてのオブジェクト指向UI
6-4 モードレス
　モードレスネスを信奉しなさい
　ラリー・テスラーテキスト編集のモードレス化
　ドナルド・ノーマンモードエラーの分析
　ジェフ・ラスキンモードレスにすることで劇的に使いやすくなる
　モードレスにする方法
6-5 オブジェクト指向UIについての文献
　『Object-Oriented User Interfaces and Object-Oriented Languages』
　『Object-Oriented Interface Design』
　『Designing Object-Oriented User Interfaces』
　『The Elements of User Interface Design』
　『Designing for the User with OVID』