Figma Make(https://www.figma.com/ja-jp/make/)を利用する機会があったので、プロトタイプ作成や要件整理の中で感じたことを共有したいと思います。

以前、新しいプロジェクトの議論を行っていた際、画面イメージは主にスライドを使って説明していました。

スライドでもある程度の議論はできますが、これまでにない新しい画面や操作フローの場合、画面だけではイメージしづらく、実際の操作感がイメージ通りかどうかも判断しにくいということがありました。

そのため、「簡単でもよいので、実際に触れるプロトタイプが欲しい」といった声が出る場面もありました。

そのような中で出会ったのが、Figma Makeです。

Figmaは、UI/UXデザインツールとして非常に有名で、多くの現場で利用されています。

そのFigmaに、近年のAI技術の進展に伴って追加されたのが、「Figma Make」という機能です。

これは、AIと対話しながらプロトタイプを生成・調整できる機能です。

生成されるのは単なる画面イメージだけではなく、React.js や Tailwind CSS を利用した実際に動作するプロトタイプであり、コードも合わせて出力されます。

SNSなどで見かけた事例では、UI/UXデザイナーがFigmaやFigma Makeを利用して画面設計を行い、その後、Figmaが提供するMCPサーバーを通じて、生成されたデザインやコード情報をAI開発ツールと連携しながら開発を進める、といった活用方法もあるようです。

Figma Makeを活用する際は、テキストによるプロンプトや、イメージ画像などを用意すると、より意図に近いプロトタイプを生成しやすいと感じました。

また、プロンプトを作成するためには、最初に要件を言語化し、必要な画面や最低限必要な機能をシンプルに整理することが重要になります。

そのため、ChatGPTやGeminiなどを活用して、Figma Makeが解釈しやすい指示文を整理・生成するのも有効だと思います。

個人的には、最初から細かい仕様を詰め込みすぎるよりも、まずは「最低限必要な画面」と「主要な操作フロー」だけに絞ってプロンプトを作成した方が、やりやすいと感じました。

私はUI/UXデザイナーではなく、Figma Makeも無料版を利用している程度ですが、テキスト入力を中心に、簡単なシフト表のプロトタイプを作成してみました。

そして、実際にプロンプトを書いていく中で、

• どの情報を常時表示する必要があるのか
• 誰がどの操作を行うのか
• どこまでを1画面で完結させるべきか
• 画面間やボタン操作時の動作フロー

など、これまでスライドだけでは見落としやすかった点を改めて整理するきっかけになりました。

その中で特に印象的だったのは、プロンプト作成やFigma Makeとのやり取りを通じて、単に画面を作るだけではなく、「実際にどのような操作フローが必要なのか」「どのようなデータやパラメータが必要なのか」を改めて考えるきっかけになったことです。

単純なスライドによる画面イメージ作成と比べて、必要な機能や流れを繰り返し確認しやすく、より具体的に検討を進められると感じました。

また、ユーザー側も、実際に触れるプロトタイプを通じて、画面イメージや操作感が要望に合っているか確認しやすくなると感じました。

Figma Makeを初めて触った私にとっては、Figma Makeは非常に便利で、多くの助けになるツールだと感じました。

このきっかけで、インターネット上では様々な議論も見かけました。

もともとFigmaは、デザイナーが作成したUIイメージを、開発者へ共有・連携するための重要なツールとして広く利用されてきました。

特に、画面レイアウトやCSS調整などは実装コストも高く、コード上で試行錯誤するよりも、Figma上で素早くUIを調整・共有した方が効率的な場面も多くありました。

しかし、近年ではAIによって、プロンプトから直接UIやコードを生成できるようになり、以下のような流れも現実的になってきています。

Figma Makeでも、生成されたコードを直接修正したり、AIへ追加指示を出しながら調整を進めることができます。

そのため、「Figmaを経由せず、最初からコードベースで試作した方が早いのではないか」といった議論も出てきているようです。

ただ、実際には、特に業務システムや商用サービスでは、AIが生成したUIだけでそのまま運用できるケースはまだ少なく、操作フローや業務知識、情報設計、人による判断は依然として重要だと感じています。

現在は「AIによってFigmaが不要になる」というよりも、デザイナーが + エンジニア + AI が一緒にプロトタイプを作りながら検討していくような、新しい開発フローへ変化している段階なのではないかと感じました。

実際、関連する議論を見ていると、UI/UXデザイナー自身もAIツールを活用しながら、設計だけでなく、実際の開発環境まで踏み込むケースが増えているように感じます。

AIの発展によって、これまで画面の作り込みや細かな調整にかかっていた時間を減らし、より本質的な要件や業務フローの検討に集中しやすくなってきていると感じます。

以前であれば、ある工程や検討段階で手が止まってしまったり、一つの案を作るだけで多くの時間が必要だったりしました。

しかし現在は、AIを活用することで、アイデアをすぐに形にしながら試行錯誤できるようになり、検討の幅も以前より広げやすくなってきていると感じます。

また、SNSなどを見ていても、一般の人が「vibe coding」を通じて、自分の欲しいツールや小規模なアプリを作っている場面を見かけることが増えました。

個人的には、現在のAIツールの広がりは、昔コンピュータが一部の専門的なものから、誰もが使う一般的なツールへ変化していった流れに少し近いものを感じています。

今後、プロトタイプ作成やUI/UX設計、開発フローそのものがどのように変化していくのか、とても楽しみです。