メインコンテンツまでスキップ

Figma MakeがSaddleのアイデアをわずか2週間でローンチへ

Simen Sannaは、SaddleのCEO兼創設者であり、ノルウェーのSaaS起業家で、元エネルギーエンジニアです。前回の会社では、オフショア船舶の脱炭素化に向けた世界有数のソフトウェアを開発し、2021年に事業を売却しました。

しかし、前回のソフトウェアは開発に数年を要したのに対し、今回のサービスはまったく異なるスピードで進行しています。

デザインおよびプロダクト構築コンサルティング会社のSmplCoと協力することで、SaddleはFigma Makeを活用し、ソフトウェア開発にかかる時間を大幅に短縮しつつ、コストも削減することに成功しました。

「以前は、Saddleのような動作するMVPを作るには6か月かかり、費用も8倍かかっていました」とSimenは語ります。

「Figma Makeは完全にゲームチェンジャーです」と彼は続けます。「SmplCoのサポートを受けて、デザイン作成、ユーザージャーニーの計画、ワイヤーフレームのスケッチから、クリック可能なFigmaデザイン、Reactでのソフトウェア開発、さらにはバックエンドのエンドポイントとの連携まで…すべてわずか2週間で行うことができました!」

これは、その2週間の物語です。

意思決定のためのデジタルハイウェイ

Saddleは、特にM&A (合併・買収)の重要な局面で、企業がより迅速かつ的確な意思決定を行い、イノベーションを促進するためのソフトウェアプラットフォームです。

Figma Makeを使って構築されたSaddleは、社員のイニシアチブを可視化し、評価し、迅速に育成するための構造化されたダイナミックな仕組みを提供します。

「新しい経営チームが引き継ぐ際には、正しい意思決定をするために、既存のリーダーとの協力や良質なデータが必要です。しかし、買収した企業の内部事情、微妙な顧客インサイト、組織のダイナミクス、クリエイティブな強みを深く理解するのは非常に難しい」とSimenは語ります。

「社員は声が届かないと感じ、リーダーはチーム内でどこでイノベーションが起きているかを把握できません。その結果、価値あるアイデアが埋もれ、重要な人材がやる気を失い、イノベーションが停滞してしまいます」

その結果は?Simenによると、M&Aの約60%は意図した価値を提供できていません。

そこでSaddleの出番です。イニシアチブと意思決定のための「デジタルハイウェイ」を提供します。

このプラットフォームは、イノベーションデータをビジネスメトリクスに直接結び付け、強力なアイデアを特定し、意思決定を効率化するとともに、可視化と評価を通じてクリエイティブ人材を維持できるようにします。

素早く動き、形にする

Saddleは自社でバックエンドを構築した後、デザインの専門家であるSmplCoと提携しました。

SmplCoは、Figma Makeを使って「素早くプロトタイプを作り、賢く構築し、数週間でローンチする」という方針をサポートする実験を始めました。

ステップ1: コンセプトからプロトタイプへ

この協業は、迅速なアイデア出しから始まりました。SmplCoのマネージングパートナー、Andreas Melværは次のように説明します。

「まず問題を明確に定義し、ニッチにフォーカスしました。エクイティ取引中に、どのように製品が社内のイノベーションを促進できるかに着目したのです」

「社員がアイデアを提出する方法や、リーダーがそれを追跡・評価・優先順位付けする方法を可視化するユーザージャーニーやUIコンセプトをスケッチしました」

SaddleのデザインパートナーであるSmplCoは、Figma Makeがその理念「素早くプロトタイプを作り、賢く構築し、数週間でローンチする」を支える最適なツールであることを実感しました。

これは、SmplCoが長年にわたる自社の事業構築・販売経験を基に設計した独自の「5-Day Prototype」プロセスの最初のステップでした。

数日以内にチームはFigma上でインタラクティブなデモプロトタイプを作成しました。テストと改善ができるほどシンプルでありながら、コア機能やユーザーフローの検証に十分な内容を備えていました。

ステップ2: Figma Makeでプロトタイプを実現する

プロトタイプが適切な体験を捉えた後、チームはFigma Makeに移行しました。

彼らはVibeコーディング環境を使い、Figma上のデザインをレスポンシブでインタラクティブなフロントエンドインターフェースに変換しました。

わずか2週間で、Saddleはバックエンドのデータから、デザインとデータが統合されたライブプラットフォームへと移行し、すぐにデモや改善が可能な状態になりました。

これにより、Saddleはほぼ即座に使用・テストできる機能的なプロダクトを手に入れました。

Simenは次のように述べています: 「Saddleの全体的な考え方は、アイデアを形にすることです。そしてFigma Makeはそれを非常に速く実現しました。ただ、ここで重要な要素があります。市場にあふれる多くのローコードの取り組みとプロジェクトを差別化する要素です。」

Saddleにはデザインとコーディングの専門知識が必要であることを理解していたSimenは、SmplCoのチームにコードを精査させ、クリーンで安全な状態にしました。

「Figma Makeのスピードとソフトウェアデザインの専門家を組み合わせることで、得られる価値は格段に高まります」とSimenは語ります。

「Vibeコーディングは便利ですが、構造化されていないコードができてしまうことがあります」Andreasは語ります。「しっかりとした基盤を作ることが重要です。そうでなければ、プロダクトの成長やスケールが難しくなります」

ステップ3: フロントエンドをバックエンドに接続

重要なのは、Saddleはこのプロセスが始まる前にすでにバックエンドを構築していたことです。

これにより、Figma Makeで作成したフロントエンドをAPI経由で実際のデータにシームレスに接続でき、プロトタイプを機能するプロダクトに変えることができました。

データレイヤーを先に構築するこの順序が、これほど迅速な進行を可能にしました。

その結果は?わずか2週間で、Saddleはバックエンドのデータからデザインとデータが統合されたライブプラットフォームへと進化し、すぐにデモや改善が可能な状態になりました。

Figma Makeを使うことで得られたメリットは?

デザインとフロントエンド開発を1つの環境に統合することで、Figma Makeは従来のデザイナーとエンジニア間のハンドオフによる遅延を解消しました。

「Figma Makeを使うことで、SaddleとSmplCoはプロトタイプから実働ソフトウェアまでわずか2週間で移行できました。以前はこのプロセスに6か月と8倍のコストがかかっていました」とSimenは語ります。

Figma Makeを活用することで、Saddleはレイアウトやロジック、インタラクションの実験を自由に行い、コードを壊したり時間を無駄にしたりする心配なく開発を進められます。

スタートアップであるSaddleにとって、このスピードは競争優位性に直結し、早期のユーザー獲得や開発コストの効率化に貢献しました。

さらに効率性だけでなく、Figma Makeは創造的柔軟性も提供し、明確なデザインシステムとデザインイテレーションの方向性を確立することができました。

レイアウトやロジック、インタラクションの実験を自由に行いながら、視覚的な洗練と技術的実装を同時に進められ、迅速なテストとイテレーションが可能になりました。インターフェースは視覚的に洗練され、同時に技術的に実装されることができ、迅速なテストと反復を可能にしました。

このアプローチにより、プロセス全体を通じて発見とイノベーションが促進されました。

成功に向けた準備の方法

Figma Makeはスピードとコスト面で大きなメリットをもたらしましたが、Saddleチームは準備と専門知識の重要性についても貴重な学びを得ました。

1. まずバックエンドを整える

Saddleの成功は、Figma Makeでの開発を始める前にデータインフラを整備していたことにかかっていました。

これがなければ、印象的ではあるが孤立したフロントエンドだけが残っていたでしょう。

「エンドポイントが準備できていれば、Figma Makeのプロセスはスムーズに進みます」とSimenは語ります。

2. 専門家による指導が不可欠

意思決定を導き、品質を保つためには経験豊富なデザイナーと開発者が不可欠でした。

「今では誰でも素晴らしいソフトウェアを作れるという考えがありますが、それは正しくありません」とAndreasは言います。

「実際、多くの悪いソフトウェアが、特にセキュリティ、プライバシー、持続可能性の面で深刻な問題を引き起こしています」

「クリエイティブと技術の両面を理解している専門家が必要です」

3. プロセスを信頼しつつ、迅速にイテレーションする

Saddleの2週間での開発成功は、チームが柔軟で探究的なマインドセットを受け入れたことに起因します。

Saddleにとって、Figma Makeは数か月かかるはずの開発サイクルを、アイデアから動作するプラットフォームまでの2週間のスプリントに変えました。

スピード、コスト削減、創造的自由をもたらすと同時に、準備、協力、専門知識の重要性という普遍的な教訓も強化しました。

最後にSimenから、この旅に挑む人へのメッセージ…

「覚悟して乗り込んだほうがいいですよ。スピードは速いです」

Figmaを活用してデザインの規模を拡大するには

優れたデザインは、製品やブランドを差別化する可能性を秘めています。しかし、偉大なものは一人では作れません。Figmaは、製品チームを迅速かつ包括的なデザインワークフローで結びつけます。

企業がFigmaを活用してデザインの規模を拡大する方法の詳細については、当社までお問合せください。

Figmaの主な特長:

  • デザインのアイデア出しから、作成、構築までデザインプロセスにおけるすべてのステップを1カ所に集約
  • 全社共有のデザインシステムでデザインワークフローを加速
  • Webベースでアクセスしやすく、使い勝手に優れた製品で、製品チームのプロセスにおける包括性を促進

Connect with our team

By clicking “Submit” you agree to our TOS and Privacy Policy.