オプトの広告効果測定ツール『ADPLAN』の大幅リニューアルに貢献したUI/UXデザインパートナーの関わり方【前編】

インターネット広告代理店のオプトが手がける、ネット広告の効果測定・分析ツール『ADPLAN』。

同サービスは、インターネット黎明期の2000年にリリースされたもの。時代のニーズにあわせて変化を重ねてきましたが、変化が激しい時代背景に伴い、2015年4月より全面リニューアルプロジェクトが開始。2017年1月に『ADPLAN』の新バージョンがリリースされました。

rootは、今回のリニューアルプロジェクトにおいて、管理画面のUIデザインやロゴにはじまり、クレドやプレゼン用スライドのテンプレートに至るまで、広範のデザインを担当。デザインパートナーとしてプロジェクトに携わらせていただきました。

今回、本リニューアルプロジェクトを担当された、ADPLANプロダクトマネージャー・宮本舜さん、ADPLAN開発チームマネージャー・貴田淳司さんをお招きし、root西村、古里を加えた4名でプロジェクトの振り返りを実施した様子を2回に分けてお届けします。

デザインを共につくっていける、パートナーが必要だった

（株式会社オプトADPLANプロダクトマネージャー・宮本舜さん）

宮本さん：
ADPLANは、オプトの成長を支えてきた歴史のあるツールです。

長い歴史のなかで幾度も機能拡張を行ってきましたが、デジタルマーケティングの多様化や、近年のブランディングを目的とするプロモーションの増加に伴い、従来のツールではデジタルプロモーションにおける効果の最大化が困難になってきていました。このような変化に対応するため、リニューアルを行うことになりました。

リニューアルプロジェクトが始まったのは2015年の4月頃。私はリニューアルプロジェクトが決定した段階で別部署から異動し、ジョインしました。

西村：
rootが関わらせていただいたのはプロジェクトの途中からだったかと思いますが、デザインパートナーが必要だと思われたのはどういった経緯からだったのでしょうか？

宮本さん：
rootさんにご相談したのは2016年の1月頃でした。当時は必要な機能をベースにしてアルファ版を作成した段階だったのですが、ここから製品版を開発していくにあたっての進め方で悩んでいました。

社内にプロダクト開発の知見がそれほどなく、UXを考え、デザインを行う必要があることはわかるけれど、何から考えればいいかわからない。

当然、我々の方で要件定義して、デザイナーに依頼することすらも難しい。だからこそ、一緒に作っていけるパートナー的立場の方が必要だと考え、パートナー探しを始めました。

西村：
たしかに、社内に開発の知見が蓄積されていない状態で、プロダクト開発を円滑に進めていくことは難しいですよね。デザインパートナーはどのように探されたのでしょうか？

宮本さん：
社内には貴田も含めバックエンドのエンジニアが多数在籍しているので、業界の評判をベースにエンジニアのネットワークを駆使して探していきました。

貴田さん：
西村さんが『Startup Weekend Tokyo』に登壇されたときに、社内のエンジニアが参加していまして、rootさんのことを知っていました。その時のつながりからの紹介でした。

宮本さん：
パートナーを探す過程で、他の会社も含め何社かあたりました。西村さんとお話したところ、我々の求めていた「デザイン視点から一緒に事業を作っていっていく」サービスを提供していることや、継続的にPDCAを回し成長支援していくハンズオン型の進め方が我々のニーズに合致していると感じ、rootさんにお願いさせていただきました。

デザインで事業側と開発側のズレをなくす

（株式会社ルート代表取締役 西村和則）

西村：
パートナーに選んでいただいてスタートした今回のプロジェクトでは、バックエンド側とフロント側の設計が同時並行していました。最後、バックエンドとフロントの設計を組み込む段階での整合性や認識の調整に力をかけましたね。

宮本さん：
そうですね。アルファ版ではまずは動くものを作って直していくという方針で始めたので、その改修がここまで重い作業ということは想定外でした。事業側からすると「ちょっと変えるだけじゃないの？」と思う部分も、開発側にとっては大きな変更になる部分も多く、デザインを先行して考えることの重要性を痛感しました。あの瞬間は「rootさんに最初から入ってもらっていれば…」と思いました。

西村：
具体的な骨子となるレイアウト設計や、操作に対する要件が組み込まれていなかったのが、事業側と開発側のズレが生まれた大きな要因の1つでしたね。

貴田さん：
開発側がアルファ版の画面を作っているときには、「これにかっこいいデザインがあたる」と思っていたんですよ。

（株式会社オプト開発チームマネージャー・貴田淳司さん）

西村：
最初は私もそう思っていました（笑）相談をいただいた際にも、今組まれているものにデザインを当てていくというお話で、開発的に言うとCSSレベルの変更を考えていました。しかし、当初はナビゲーション構造やレイアウトが利用者のプロセスを踏まえた設計になっておらず、そこを組み直さないと、そもそもデザインをリニューアルできないという結構大きな課題があることが分かりました。

宮本さん：
最終的に、設計の見直しも行うことになりましたね。改めて画面設計を行う際には、rootさんに入念にヒアリングして頂きました。

西村：
最初に実際の業務オペレーションや、関わる人はどのような人かをヒアリングしました。オペレーターはどのような操作をするのか、コンサルタントならどのような操作か、広告主が関わる部分はどこかなど。要素を整理することで、画面の中で操作する人の割合や、機能のプライオリティが決まってくるので、それらを加味して画面の設計やデザインに落としていきました。

貴田さん：
現行バージョンの画面を見たり、実際に触ったりといった検証もされたんですか？

西村：
もちろんです。一通り触って、分かりづらいポイントを整理しました。今回の場合、新しく入れる機能や目的も加味しなければいけなかったため、ベースとなる部分や、プロモーションレポート画面などは時間をかけて組み立てていきました。

宮本さん：
現行バージョンでは、長い歴史の中で活用されなくなっている機能もありました。機能としてコアな部分以外の設計やデザインはなるべく現在の仕様に引っ張られずに変えていきたかったので、ドラスティックに変更する方針で進めていただいたのは良かったですね。

古里：
様々な箇所が新しくなったかと思いますが、変わった部分で特に印象的に残っているのはどの部分でしょうか？

宮本さん：
ADPLANには、広告の効果を計測するために使う、URL発行のフローがあります。アルファ版の時には、各階層ごとで1つずつURLを発行していくフローだったのを、1つの画面で発行できるように変更されたのは使いやすくなったなと思いました。

西村：
URL発行のフローの機能変更は、実際に操作する人のオペレーションを検証するなかで、出てきた課題でしたね。

貴田さん：
アルファ版を作ったときは、機能要件にもとづいて作られたAPIの動作に合うように画面を作っていったので、新しいデザインを見たときは、開発側も「なるほど！」という感じでした。

開発体制の内製化を進める

古里：
当時、オプトさんは開発体制を内製化している途中だったと記憶しています。

貴田さん：
そうなんです。現在もですが、エンジニアの採用強化を図っている真っ最中で、新バージョンのADPLANも開発メンバーのほとんどが直近オプトにジョインされた方ばかりでした。また開発進行中にジョインする方もいらっしゃいました。私もそのひとりです。

古里：
なぜ内製を進められていたのでしょうか？

宮本さん：
近年のデジタルマーケティングを取り巻く環境が変化しています。めまぐるしいユーザーニーズの変化に応えるためには頻繁に要件変更をし、作っては壊すことを繰り返す必要性があります。また、直近ではVRやIoTに代表される新たな事業ドメインが発生することも多く、常にR&Dが必要となってきている。こういった背景からエンジニア部門を拡大し、開発を内製する体制を整えるという方針となっていました。

西村：
開発を内製化するにあたっては、どういった課題がありましたか？

宮本さん：
やはりコミュニケーションの難しさが大きかったですね。、これまで一緒に仕事をする機会も少なく、同じ社内にいるにも関わらず、「初めまして」という状態だったこともありますが、事業側の人間と開発の人間が視点を合わせて事業を作る際に、どのような進め方をするべきかがお互いに固まっていなかった。事業側と開発側の視点のずれが、当初かなり大きかったと思います。

西村：
確かに、一緒にプロジェクトを進めていくなかでも、主体性やチームとしての動き方がまだ完成していないのは感じました。
私たちが関わり始めた最初のフェーズで見えてきたのが、実際にプロダクトが形になったときに認識のずれが生じやすいという問題でした。当時はテキストで書かれた仕様に沿って、コードを書いていることがほとんどでした。
そこでデザイン側として、ワイヤーやモックを作るプロセスを入れ、目に見える「もの」をベースに認識をすりあわせられるようにしました。

宮本さん：
そうですね。関わる人数も多かったため、目に見える「もの」は非常に重要だったと思います。あそこでワイヤーやモックを作ったからこそ、以前より具体的に話をできるようになったと思います。機能の要不要であったり、機能の追加に伴う仕様変更なども、実際のものがある状況で話すと、認識の齟齬が起こりづらいなと改めて感じました。

（株式会社ルート UIデザイナー 古里）

古里：
議論の対象が見えない中でのディスカッションとなると、人数が増えるほど各自が抱いているイメージがずれてきてしまいます。ワイヤーやモックなど目に見えるものを作り、それをベースに認識をすりあわせることで、より建設的な議論が可能になります。デザインを間に挟むことでステップは増えますが、手戻りが減ると考えれば、コストも時間も抑えられる。スピーディーな意思決定が求められる場面こそ、デザインは必要になるはずです。

後編はこちらから
チームの関係性をも変えるデザインの役割。オプト『ADPLAN』におけるデザインパートナーの関わり方【後編】