リバースモデリングやってみたよというお話
この記事は、bellFace Advent Calendar 2021 の16日目の記事です。
はじめに
はじめまして。ベルフェイス株式会社でデザイナーをしている高井と重見です。今日は 2人の共著でお送りいたします。
高井は、ベルフェイスに 2020年6月に入社し、もう1年半になります。プロダクトにワクワクしたのと「フロントエンドとUIデザイン両方担当できる人歓迎です！」の募集を見て「自分が活躍できる場所かも💡」と思い入社しました。
重見は、2021年 3月入社で9ヶ月になりますが、入社前から業務委託として関わっていたので、ベルフェイスとはもう 2年半ほどの付き合いになります。プロダクトに可能性を感じたのと、業務委託で携わっていくうちにもっと関わっていきたいと思い、ちょうどタイミングが合い入社しました。
私たちの所属する Designチームは、プロダクトグループのプロダクトディビジョンの中にあります。現在、業務委託を含めて 4人ほどのメンバーで、プロダクトである bellFace のデザインをしています。
いろいろと試行錯誤できるチームだと思っていて、今期に入ってからも、ペアデザインやユーザーテスト、業務に関連する自由研究の時間を設けるなどを試みました。そして、今回新たな試みとして、リバースモデリングをすることになったので、その話を書きたいと思います。
リバースモデリングとは？
即ググりましたね（笑）
もともとリバースエンジニアリングから派生した言葉のようなので、リバースモデリングとしてはあまり情報がなかったのですが、次の Goodpatch さんのブログがヒットしました！
この記事によると、リバースモデリングとは、
ある視点／観点で既存のアプリケーションやサービスなどの完成形から、構造のレイヤーまでを遡って観察・分析することによって、対象物の構造を明らかにし、対象物を0から作り出す上でのアプローチや最適な方法の理解を深める手法
とのこと。
なるほど。普段のデザイン工程を逆から考えて分析することで、その対象物がより深く理解ができる方法ってことですね。そこから気づきを得て、自社のプロダクトに活かすってことですね！
ちなみに、この Goodpatch さんの記事には、リバースモデリングの観点や UIトレースとの違いも書かれていて、とてもわかりやすい記事でしたので、興味のある方はぜひ読んでみてください😊
なぜリバースモデリングをやろうと思ったのか？
ひとことで言うと、デザインのスキルアップのためです。
「はじめに」にも記載しましたが、Designチームはいろいろと試せるチームです。スキルアップとして自由研究の時間を設けており、そこで試したことや学んだこと、イベント参加にて得たもの等をメンバーとシェアする場として、LT大会を月に1回ほど行っていました。その名も「ナレッジ共有☆LT大会」。毎月みんなが持ちよるテーマはどれも興味深い内容で、そこから議論が生まれ、とても愉しく学べるものでした。
ある日、Designチームのマネージャーである クマさん 吉本さん🐻が言いました。
「デザインのスキルアップには、はちみつ...じゃなくて、リバースモデリングがいいのでは！」
実は、Designチームには顧問をしてくださる方がいます。理論的にデザインをするためや、個々のスキルアップとしても、リバースモデリングが適してるのではないかとのことで提案いただいたそうです。
私たちは、それぞれが担当するプロジェクトでデザインをするので、プロダクトとしての統一感を保ったり担当外のプロジェクトとのバッティングなどを避けるために、チーム内でレビューを行ってきました。レビューは、5ヶ月ほど前まで Slack の投稿かミーティングを設けて行っていましたが、今年の7月から Notion でタスク管理し始めたのをきっかけに、担当デザイナーが Notion にデザインの経緯を書き、それをもとにレビューするようになりました。実際にデザイン経緯を書こうとすると、より理論的に説明をする必要がでてきたのです。
そこで早速メンバーに「リバースモデリングやってみたい」と投げかけたところ「とりあえずやりたいです！」と賛同いただき、晴れて開催することになったというのが事の経緯です。
当日までの弾丸スケジュール
開催するのは決まったけど、あれよあれよと師走になってしまい、弾丸スケジュールになってしまいました。このスケジュールと並行して当然 bellFace のプロダクトデザインを進めており、皆テンヤワンヤです。
- 11/18： 開催決定
- 11/30： リバースモデリングの計画シェア
- 11/30 〜 12/3： なんのサービスにするか Slack で宣言
- 12/6 〜 12/13 13:00： Figma に作成
- 12/13 13:00 〜 12/14 12:00： Figma にコメント
- 12/14 12:00 〜： リバースモデリングランチ🍴
- 12/16： アドベントカレンダー
第1回だけど YWT で振り返ってみた
やったこと
参加者の多くがリバースモデリングを正しくやってきたわけではないので、とりあえずひとつアプリを決めてそれを分析してみたよーって感じですね。この YWT には記載されていないですが、テーマ決めまでの間にも色々やりとりをしており「せっかくだから bellFace のプロダクトデザインを行う際に参考にしやすいもの」とか「Web よりネイティブアプリの方がデザインの参考になるかも」など、さすがデザイナーの集まり、なにかしら法則・方向性を決めたくなるものですね（笑）
このようなやり取りもあったことから、安易にテーマを決めるのではなく、目的に沿ったテーマ決めを行うことは大事だなと思いました。実際にテーマ決めした理由も皆さん簡単に書かれており「なるほど、bellFace ってそういうところを参考にできるのか」と勉強になって良かったなと思いました。
あと「タイトなスケジュールで設定してみた」って記載されており、コノヤロー！って思いましたね 👊
分かったこと
「表層・骨格・構造」をイメージでは知っていたが、メンバーの分解を見て、具体的にどのような状態のものなのかが分かりやすかったです！
振り返ってみると、リバースモデリングを始める前にどのようなアウトプットにするのか？とイメージできていなかったこともあり、実際に手を動かしてやってみることで血肉になった感じがあります。
ちなみに、イメージできていないと記述しましたが、一応 OOUI 本とかを読んで「これの逆をすればリバースモデリングだな」など雰囲気は分かっていました。でも実際にやると、構造まで抽出した時に結論となるものをどう導く？みたいな感じで、オブジェクトの抽出条件については結構話が盛り上がりました。オブジェクトの捉え方は人によって違いそうで「ユーザーのメンタルモデル」の定義が必須だなと思いました。
加えて、テーマ決めする際にも、bellFace のプロダクトデザインに活きるやつやるぞ〜って言ってましたが、やってみてやっぱり活きる！って感じられました。1プロダクトに対しても、人が違えば考察も違い、とても面白い会になりました。また、bellFace はタスク指向になっている部分が多く、これをオブジェクト指向にするとどのような構造になるのか？構造から見るとユーザーのプロセスはもっと改善できるのか？など有益なものがどこにあり、今後のプロダクトデザインにどう活かせるのかを見渡すのに良かったです💡
ベルフェイスは業務委託も多く参画していますし、組織構造の再編などを行ってきた関係もあり、プロダクトに対しての前提知識であったり、全体像を把握するのに OOUI は便利だなと感じました。
次やること
またリバースモデリングやるぞー！ってことは決まりました。OOUI などモデリングの概念を取り入れることでチームとしてさらに成長できることができ、今後も活用していきたいと思います。
おわりに
最後まで読んでいただきありがとうございます！初の共著という形でアドベントカレンダーやってみましたが、これも面白い体験だったなと思いました。一人で書くより筆が進む！すごい！
というのは置いておいて、相変わらずバタバタしながらリバースモデリングもアドベントカレンダーもやってみましたが、やってよかった。皆のデザインに対する考え方や想いを知れる良い機会になったなーと思いました。スキルアップに繋がっている感覚もあります。今回はリバースモデリングとは？って感じから入ってましたが回を重ねて乗りこなしたいですね、このリバースモデリングを。
そしてなにより、こうやって一緒に試したり議論して、より良いアウトプットに繋げていける仲間と仕事をできるのが、とても嬉しいことだなと改めて感じました！
絶賛デザイナー募集中です！
UI刷新やデザインライブラリを作りたいあなた！そういう仕事がありますので、一度求人内容をご確認されてはいかがでしょうか。
Meety からのカジュアル面談も受付していますので、興味のある方はぜひ突撃ください！
さーて、明日の Advent Calendar は？
bellFace の System Gr のリードエンジニア 枝さんによる、技術系のお話しです。おたのしみに！
Discussion