Figma が AI を活用したモーショングラフィックスおよびシェーダーツールを追加
Figma は年次カンファレンス「Config」で、AI を活用したモーショングラフィクス生成やシェーダーツール、そしてデザインキャンバス内で直接コードを編集・管理できる新機能を発表し、クリエイティブと開発の境界を融合させた。
キーポイント
AI による自動アニメーション生成
チャットボットへの自然言語記述だけでモーショングラフィクスやトランジション効果を生成できる新機能が導入され、手動での複雑なアニメーション作成が簡素化される。
デザインキャンバス内でのコーディング機能
「コーディングレイヤー」の追加により、開発者が Figma のデザイン画面上でプロジェクトのコードを直接微調整・管理できるようになり、デザインと実装の往復作業が削減される。
フルスタック開発向けキャンバスの再設計
チーム、AI エージェント、ツール、素材を一つの場所で統合した新しいキャンバス構造へ再構築され、クリエイティブなアイデアから実装までのワークフローが一元化される。
影響分析・編集コメントを表示
影響分析
この発表は、Figma が単なるデザインツールから、AI を駆使した包括的なプロダクト開発環境へとその地位を確立する重要な転換点です。特に、コード編集機能をデザインキャンバス内に統合し、自然言語でアニメーションを生成できる点は、クリエイターとエンジニアの役割分担を見直す可能性を秘めており、ソフトウェア開発のプロセス自体を再定義するインパクトがあります。
編集コメント
デザインツールにコード編集と高度な AI 生成機能を直接統合した点は、開発ワークフローの効率化において画期的です。ただし、生成されたコードの品質やセキュリティ面での実用性については、今後の現場での検証が待たれます。
Jess Weatherbed
クリエイティブ産業、コンピューティング、インターネット文化に焦点を当てたニュースライターです。ジェスはキャリアの初期を TechRadar で過ごし、ニュースやハードウェアレビューを担当しました。
Figma は、クリエイターが「アイデアをさらに推し進め」たり、AI を活用して退屈なタスクを自動化したりすることを目的とした、年次カンファレンス「Config conference」で、いくつかの新しいデザインおよびコーディング製品のアップデートを発表しました。その一部として、Figma によるとフルスタック開発に最適化された再設計されたキャンバスが導入され、チーム、AI エージェント、ツール、素材を「一つの場所に集約」するようになります。
注目すべき機能として、Figma のデザインキャンバスから離れることなくプロジェクトのコードを微調整できる「コーディングレイヤー（coding layers）」や、AI 生成によるモーショングラフィックスエフェクトが挙げられます。これにより、Figma のチャットボットインターフェースにアニメーションやトランジションエフェクトを記述するだけで作成が可能になります。すべての新製品アップデートの詳細については、Figma のウェブサイトをご覧ください。
このコンテンツは、あなたのクッキー設定により表示されていません。このコンテンツを読み込むには、以下の「許可」ボタンをクリックして、「ソーシャルメディアおよび埋め込みコンテンツ」のクッキーをオプトインしてください。これらのクッキーは、埋め込まれたコンテンツの出所である第三者ソースによって設定・管理されます。
それ以外については、Config 2026 で発表されたすべての内容に関する Figma の概要をご覧ください:
アイデアを表現するための新しいクリエイティブ素材
● コードレイヤー: Figma のデザインキャンバス上で直接コードと作業できます。リポジトリのクローン作成、Figma のエージェントによる新しい方向性の生成、フローの編集可能なデザインレイヤーへの変換、そして変更点のコードへの同期が可能です。
● モーション: Figma から直接、アニメーション、トランジション、3D 変形を共同で設計できます。AI を使用してプロンプトを入力しアニメーションを作成するか、プリセットスタイルを適用するか、タイムライン上で手動調整します。モーション機能はデザインシステムに連携しており、コードベースで実装されているため、すぐにリリース可能です。
● シェーダー: プロンプトを入力して WebGPU によって駆動されるカスタムビジュアル処理であるシェーダーエフェクトや塗りつぶしを作成できます。以前は Figma で利用できなかったディザリング、ピクセル化、および各種のブラー効果など、さまざまなエフェクトを直接キャンバス上で作成できるようになりました。
● Figma Weave ワークフロー: 20 以上の統合された Weave ツールを使用して、Figma で一貫性が高く高品質なビジュアルを生成します。複雑な AI ワークフローをキャンバス上のシンプルなツールに変換します。これは Figma と Figma Weave の完全な統合に向けた第一歩であり、本年後半に予定されています。
チームとエージェントが協力するための新しいインテリジェントツール
● エージェントのスキルとより深い文脈: 反復作業を、チーム全体が Figma のエージェントとより正確かつ一貫性を持って作業できるよう活用できる「スキル」に変換します。サードパーティ製コネクタ、ウェブ検索、ファイル添付機能を活用して、より多くの文脈情報を取り込みます。
● ジェネレーティブプラグイン: エージェントを使用してカスタムで再利用可能なプラグインを構築することで、Figma の機能を拡張します。プロンプトから調整可能かつ共有可能なツールに変換 — 開発者のセットアップや技術的スキルは不要です。
この記事のトピックと著者をフォローして、パーソナライズされたホームページフィードで類似の記事をもっと見たり、メール更新を受け取ったりしてください。
- Jess Weatherbed
-
-
-
-
原文を表示
Jess Weatherbed
is a news writer focused on creative industries, computing, and internet culture. Jess started her career at TechRadar, covering news and hardware reviews.
Figma has revealed some new design and coding product updates at its annual Config conference that aim to help creatives “push their ideas further” and automate tedious tasks with AI. Part of this is a reimagined canvas that’s now optimized for full-stack development, according to Figma, bringing teams, AI agents, tools, and materials “together in one place.”
Notable callouts include coding layers that let you tweak the code of your projects without leaving the Figma Design canvas, and AI-generated motion graphics effects, which allow you to make animations and transition effects by simply describing them to Figma’s chatbot interface. You can read more about all the new product updates over on Figma’s website.
This content isn't visible due to your cookie preferences. To load this content, click the Allow button below to opt in to "Social Media & Embedded Content" cookies. These cookies are set and controlled by the third party sources from which the embedded content originates.
Otherwise, here’s Figma’s overview of everything that was announced:
New creative materials to express ideas● Code layers: Work directly with code on the Figma Design canvas. Clone repositories, generate new directions with Figma’s agent, extract flows into editable design layers, and sync changes back to code.● Motion: Design animations, transitions, and 3D transforms collaboratively, directly from Figma. Prompt to create animations with AI, apply preset styles, or adjust manually on a timeline. Motion is connected to design systems, code-backed, and ready to ship.● Shaders: Prompt to build shader effects and fills, custom visual treatments powered by WebGPU. Effects that weren’t available in Figma before, like dither, pixelate, and various blur types can now be created directly on the canvas.● Figma Weave workflows: Generate consistent and high-quality visuals in Figma with 20 plus integrated Weave tools, turning complex AI workflows into simple tools on the canvas. This is the first step towards a full integration between Figma and Figma Weave, expected later this year.New intelligent tools for teams and agents to collaborate● Agent skills and deeper context: Turn repetitive work into skills that entire teams can use to work more precisely and consistently with Figma’s agent. Bring in more context with third party connectors, web search, and file attachments.● Generative plugins: Extend Figma’s capabilities by building custom, reusable plugins with the agent. Turn prompts into tools that can be tweaked and shared — no developer setup or technical skills required.
Follow topics and authors from this story to see more like this in your personalized homepage feed and to receive email updates.
- Jess Weatherbed
-
-
-
-
-
関連記事
Figma が新アップデートでコードレイヤーやアニメーションサポート、さらに AI 機能を追加
デザインツール「Figma」が新アップデートにより、開発者が直接編集可能なコードレイヤーの導入、アニメーション機能のサポート強化、および新たな AI 機能の実装を発表した。
フォード、自動化システムの誤りを修正するため元エンジニアを再雇用せざるを得なかった
フォードは JD パワーの初期品質ランキングで主要メーカー首位を獲得したが、生産・設計における自動化システムが想定より脆弱だったため、過去のミスを修正するために元エンジニアを再雇用したと発表した。
Facebook のクリエイタースタジオが AI コンパニオンアプリとして復活
Meta は、Facebook クリエイターページマネージャーを「再設計」したスタンドアロンの AI コンパニオンアプリとして復活させ、クリエイターが視聴者とつながりやすくし、Facebook での成長方法を具体的に示すことを目指している。
今日のまとめ
AI日報で今日の重要ニュースをまとめ読み