MetaがAI対応デザインシステム公開

Metaは、完全にカスタマイズ可能で、人間とAIエージェントの両方によって操作されるように構築されたオープンソースのデザインシステム「Astryx」をリリースしました。現在ベータ版として利用可能です。 Astryxは新しい実験ではありません。Meta社内で過去8年間かけて成長し、同社によると、日々それに依存するエンジニア、デザイナー、製品チームによって形作られ、最も使用され、最大のデザインシステムになったとのことです。 システムは、150以上のアクセシブルなコンポーネント（ドキュメントサイトには現在160以上がリストされています）、ブランドレベルのテーマ設定、ダークモード、すぐに使えるテンプレート、そしてCLIを一つのまとまったパッケージとして提供します。これはReactとStyleX上に構築されています。事前に構築されたCSSをインポートし、型付けされたReactコンポーネントを使用します。設定するビルドプラグインも、採用するスタイリングライブラリもありません。 Astryxが取り除こうとしているトレードオフ: ほとんどのデザインシステムは選択を強要します。大企業のシステムを採用すると、アプリは他社の製品のように見えがちです。代わりにコピー＆ペーストのコンポーネントを使用すると、各プロジェクトが独自のコードスニペットを分岐させ、共通の一貫性がなく、上流の修正もなく、アクセシビリティが静かにあなたの問題となります。Astryxはこの2つの懸念を分離します。システムは動作、アクセシビリティ、品質を制御します。テーマは見た目を制御します。トークンレベル（色、タイプ、半径、モーション）でカスタマイズするため、書き換えなしでアプリが紛れもなくあなたのものになります。テーマは単にCSSカスタムプロパティのオーバーライドのセットであるため、デザイナーはコンポーネントのソースをフォークしたりラップしたりすることなくAstryxを再テーマ化できます。 その設計原則は、「強制よりもガイダンス」、「強力な文書化された慣習」、「人間とAIのための単一システム」、そして「測定によって獲得される」（慣習は主張されるのではなくテストされる）と述べられています。 アーキテクチャ：基盤、コンポーネント、パターン Astryxは3つの層で構成されています。基盤は、一貫性のあるアクセシブルなインターフェースのためのプリミティブ（タイポグラフィ、色、レイアウト、アクセシビリティ）です。コンポーネントは、150以上の再利用可能なビルディングブロックであり、すべて完全なTypeScriptサポートを備えています。パターンは、実証済みのソリューションです。