「オブジェクト指向UIデザイン──使いやすいソフトウェアの原理」を読んだ #1

UIデザインの名著と呼ばれているオブジェクト指向UIデザイン──使いやすいソフトウェアの原理を読んでいるので、読んで学んだことや所感などを簡単にまとめます。

これまでデザインのことをしっかりと学んだことなかった自分がこの1冊を1つの記事にまとめることは難しいと判断したので章ごとにまとめていきます。

オブジェクト指向UIの原則

・オブジェクトを知覚でき直接的に働きかけられる

・オブジェクトは自身の性質を状態を体現する

・オブジェクトの選択→アクション選択の操作順序

・すべてのオブジェクトが互いに強調しながらUIを構成する

「オブジェクト指向UIデザイン──使いやすいソフトウェアの原理」P.11より引用

オブジェクトを知覚でき直接的に働きかけられる

オブジェクト（ユーザーの操作対象）がアイコンや入力フォームなどの”形”を伴って画面上に並べられます。

オブジェクト指向UIは自分たちが日常的に作業するときと同じように、対象物が見えていて、それを触ることができ、作業の結果を対象物の変化として常にその場で確認できます。

オブジェクトは自身の性質を状態を体現する

アプリケーション内に存在するオブジェクトが今どのような状態になっているかを視覚的に理解することができることが重要です。

例えば、間違えて消してしまわないように保護した写真のアイコンに”鍵マークがついている”とこの写真（というオブジェクト）は保護されている・鍵がかかっているとユーザーが理解できます。

他には、例えば何かの書類をアプリケーション上の承認フローに乗せて申請したとき、その書類データには「申請中」や「承認待ち」などのステータスが付与され、それが画面上に表示されていることが良いです。

また保護している写真の保護を外すという操作をとると、鍵マークがなくす（見た目を変える）ことでユーザーに操作の結果をフィードバックを示します。

オブジェクトの選択→アクション選択の操作順序

オブジェクト指向UIでデザインされた画面上でのユーザー操作は「オブジェクトの選択→アクション選択」です。

前述した

オブジェクト指向UIは自分たちが日常的に作業するときと同じように、対象物が見えていて、それを触ることができ、作業の結果を対象物の変化として常にその場で確認できます。

のように、現実世界でスーパーで買い物をするときも

の順序で人間は行動を起こします。

間違っても、空のかごをレジに持っていき、店員をお金を払ってから買うものを探しに行くという行動はとりません。

すべてのオブジェクトが互いに強調しながらUIを構成する

オブジェクト指向UIにおいて、画面を構成する要素は全てオブジェクトとしては何かを表現しています。

その各オブジェクトが論理的な空間構成、視覚的ゲシュタルトの法則に従って配置されます。

この辺はオブジェクト指向UIという文脈を除いても画面をデザインする上で基本的なことでありとても大切なことですよね。

オブジェクト指向UIとタスク指向UIの違い

原則にもあるとおり、「オブジェクトの選択→アクション選択」で操作することができる画面はオブジェクト指向UIです。

典型的なタスク指向UIでデザインされたものはソフトドリンクの自動販売機です。

自販機ではまずはお金を入れるというアクションを起こしてから書いたいジュース（オブジェクト）を選びます。

自販機は最近はSUICAなどの電子マネーで購入できるようなっていますが、電子マネー決済ではジュースを選んでからスマホなどをかざすことで購入できるのでオブジェクト指向UIになっています。

駅の自販機とかで電子マネー決済でお茶を買ったとき、買いやすかった記憶があります。

タスク指向UIでデザインされた代表的なものに自販機の他にATMの操作画面がありますが、これは操作対象（オブジェクト）が口座で限定されている（＝オブジェクトを選択する必要がない）ので、タスク指向UIが許容されていいます。なるほど。

モーダルとモードレス

モーダル（モードがある）、モードレス（モードがない）についても自販機を例にして解説されています。

現金でドリンクを買う場合はモーダルです。

お金を入れた時点で「商品選択モード」に入ってしまうので、購入自体をやめるためにはお金を戻してもらうために返却レバーを押さないといけません。

タスク指向UIはモーダルであることで、操作の自由度を奪い、余計な手続きを発生させてしまいます。

電子マネー決済の場合はモードレスです。

ドリンクを買おうとして商品を選んだけど、購入をやめようと思った場合はその場から立ち去るだけで良いです。

モードレスであることがオブジェクト指向UIの優位性の本質です。

最後に

まだ1章（320ページ中の30ページほど）しか読んでいないですが、かなり学びが深かったです。

オブジェクト指向UIとは何か？のベースを理解できたことで、現在のプロダクトマネジメントの仕事に活かせますし、他のサービスを使うときにどこにどのようにオブジェクト指向UIが適用されているかを見ることを楽しめそうです。

自販機で現金を使ってドリンクを買うのがタスク指向になっている背景は調べようと思います。