Thread by @shin_sasaki19

Figmaの歴史はプロダクト開発者にとって学びの宝庫だった📝

1. 初期コンセプト「ブラウザ上のフォトショップ」は不発
2. 当時の常識は「1人かつオフライン」
3. 機能を絞りUIデザインに特化し成功
4. 他ツールからシェアで圧勝
5. ホワイトボード機能はMiroに敗北
6. 売却理由「マルチプロダクト化」

1. 初期コンセプト「ブラウザ上のフォトショップ」は不発

創業者のDylanはブラウザ上で動くツールに強くこだわっていた。そしてベンチマークとしてブラウザで動くPhotoshopのようになると決めていたが、Photoshopは超機能。定義があいまいで、社内でも人によって目指す方向がバラバラでカオスになる。

これはFigmaのようなスタートアップが歴史の長いマーケットトップのプロダクトを目指すのは危険という好例。そして目指すべき理想があいまいだと、社内でも認識が揃わずに何を開発したら良いか分からなくなる。なんでもできる、はなんにもできない。初期プロダクトは必ず機能を特化し絞る必要がある。

2. 当時の常識は「1人かつオフライン」

当時はデザインツールは1人で、かつオフラインで使うものが常識だったため、オンラインで誰かと一緒に作業をするというアイデアは当時全く受け入れられず。

どんなに優れたプロダクトでも、初期のコンセプトが否定されるのはスタートアップあるあるです。

しかし、創業者のDylanはプログラミング業界ではすでにこの「オンラインでのコラボ作業」の流れが起きているのを見ていたので、デザイン領域でも起きると信じてオンラインでのコラボツールを作ることは買えなかった。

優れたアイデアは「他の領域で起きている大きな変化」を参考にするのも良い手段📝

3. 機能を絞りUIデザインに特化し成功

FigmaはPhotoshopを目指すことをやめ、ユーザーインターフェース（UI）の開発をする機能に特化してプロダクトを開発。1つの機能に特化してから開発速度も上がったが、Dylanはマネジメントに失敗しFigmaのβ版はリリースが何年も遅れる原因になった。

2016年初期リリース時のFigmaの画像スクリーンショット、インターフェースのデザインに特化していてとてもシンプル。直感的にHTMLとCSSを調整してサイトのデザインを作る機能で、Figmaがデザイナー以外との協働を大事にしていたのが分かります。

Figmaの開発者ブログ：figma.com/blog/reflectin…

4. 他ツールからシェアで圧勝

Figmaのリリース直後2017年当時、デザインツールと言えばInVisitonが60％のシェアを誇り圧倒的でした。しかし2020年になると今度はFigma一強になり、InVisionは最下位レベルまでシェアを落としています。

・Figma：57％
・InVision：23％
uxdesign.cc/the-precipitou…

なぜInVisionは敗北しつつあるのか？

色々な考察がありますが、やはり大きいのは「機能の集中ができておらず戦略が不明瞭」に尽きます。インターフェースデザインに特化したFigmaに対して、InVisionは「どれもそこそこ出来る機能」が目立ちなんでも出来るは記憶に残らない、を体現してしまっている🤦‍♂️

5. ホワイトボード機能はMiroに敗北

順調なFigmaですが、何でもかんでも順調かと言うとそうでもないのがプロダクト作りの難しいところ。2021年にリリースしたホワイトボード機能は競合のMiroにシェアでなかなか届かず。インターフェースデザインに強いFigmaでも他領域で勝てるとは限らない。

デザインツールの主要プレイヤー整理📝

・Figma：インターフェースデザイン
・Miro：ホワイトボード
・Canva：グラフィックデザイン
・Adobe：プロ向けデザインツール各種

このように、Figmaだけでなく他ツールも自分の得意領域で機能を特化させ、シェアを維持しています。
sacra.com/c/figma/

6. 売却理由「マルチプロダクト化」

ではなぜFigmaはAdobeに売却することにしたのか？その大きな理由が「マルチプロダクトを目指したい」と創業者のDylanは語っています。今後Figmaは強みを活かしつつ、PhotoshopやIllustratorと連携するとのこと。これは胸アツですね！

https://twitter.com/i/status/1570547778228727809

2021年、創業者のDylan氏はこんなツイートをしていました。
「我々のゴールはFigmaでい続けることだ、Adobeになることじゃない」

https://twitter.com/zoink/status/1355173534390075394?s=20&t=jHVgYPP57PVv55wMC5HQtQ

そして買収が発表された後、この考えは今でも変わっていないと語っています。Figmaらしさを残しつつ、Adobe製品とのコラボを期待しましょう！

【まとめ (1/2)】
Figmaの歴史はプロダクト開発が「機能を絞ること」がいかに大事かを物語っています。

多くのプロダクト開発者は「とにかく機能を付け足す」ことに注力したがりますが、一歩引いてみて「自分たちは誰のどんな課題を解決するのか」を決め、1つの課題を深く解くまでやるのが鉄則です💪

【まとめ (2/2)】
個人的には

1. 創業初期に「オンラインのPhotoshop」を目指して失敗
2. インターフェースデザインに特化
3. 最終的にPhotoshopを運営するAdobeが買収

この流れがエモくて最高にかっこいいなと思いました。Photoshopを目指すのをやめたら、Photoshopに近付いたという不思議なお話🤩

【最後に宣伝】
プロダクト作りのこういった大事なポイントや鉄則を体系化するために私はプロダクト開発コミュニティ「PM Club」@pmclub19 を運営中。プロダクト開発に関わる方はぜひご参加を！

また、プロダクト開発スクール「PM School」は事前登録を受付中です💁‍♂️
pm-school.jp

Figmaからの学びがまだまだあったので、プロダクト開発の観点から別ツイートでまとめました。プロダクト作りのまさに王道、すごすぎます…！

こちらのツイートは主にプロダクト開発なので特に事業開発、プロダクトマネージャーの人におすすめです👇

https://twitter.com/shin_sasaki19/status/1571017784670449665?s=20&t=V1GvK9TLgcwW_nraX2WhJQ