初めまして。UIデザイングループのKです。
Figmaを使ったUIデザインやキャンペーンバナー・LPのデザインを主に担当しています。
早速ではありますが、皆さんは部署、チーム、専門分野の異なるメンバーと同じプロジェクトに携わる機会はどれほどあるでしょうか?
弊社内でもディレクター、デザイナー、エンジニア、マーケター、CS等々、様々な立場、専門の人と共同で一つのプロダクトを作っていく場面が何度もあります。その中でコミュニケーションを円滑にし、プロダクト作りの助けにもなる「オブジェクトモデル図」という手法をご紹介いたします。
オブジェクト指向UIとは?
「オブジェクトモデル図」の説明を始める前に、「オブジェクト指向UI(OOUI)」の説明をさせて下さい。
ここでいうオブジェクトとは「ユーザーが目当てにしているもの、目的」のことを指し、オブジェクト指向UIとは名前の通りユーザーが目当てにしているもの=オブジェクトを起点に設計されたUIデザインのことを指します。
現実の書店に足を運んだ時を想像してみてください。
まず目当てのコーナーに足を運び、ずらりと並ぶ本の中から気になる表紙の作品、元々探していた本を手に取りレジへ運んで会計をするというのがよくある流れかと思います。
BOOK☆WALKERストアに置き換えると、まず「本」というオブジェクトがあり、「検索する」「購入する」「読む」といった様々なアクションが発生します。
オブジェクト指向UIではこれらの情報を整理し、ユーザーが目当てとしているものがすぐ目に入り、それに続くアクションにスムーズに繋げられるようなUI設計を目指します。
対になる考え方として「タスクUI指向」というものがあります。タスクとは「本を探す」「試し読みをする」「購入する」「作者をフォローする」などのユーザーの「行動」のことを指し、それらのタスクを起点にUIを設計することを指します。
オブジェクトモデル図とは?
オブジェクトモデル図とはオブジェクトを基準にUIを考えていく上で情報を整理するための一手法です。
「オブジェクト」を起点にどんな情報があり、それに対してどんな行動が予想されるかを書き出したもののことを指します。
モデル図をどう使う?
オブジェクトモデル図は体験設計、UI設計、機能設計をするための材料の一覧とも言えます。
ディレクターであれ、デザイナーであれ、エンジニアであれオブジェクトを抜きにプロダクトを考えることはできません。
例えば、ディレクターやUXデザイナーであればユーザーストーリーや体験設計をする上でオブジェクトを通して起こるアクションの想定をしなければなりませんし、デザイナーはオブジェクトが見やすく、操作しやすいUIを考えます。エンジニアであればオブジェクトに紐づくプロパティからデータベースの設計などを行います。
なるべくメンバー全員でこの図を作ったり共有したりすることで必要な情報の洗い出しと整理ができますし、このUIでいいんだっけ?この機能でいいんだっけ?抜けているものはない?ユーザーがたどり着きたいものは何だったっけ?と悩んだ時こそこの図が役に立ちます。迷った時にこそ立ち返るより所とも言えるかもしれません。
プロダクトを作っていく上で軸がぶれてしまいそうになった時、共通した基準を持っていることで会話もスムーズになります。
まとめ
共通認識作りはチームでプロダクトを作っていく上で欠かせないものです。
チームメンバー同士でワークをしたり、情報交換をしたり手法は他にも様々ありますが、積極的なコミュニケーションを取っていく上で今回の「オブジェクトモデル図」の話が少しでも役に立てば幸いです。