OOUI を実践してみました

Gaji-Labo は「すべてのサービスとプロダクトに手ざわりのいいUIを」というビジョンを掲げ、そのための手段の一つとしてオブジェクト指向UI（OOUI）を設計します。

入社後のトレーニングとして OOUI を実践しました。今回はそこで得た学びを共有したいと思います。

オブジェクト指向UI（OOUI）とは

教科書とも呼べる書籍「オブジェクト思考 UIデザイン　使いやすいソフトウェアの原理」では、下記のように説明されています。

オブジェクト指向ユーザーインターフェース（OOUI）とは、オブジェクト（もの、名詞）を起点としてUIを設計すること。タスク（やること、動詞）を起点としたUIに比べて、画面数が減って作業効率が高まり、また開発効率や拡張性も向上する、いわば「銀の弾丸」的な効果を持つ。

「オブジェクト思考UIデザイン　使いやすいソフトウェアの原理」より引用

こちらの書籍では、オブジェクトについて「アプリケーションが扱う情報オブジェクトのことであり、ユーザーが操作するときの対象物のこと」と説明しています。タスクを起点とした UI の例では、銀行の ATM や券売機が挙げられています。

個人的な捉え方としては、オブジェクトは概念的なものであり、その粒度は人の捉え方や状況によって柔軟に変化するものとも認識しています。

どのように取り組んだか

前半に理論説明・後半に実践演習の掲載順にならって、先に前半を読んで体系的な理解を得てから後半のワークを行いました。

ワークをいくつか終えたら、ECアプリの新規開発を想定した UIデザイントレーニングの中で OOUI を実践しました。

ちなみに弊社では Miro というホワイトボードツールを活用しているため、今回もこちらを使いました。FigJam など他のツールでももちろん大丈夫です。

取り組んだ感想・学び

書籍の実践演習をやってみるのと、実際の案件に近いトレーニングで取り組んでみるのとでは大きく違いがあり、多くの発見・反省を得ました。主な内容について、下記にまとめました。

OOUI を実践するだけでは設計できない

OOUI はあくまでもフレームワークと考える必要があります。トレーニングでは、本来の目的である「ユーザーにとって心地よい UI を作ること」からたびたび意識がズレることがありましたが、もし意識から外れて OOUI の実践だけを目的にすると、途中で行き詰まることがわかりました。

自分の場合は OOUI を行う前に要件定義は行っていましたが、それだけではゴール設定が甘く、後から先輩の「そもそもユーザーの要求は何なのか？」というレビューから見落としに気づきました。ユーザーが求めていることの明確な定義によって判断基準ができるため、行き詰まることなく OOUI に取り組むことができます。

オブジェクトを画面ではなく要素として認識する

何度か画面を作った経験があるデザイナーの場合、画面に起こす前段階から既に頭の中ではイメージが思い浮かんでいるのではないでしょうか。自分も OOUI を進めながら、無意識にイメージが浮かんでいました。そのこと自体は悪いことではないと思いますが、OOUI ではオブジェクトという対象物を抽出して、それをアプリケーションの手がかりとします。

ここで自分が気をつけたいと思ったのは、オブジェクトを画面ではなく、要素として捉えることです。抽出したオブジェクトをすべて画面単位で生成するルールはなく、要素として捉えることで柔軟な画面設計を検討できます。

オブジェクトの定義が悩ましい

冒頭で個人的なオブジェクトの捉え方に触れましたが、オブジェクトの概念としてどの粒度で捉えるか、似ているオブジェクトからどれが相応しいかといった判断にトレーニング中も悩みました。

例えば ECアプリで商品購入後、その商品を家まで配送してもらうか、最寄りの店舗まで取りに行くか選べるとした場合、「購入履歴」と「取り置き情報」のオブジェクトが必要と考えていました。しかし先輩の「”注文”のオブジェクトにまとめられるのでは？」という的確なレビューから、オブジェクトを多方面から観察したり粒度を検討する必要があると思い直しました。

実際に「注文」というオブジェクトが正解かどうかはプロジェクトの目的やユーザー要求によりますが、そもそも検討までに至っていない点は反省して改善する必要があります。

最後に

ここまで読んでいただきありがとうございました。

今回得た学びや反省を踏まえて、今後も OOUI を活用して心地よい UI設計に取り組んでいきたいと思います。実際にさまざまな案件で活用すると、ワークや今回のトレーニングではわからなかった新しい発見があると思うので、その際はまた記事にしますね。