Config 2025: さらなるデザインの進化に向けて

Figmaを立ち上げて10年。私たちのデザインの定義は広がりました。新しい製品や機能を開発するたびに、ツールやプロセスを改善し、デザインを活かすための方法を考えていますが、アイデアの多くは、皆さんの反応から直接得たものです。日々の業務を効率化する生活の質の向上であれ、能力を拡張する製品や機能であれ、皆さんが構築するものやデザインする方法は、Figmaをプロダクトチームにとって唯一の信頼できる情報源にする上でインスピレーションを与え続けてくれています。

しかし、デザインとは、単にピクセルをプッシュするだけではありません。問題を巧みに解決し、形と機能を常に気にしながら、想像したものを現実にするための推進力なのです。AIにより、ソフトウェア開発が簡単になったことで、デザインの重要性と影響力は増すことでしょう。製品を際立たせるのは、クラフト、質、そして視点です。

時代を象徴する次世代のテクノロジーは、偶発的にデザインされるものではありません。あなたが構築し、デザインするのです。そのプロセスを横で支えるのがFigmaです。可能性を広げ、アイデアのデザインから製品化までをお手伝いします。

Figma Make: デザイン、プロンプト、検証のすべてをFigmaで

デザインと制作の境界線は人が作ったものであり、クリエイティブプロセス自体の要件ではなく、ツールによって作られたものです。革新的なチームはいつの時代も、このギャップを埋める方法を見つけてきましたが、それには専門知識と複雑なワークフローが必要でした。

そこで、既存のデザインを完全にコード化されたプロトタイプに変換する新たなプロンプト・ツー・コード機能「Figma Make

」に、私たちは大きな可能性を見出しています。Figma Makeは、シンプルな自然言語プロンプトを使用して、デザインの意図と忠実度を維持しながら、デザインをインタラクティブな体験に変換できます。

私たちは、「デザインには幅広く深く取り組む必要がある」という原則に基づいてFigma Makeを構築しています。迅速な探索は時間とリソースの制約によって制限されることも多く、忠実度が低くなる場合もありますが、Figma Makeは複数のエントリーポイントを提供します。フレーズまたはFigmaファイルでプロンプトを作成でき、プロトタイプの特定の部分を強調表示して正確に反復処理を行い、自然言語の指示で選択した領域を変更できます。Webページの特定の部分を指して、「ここに公開と書かれたボタンを追加して」と指示できるようなものです。

静的なデザインでは伝えられる内容が限られているため、全員の足並みを揃えたり、実現可能性を評価したりすることは困難です。Figma MakeはFigmaプラットフォームに組み込まれており、デフォルトで共同作業が可能なため、デザイナーやプロダクトチームが信頼できる唯一の情報源内で、アイデアを最初から最後まで定義したり、イテレーションしたり、ブラッシュアップしたりするための強力なオールインワンツールとして機能します。

今後数週間から数か月にかけて、Figma Makeの機能をさらに拡充し、デザイナー向けのコントロールと具体性を強化することを目指しています。

Figma Sites: デザインからプロダクションまでのプロセスを一元化

私たちのコミュニティは長年にわたり、[公開]をクリックするだけで、Figmaのデザインやプロトタイプを、機能するWebサイトやアプリケーションに変換できたら、どんなに素晴らしいかを語ってきました。これにより、製品開発プロセスにおける「最終ステップ」が達成されるだけでなく、製品開発の過程での多くの紆余曲折を乗り越えられるよう、チームをサポートすることもできます。Figma Sites

を使えば、チームはワンクリックでデザインを直接Webに公開し、デザインを完成させることができます。

あらゆる画面サイズにシームレスに適応するレスポンシブなレイアウトから、インタラクティブなコンポーネントや直感的なプロトタイピングツールまで、Figma Sitesを使えば、Figmaのプラットフォームを離れることなく動的なWeb体験を作成できます。また、近日中にカスタムコードとAIによるインタラクション、アニメーションを使用してデザインを向上できるようになる予定です。フレームを選択して[デザインからコードを作成する]をクリックすると、新たなAIプロンプトツーコード機能である「Figma Make」を使用して、サイトのアニメーションとインタラクションを生成できます。さらに、新たなコンテンツ管理システム(CMS)が、誰でも簡単にWebサイトのコンテンツを即座に更新できるようにします。

グリッド: 自由形式のデザインから構造化されたデザインへシームレスに移行

Figma MakeとFigma Sitesは、デザインをプロダクションに移行する際のギャップを埋めるのに役立ちますが、Figmaデザインパネルの新しいオートレイアウトオプションであるグリッドが、このプロセスを大幅に加速させるでしょう。

グリッドは、初期の印刷機の時代からデザインの基本であり、テキストとグラフィックの整列に役立ってきました。バウハウスのグリッド理論(構造と視覚的組織のためのツールとしてグリッドを確立)から、CSSグリッドやFlexboxのような現代のWebレイアウトパラダイムへの進化は、その変わらぬ重要性を示しています。今日のグリッドシステムは、これまでにない柔軟性と制御性を備えており、創造性を制限すると同時に解放する体系的なフレームワークを提供しています。

グリッドはプロダクトデザイナーのツールキットに欠かせないものですが、Figmaではグリッドを適切かつレスポンシブに実装するのが難しく、デザイナーは回避策や入り組んだオートレイアウトのフレームを作成することを余儀なくされていました。そこで、グリッドのエクスペリエンスを一新し、制御性と応答性を強化した柔軟なレイアウトを実現しました。デザイナーは要素を複数のセルにまたがって配置でき、フレームのサイズが変更されるたびにレイアウトがリアルタイムで調整されます。正確なトラックサイズ制御、フレームの複雑化を避けた要素の階層化、Dev ModeでのCSSの直接変換により、最新のレスポンシブデザインの要件をすべて維持しつつ、デザインから制作までのプロセスを合理化します。

Figma Draw: ベクターレイヤーに無限の表現力とテクスチャーを追加

Figmaで作業する際の魅力の一つは、自由形式の作成とグリッドのような構造化されたレイアウトの間をシームレスに行き来できることです。Figmaに取り掛かった当初、私たちはベクターネットワークを用いて既存の慣習に挑み、デザイナーがパスを描く方法を見直しました。時間が経つにつれ、この基盤を進化させる必要性に気づきました。製品やWeb体験においてブランドのビジュアル表現がますます重要になる現在では、なおさらです。

現在、私たちはFigmaエディター内のビジュアル機能を拡張するために大規模な投資を行っています。ベクター編集機能を完全に書き直し、ブール演算、フラットニング、線のアウトラインに関する長年の問題を解決しました。ビジュアルデザインと自由な創作に最適化されたツールセット、「Figma Draw

」をぜひご利用ください。

すぐにFigma Drawのフォーカスされたインターフェースに気づいていただけるでしょう。大きなレイヤーサムネイル、新たな専用ツール、スライダーコントロールが目を引きます。また、フライアウトパネルに隠れていたコントロールが、プロパティパネルから直接アクセス可能になりました。さらに、ベクター編集を一新。ツールベルトの上にある新しい選択メニューを通じて、複数のベクターを同時に選択し、まとめて編集して、共通のアクションにアクセスできるようになりました。加えて、ブール演算を完全に書き直し、よりスムーズな操作を実現しました。ベクトル全体でのマルチセレクトやシェイプビルダーなどの機能により、複雑なシェイプの作成が簡単になっています。ダイナミックなストローク、可変幅、テキストオンパス機能、テクスチャ/ノイズエフェクト、段階的なぼかし、パターン塗り、回転の起点など、クリエイティブな可能性が広がります。アダプティブデザインでは、デザインシステムのカラーバリアブルをイラストに適用することで、ライトモードやダークモードに美しく対応させることができます。

イラスト要素はデザインにおいて欠かせないもの。私たちは、新たなツールがアイデアと表現の間の壁を取り除くと信じています。皆さんがFigmaの新たなビジュアル表現を使い、どのようなものを生み出すのか楽しみにしています。

Figma Buzz: どのフォーマットでも卓越したデザイン

Figmaはデザインや製品開発において信頼できる唯一の情報源として機能しています。しかし、Webサイトやアプリケーションの枠を超えたデザインを行っている方も多くいることでしょう。Figmaのブランドスタジオでは、ソーシャルメディアのFigmaアセットからイベント資料、商品に至るまで、あらゆるものをFigmaでデザインしています。そう、皆さんと同じように。しかし、Figmaはこのようなコンテンツやそれを作成するチームのために特別に設計されたものではありません。

ここで活きるのが、デザインの専門知識をエンジンとして、チーム全員が必要なときに必要なアセットを作成できる専用スペース「Figma Buzz」です。Figma Buzzを使用すれば、カスタマイズ可能なテンプレートと焦点を絞った編集体験を活用し、ソーシャルメディアのアセットからイベント用資料まで、あらゆる種類のコンテンツを作成しつつ、ブランドの一貫性を完璧に維持することができます。直感的なグリッドビューと一括作成ツールによりワークフローが効率化され、エクスポートオプションと新しいコンテンツシートにより、デザインの専門知識を問わず、必要とするすべての人にこの機能を届けられます。

私たちはFigmaを、プロトタイプの作成や微調整、イテレーション、アイデア出しから完成まで、1か所で行えるスペースにしたいと考えています。Figma MakeとFigma Sitesを使用してキャンバスにコードを直接取り込み、Webに公開することから、グリッドとFigma Drawを使用して基本的なデザインツールを再構築し、Figma Buzzで創造的な可能性を広げることまで。アイデアから製品化までの可能性を広げるお手伝いをさせてください。