"Cacoo フルリニューアル記念イベント「新しいUIが生まれた背景とその経緯」"に行ってきました

Tech

開発divのガミです。
弊社では今、既存製品のリニューアル版を開発中です。 そんな中、先日行われたヌーラボさんのオンライン作図ツールサービス「Cacoo」がフルリニューアルしたので、どういった経緯、手法によって開発されていったのかというのにとても興味があり参加してきました。

nulab.connpass.com

構成としては二部構成で一部がCacooのプロダクトオーナーによってCacooのUXとその導入についてのスピーチがあり、二部は新機能についての スピーチでした。 新機能についてはここで説明するよりCacooの公式HPを見た方が早いので、主に一部について得た知見を書いていきます。

UXについて

一部の半分はUX自体についてのお話でした。
私自身、UXについて正直、より良いUIによって生み出されるユーザー体験というぐらいのイメージでした。
しかし、この

「顧客が欲しいのは4分の1インチのドリルではなく、4分の1インチの穴である」

プロダクトオーナーが紹介してくれた、マーケティング界では有名らしい格言のおかげで理解が進みました。

「手段」と「目的」の話と言うと、今ではありふれた言葉になりますが、それをデザインとして意識することがUXの入り口という感じになるのでしょうか。

上記についての具体的な例として、もしATMのUXを改善するならというのを挙げていました。
ATMを「お金を引き出せる機械」として捉えてしまうと「決定ボタンの色を赤にする」、「画面遷移の導線を分かりやすくする」というようなことが改善になります。
しかし、ATMを「お金を引き出す」ことができる機械、つまりお金を引き出すことを目的として捉えると、例えばどこでもお金を引き出せるということが改善となり、「オンラインバンキング化」といったことが改善となります。 前者はUIの改善。後者がUXの改善です。

同じようにCacooという製品の目的は図を描くとであり、どんなツールを用意するかより、何故図を描くのかといったところがUX改善の入り口です。 あくまでも利用者視点に則り、UXのリサーチの専門家によって各種リサーチ手法（ユーザビリティテスト、ABテスト、一人一時間のインタビュー ）が実施され、UXを固めていったそうです。
ここに専門家に頼らなければ導き出せないUXの難しさがあると思います。。

UXが求められる背景として、時代的に「モノ（機能）の消費からコト（体験）の消費へ」という時代の流れが存在します。 らくらくスマートフォンなどはその最たるもので、機能を削ることで今までスマートフォンに触られるなかったレイヤーに対して新しい体験を提供することができました。

機能の追加より使いやすい、誰でもわかるを重視する時代、弊社の製品であるHubはそういう意味ではUX重視の製品です。 従来の複雑なBIツールから、本当にユーザーが求めるものを抽出し、シンプルに分かりやすいというユーザー体験を届けることを目的にしています。（宣伝

Cacoo全体を通したユーザー体験を再定義・再構築

UXのリサーチの結果、以下に列挙した問題点を洗い出していました。

  • 主要タスクの阻害要因を解消
    • ・図の保存の必要性
    • ・図を作るまでのステップ
    • ・図の閲覧画面と編集画面が分離していることの混乱

.

  • 心理的な印象を改善
    • ・時代遅れなルック＆フィール
    • ・過度にカラフルな装飾
    • ・複雑に見えるアイコンやフローティングレイアウト

.

  • 新規ユーザーが素早く理解でき効率的に使える
    • ・やりたいタスクと関連するUIがわかりにくい
    • ・すぐに利用方法を理解できるドキュメントやヘルプ不足

.

  • コラボレーションの強化
    • ・コメント機能やチャット機能が不十分
    • ・共有関連の設定やUIが散乱している

.

上記の中にはUIの改善についても入っていますが、 「UI ⊆ UX」でもあるので、UIの改善もUXの改善に繋がります。

おそらく、Cacooを開発、利用している人には上記問題に気付いている人も多くいたと思います。しかし、問題点としてのエビデンスがなかったため、また改善するにしろ何が正しい「形」であるかのエビデンスがなかったため、今まで手をこまねていたのでしょう。 CacooのUXをリサーチすることで、そのエビデンスを埋め、プロジェクトが動き始めることができたのだと思います。

アーキテクチャ改善

何故アーキテクチャまで改善したという理由として、「より早い改善や新機能の提供、高可用性につながるため」という点を挙げていました。
投資としてアーキテクチャを改善することで、将来的なUXへの投資に繋がるということになります。

実際に、CacooのFlash版はFlashの技術者自体が少ないため現在一人で開発し、サービス開始8年間抜本的進化はいないというお話を聞きました。
2年間で開発したHTML5版は現在6人の開発者で開発しており、技術者も増え開発速度がだいぶ上がったことで 新UIは8か月で開発できたとのことでした。

新UIではさらに、 モノリシックなJavaアプリからマイクロサービスへ(Microservice + gRPC)の変更、フロントエンドを「Vue.js + GraphQL」への変更など行いアーキテクチャの改善を推し進めていました。
(Vue.js + GraphQLの下りはもっとお話しをお聞きしたかった…！)

Cacooは今回のフルリニューアルによって、本当にシンプルに、直感的に操作がしやすい構成になっていると感じました。 それはUXをしっかりと意識し、リサーチの主導をしていったプロダクトオーナーのリーダーシップと、それを実際に実装できる開発チームの技術力の高さが成せるものだと思います。
同じように弊社製品でもユーザーにシンプル・わかりやさという点を伝え続けられることができるように、改善を続けていきたいです。