Figmaが説明だけでデザインを動かすAIを採用

2026年06月26日 スペイン語から翻訳・公開

FigmaはカンファレンスConfigで、テキストによる説明からアニメーションや視覚効果を生成できる人工知能を搭載した新機能を発表しました。また、デザイン内でのコードの直接編集も追加されました。一般ユーザーにとっては、反復作業の時間を短縮し、複雑なグラフィックの作成を容易にすることで、プログラミングを習得していない人でも高度なツールにアクセスしやすくなります。

Figma interface on a large monitor showing a wireframe UI being animated in real-time, glowing motion paths emerging from a text input field as a user types a description, cursor clicking a play button, code editor panel sliding open alongside the design canvas, smooth transitions between static frames and moving elements, cinematic technical visualization, dark mode with neon blue and purple accent lighting, sleek minimalist workspace, subtle particle effects around animated components, photorealistic UI render, shallow depth of field focusing on the transformation process

コード編集の統合とビジュアル自動化 🛠️

このアップデートにより、開発者はデザインキャンバス上から直接ソースコードを変更し、リアルタイムで変更を同期できるようになります。AIはボタンを柔らかいバウンドでアニメーション化などのコマンドを解釈し、手動操作なしでトランジションを生成します。これにより、プロトタイプと最終製品の間の中間ステップが不要になります。プロダクトチームにとっては、ツール間の行き来が減ることを意味しますが、複雑または曖昧な指示をAIが誤って解釈しないか確認する必要があります。

今やAIは、あなたが何を望んでいるかを説明する手間さえも省いてくれます 😅

以前は、ボタンをスカイブルーにするかオーシャンブルーにするかでデザイナーと3時間議論して時間を無駄にしていたなら、今はAIに海のように青くしてと言うだけで、アニメーションする波のグラデーションを返してくれます。もちろん、その後でクライアントがプールブルーを望んでいたことが判明し、プロンプトをやり直さなければならないことに気づくでしょう。しかし、少なくとも、あなたが5回目で意見を変えても、機械は白い目で見たりはしません。