Datadog社のエンタープライズプラットフォーム構築を支える、Figmaを活用したデザインシステム拡張

Datadog社はこの数年間で急成長を遂げながら、真のマルチプロダクトプラットフォームを構築した数少ないエンタープライズSaaS企業の1つです。同社の成功を担うのが製品部門です。デザイン担当VPのStephen Boak氏、スタッフプロダクトデザイナーのDerek Howles氏、製品とエンジニアリングのチームメンバーは、拡張可能な製品開発プロセスの構築に重点を置き、すべての製品にわたって統一されたエクスペリエンスを創出して、早い段階からPDEチーム間の有意義なコラボレーションを促進してきました。FigmaとFigJam、そしてDatadog社の社内デザインシステムDRUIDSが、この戦略の鍵となりました。
スナップショット
- 業種: ソフトウェア
- セグメント: エンタープライズ
- エディション: エンタープライズ
- 節約された時間: 週あたり100時間
- 製品: Figma、FigJam
- インテグレーション: GitHub
Datadogは、クラウドアプリケーションには不可欠な監視・セキュリティプラットフォームであり、企業のシステムの保護、ダウンタイムの回避、ユーザーエクスペリエンスの向上を支援します。Datadog社のソリューションの主なユーザーは、技術的に高度な問題を解決するエンジニアです。Datadogでは、ユーザーが極めて高密度のデータを合理的な方法で視覚化し、理解できなければいけません。それは、デザイン担当VPのStephen Boak氏と自身のチームにとって、楽しくも難しい課題です。
Datadog社がマルチプロダクトSaaSプラットフォームを構築した数少ない企業の1つであることは、データが実証しています。2019年に同社が上場したときの年次経常収益は3億3,000万ドルで、取り扱い製品は数種類でした。現在、同社の年次経常収益は15億ドル超、製品数も15を超えており、前年比成長率最大70パーセント、売上維持率130パーセントという継続的な成長を示しています(これほどの成長を達成しているのは、ごく少数のテクノロジー企業のみです)。Datadog社の成功の要因の1つが、真のマルチプロダクトエンタープライズプラットフォーム構築による、急激な成長です。 実際に、同社の顧客の80パーセントが、同社製品を2つ以上使用しています。
Datadog社のビジネスを支えるのが、次の重要原則です。
- 効率性と拡張性を最優先した製品開発プロセス
- 広範なプラットフォームを構成する全ソリューションにおいて一貫したユーザーエクスペリエンス
- 製品マネジメント担当者とエンジニアリング担当者の、強固かつ早期のコラボレーション
- コンスタントなMVP (顧客のニーズを満たす最小限のプロダクト)と早期のイテレーションサイクルによる、顧客からの初期フィードバックに基づく迅速な製品改善
しかし、彼らの成功は一夜にして成し遂げられたものではありません。Datadog社のプロダクトチームは、このアプローチの可能性を最大限に引き出すために、拡張可能なデザインと製品開発プロセスを構築する必要がありました。
成長に伴う痛みと製品開発プロセスを拡大する必要性への気づき
2016年、Datadog社はマルチプロダクトカンパニーへのシフトを開始しました。同社では製品シリーズの継続的な拡張という壮大な計画を立てていましたが、数年のうちに、デザインチームとエンジニアリングチームは問題に気づき始めました。「私たちは、デザインプロセスにおいて、短期間で成長を遂げている他の多くの企業と同様にハードルにぶつかり始めていました。すべてのUIコンポーネントやバリエーションを全員が覚えることができなくなり、表現の統一が図れなくなるという状況になったのです」とスタッフプロダクトデザイナーのDerek Howles氏は語ります。
Datadog社のエンジニアはこれまで、表形式のデータの表示、検索とフィルタリング、時間範囲の選択、ドロップダウンメニューからのオプションの選択など、コアパターン用のコードを繰り返し複製しなければなりませんでした。再利用可能なコンポーネントがなく、異なるコンテキストや動作を持つ製品ごとにソリューションを拡張しようとしたため、製品開発は困難に陥りました。
デザインチームとエンジニアリングチームの関係とコラボレーションプロセスも、理想とは程遠いものでした。どちらのグループも、作業の複製や、プロジェクトの引き継ぎにおける共通理解に多大な時間を費やしていました。デザインプロセスへのエンジニアリング参加が遅れたために、製品リリースが大幅に遅れたこともありました。
その結果、Datadog製品の成長や顧客からのフィードバック対応に多くの時間を費やすことができませんでした。
優れたマルチプロダクトビジネスの構築には「接続性」が必要
最も重要なことは、Datadog社が製品シリーズすべてにおいて、使いやすく信頼性の高いエクスペリエンスの構築をしたいと考えていたことです。同社にとっては、顧客がどの製品を使用しているかに関わらず、Datadogプラットフォーム内を移動する際に、一貫して優れたエクスペリエンスを享受できることが重要でした。
Boak氏はそれを「一貫性というより接続性」と呼んでいますが、これを大規模に実現することは非常に困難です。テーブルデータへのドリルダウンや時間ごとのログのレビューなどといった標準的なユーザーインタラクションは、コンテキストによって動作がわずかに異なる場合でも、プラットフォーム全体において再利用可能で使いやすいものでなければなりません。「プラットフォームUXでは、顧客が製品内で経験する動作を学習します。一度学習したら、それを繰り返します。そしてそのUXは、さまざまな製品を通して繰り返し可能な動作となります」とBoak氏は説明します。
この新しい手法は非常に効果がありましたが、今度は、迅速に行動し、繰り返し、新しい機能をリリースすることが困難になりました。
DRUIDS: 大規模でも機能する製品開発プロセスの構築
Howles氏と数名のエンジニアリング担当者は、この接続性を拡張し構築するために、デザインシステムの基礎を築き始めました。当初は簡単にはいきませんでしたが、迅速に製品を市場に投入し、プロトタイプやMVPに対する顧客のフィードバックを集める方法を見つけることができました。
「コンポーネント、デザインシステム、ボイラープレートを使用して、Datadog製品共通のユーザーエクスペリエンスを構築しています。その結果、MVPを短期間で市場に投入し、顧客からの貴重なフィードバックを得ることができるのです」とBoak氏は語ります。
Datadog社は、Figmaとそのデザインシステムを使用することで、プロトタイプあたり10時間、週あたり約100時間を節約することができました。ビジネスケースは明確でした。
同社はデザインシステムの構築へと進み、その結果として生まれたのがDRUIDSです。これは、デザインレイヤーとしてのFigmaと、それらに対応するGitHubに収められたコードを組み合わせたものです。DRUIDSはできるだけエンジニアリングが使いやすいように構築されており、各種ステートやバリエーションは対応するドキュメントで詳しく説明されており、とても洗練されています。

FigmaとFigJamがプロダクトチームをひとつに
Datadog社のプロダクトチーム全体(プロダクトマネージャー、デザイナー、エンジニア)が、製品開発プロセスを通じ、FigmaとFigJamを使用して共同作業を行っています。プロダクトマネージャーとデザイナーは、FigJamでアイデアの創出、ユーザーフィードバック対応、ブレインストーミングを開始します。デザインが具体化され、構築されると、Figmaに移行し、エンジニアとデザイナーによる頻繁な共同作業が繰り返されます。

次に、デザインはDatadog社のDRUIDSデザインシステムに接続され、関連するコードと照合された後に、リリースされます。プロセスの最後には、レビュー、製品の批評、モックアップのコラボレーションが、すべてFigJamで行われます。「FigJamはデザインプロセスのすべてにおいて、当社のリーダーたちが可視的に確認し、フィードバックを行えるシンプルなソリューションです」とBoak氏は述べています。
Datadog社の効率性は、Figmaのオープンプラットフォームを使用して構築したプラグインからも恩恵を受けています。同社が構築したプラグインは、あらゆるコンポーネントを即座にダークモードに切り替えるものや、適切なユーザーテストを行うための顧客データをデザインやプロトタイプに統合するもの、デザイナーが900以上の統合ロゴから選んでDatadogプラットフォームにドロップし、表示するものなどです。
さらにBoak氏は、Figmaエンタープライズの高度な管理機能の一部を使用することで、時間も大幅に節約しています。
「管理ポータル、SSO、自動化プロビジョニング、そしてFigmaのセキュリティ機能により、非常に管理しやすくなりました。おかげで、より戦略的なプロジェクトに時間を取れるようになりました」
DRUIDSの構築がDatadog社成功の鍵の1 つに
Datadog社は以前よりもスピーディーに製品をリリースできるようになりました。反復的で単純なタスクはすべてデザインシステムで処理され、従業員は重要で複雑な問題の解決に集中できるようになりました。その結果、デザイナーの問題解決における達成感は高まっています。
デザイナーやエンジニアの迅速なオンボーディングを可能にしているのが、製品の技術的問題の早期解決です。担当者がさまざまな製品のステートやユーザーインターフェイスを自分の時間内でレビューできるためです。「Datadogは複雑なプラットフォームであり、理解すべき新しい技術コンセプトがたくさんありますが、充実したドキュメントが備えられているということは、製品自体とユースケースを実際に理解するためにより多くの時間を費やすことができることを意味します」
製品数が15を超えるまでに成長し、プロダクトチームが大きくなっても、Datadog社のプロダクトデザイナー達は、共通言語を利用して、早期の発散的デザインプロセスと、重要な動作に関するエンジニアリングからの意見収集を行っています。この取り組みが、優れた製品の開発と強固なチーム連携を可能にしています。チームがどんなに大きく成長しようとも、創業当初と同じ確固たる製品開発文化を維持していること、それがHowles氏が誇る成果の1つです。
しかし最も重要なことは、大きな問題を解決するための時間が確保されることであり、Datadog社のデザイナーとエンジニアが、Datadogプラットフォームを使用するビジネスに多大な影響をおよぼす技術的で複雑な問題の解決に集中できる点です。
Boak氏のチームにとって、エンタープライズB2B SaaS会社をデザインし、その全製品を大規模でも適切に動作するよう運用していくことは、大変やりがいのあることです。「私たちは何十億人のユーザーという観点から価値を評価しているわけではありませんが、当社の製品を愛し、日々使用して高く評価してくださっている数千もの企業のために、複雑な技術的問題を日々解決し続けています」
その証拠が、Datadog社のマルチプロダクトの急激な成長です。
The Total Economic Impact of Figma (Figmaによる総経済効果)
Forrester社発行のこのレポートでは、ワークフローの効率化やデザインスタックの統合、優れた製品の開発におけるFigmaとFigJamの活用事例が紹介されています。
Figmaを活用してデザインを拡張させる
優れたデザインは、製品やブランドを差別化するために欠かせません。しかし、優れたものを一人で生み出すことはできません。Figmaは、製品チーム全体で迅速、包括的にデザインするためのワークフローを実現します。
Figmaを活用したデザイン拡張について、お問い合わせください。
Figmaの主な特長:
- アイデア出しから制作、デザイン構築まで、デザインプロセスのすべてのステップをワンストップに集約可能
- デザインワークフローを加速させる、全社共有のデザインシステム
- 製品チームのプロセスにおける多様性を促進する、ウェブベースでアクセシビリティとユーザビリティの高い製品群