FDS

デザインシステムテンプレート

UXHubには作業の参考になるように、Fixel株式会社が開発したデザインシステム「Fixel Design System」（通称、FDS）を提供しています。このデザインシステムには日本の一般的な業務システムで必要となるUIコンポーネントやページレイアウトがあらかじめ用意されています。Fi

FigmaでStyle作成（UXHub連携用）

FDSを使ったデザインプロセス①色やフォントをカスタマイズする -- Design Tokensを定義する基本的なTokensはあらかじめ用意されておりFigma Stylesに登録されていますが、プロダクトに使用するカラーパレットやフォントを決めてFDSのDesign Tokens(Fig

FigmaでUXHubプラグインを使用してStyle作成

主な機能Figmaで定義されているStylesの読み込み、編集画面デザイン、 コンポーネントを見ながら色を調整することができます。自動生成・自動登録Primary Mainさえ指定すれば必要な色を必要なスケールで自動生成し、Stylesにも登録してくれます。Secondaryは9

Figmaからデザイントークンをインポート

UXHubではプラグインを通して、Figmaで定義したカラーなどをUXHubにデザイントークンとしてインポートすることができます。注意点や手順を下記にて説明します。利用上の注意旧プラグイン（UXHub Plugin）との互換性旧プラグイン（UXHub Design Token

Figmaとの連携

Figmaで作成したデザインシステムを「UXHub – Design Tokens」Pluginを使用してUXHubにデザイントークンとしてインポートすることができます。このトークンには、カラー、タイポグラフィ、スペーシングなどが含まれており、Pluginを使用することで簡単にデザインを調