見出し画像

【OOUI】〜オブジェクト抽出のムズカシさと教わったコツ〜【初心者】

OOUIについて本を読み、いざ「ちょっとやってみよう!」という時に「まずオブジェクトの抽出ってどこまでをどこまでをオブジェクトと捉えればいいの?」と四苦八苦したことありませんか?
僕もその一人です。最初の最初でつまずいてしまいました。

どうして躓いてしまったのか?の具体例と、その時に会社の先輩から教わったちょっとしたコツを自身の復習して、また同じようにつまずいてしまった人の参考になればと書き残します。

目次


つまずき①
オブジェクトって画面要素?💦

僕はこちらの書籍(著:上野学「オブジェクト指向UIデザイン―使いやすいソフトウェアの原理」)のオブジェクト指向UIデザインの実践という章を読みながら見様見真似で挑みました。
練習として既存のアプリを対象に「どれがオブジェクトに当たるのか?」を意識しつつ思いつくまま抜き出していくと・・・とんでもない量のオブジェクトが出てきてしまいました。「これもユーザーが触るし、これもユーザーが見ることになるし・・・」隅から隅まで画面の中にあるものを抜き出してしまっていました。
上で紹介した書籍の中に書かれているように

構成単位はオブジェクト=ユーザーの関心の対象物に対応させるという考え方

のはずが、いつの間にか「画面内の要素」を抜き出すのに必死になってしまっていました。

名称未設定のアートワーク 121

つまずき②
リストもオブジェクト?💦

つまずき①の続きで、画面要素を洗い出したところで「リスト(オブジェクト群)もオブジェクトとして出した方が良いのかな・・・?」と思い、書き出してみました。
そして、コンセプトマップを作成してみると「やけにキレイにまとまるな・・・」ただでさえ画面要素を抜き出してしまい多かったオブジェクトたちが、リストに紐付き綺麗にまとまってしまい、ただの画面遷移図になってしまいました。

本来ユーザーのメンタルモデルに基づいて作られるはずのマップが画面遷移図になってしまい、このマップからは本来のOOUIの力による問題点の発見ができなくなってしまいました。

リストはオブジェクトのビューの方法であってオブジェクトではないようでした・・・。

名称未設定のアートワーク 120

つまずき③
動詞がオブジェクトになってしまう💦

僕が練習の対象とした既存アプリでは『商品予約』のページがあり、新発売の商品をアプリから事前予約することができました。僕は『商品予約』というオブジェクトを抜き出し、アクションに『電話予約』『メール予約』と書き入れました。
・・・よくよく考えてみると『商品予約』自体が動詞。

ですがこの時の僕は画面要素をオブジェクトと信じて書き出していたので疑う余地もなく、コンセプトマップとして他のオブジェクトと繋ぎ合わせても違和感なく繋がってしまいました。

メンタルモデルに基づいたオブジェクトの抽出ができていると、きっとうまく繋がらず浮いてしまったと思います。

名称未設定のアートワーク 119


そんなこんなで色んなところで躓いたOO分析とコンセプトマップを会社の先輩にお見せしました。
そして以下のような助言をもらいました...👀



教わったコツ①
オブジェクトは現実世界に置き換えて考えてみる

つまずき①と②はこの説明を聞いて「ハッ!」と目が覚めました。
オブジェクト抽出の最中に「これはオブジェクトなのか?」と悩んだ時にはそれを

現実世界で考えた時に複数の使い方があるかどうかで判断してみる

とのこと。
例として『ウェブマガジン』はデジタル上では「読む」というアクションしかないが、現実世界で考えると恐らく紙でできた冊子だろう。冊子は読むだけでなく丸めてハエ叩きにも使える。

この例を聞いて「ハッ!」としました。というのも、
画面要素をオブジェクトだと思っていた僕は『ウェブマガジン』と『利用規約』どちらも同じ『読む』というアクションでオブジェクトとして抜き出していました。しかし、『ウェブマガジン』はハエ叩きに使えても『利用規約』はそもそも現実世界に取り出せない上に他に用途がない。つまずき②の『リスト』も『利用規約』と同様他に使い道はありませんでした。
オブジェクトとして抽出はしなくてもよかったのかと気づき、オブジェクト抽出の際の粒度が分かったような気がしました。

※注意:デジタルならではのオブジェクトも存在するので、必ず現実世界に置き換えられないというわけではありません!

名称未設定のアートワーク 1

教わったコツ②
オブジェクトの名称を受動態に


動詞のオブジェクトが紛れ込んだ際には「名詞と動詞を入れ替えてみる」とのこと。つまずき③で抜き出した『商品予約』も言い換えれば『予約された商品』と言い換えることができます。
たしかに『予約された商品』というオブジェクトが出来ると『電話予約』『メール予約』は『商品』へのアクションとして書かれ、アクションの結果として状態が変わったオブジェクトとして『予約された商品』を捉えることもできるのか。とこれまた「ハッ!」としました。

『予約された商品』が複数存在する場合にはリストも作成して一覧できるようにしたり、属性情報に『受取開始日時』を足してユーザーがいち早く店舗に足を運べるようにしたり・・・と色々検討できそうだなぁとワクワクします。
ユーザーのメンタルモデルに基づき正しいオブジェクトの抽出ができると、こうやって改善点が見えてくるんだろうな・・・と実感させられました。

名称未設定のアートワーク 118

感想

「なるほど〜」と納得させられたと同時に、アプリなどを見る時の自分の目のフィルターの解像度が上がったような感覚でした👀
また一人で読み進めていた書籍も改めて読むと、そういうことだったのか!と一度読んだ内容にも関わらず目から鱗な状態で一つ一つの情報に当たれました。

先輩も助言をくれる時に言葉に詰まる場面があり、暗黙知も多そうな分野だな...と思い、自分の言葉でここに書き残してみます👀また同じように悩んだ人の参考になれば幸いです!

この記事が気に入ったらサポートをしてみませんか?