デザインシステムテンプレート
UXHubには作業の参考になるように、Fixel株式会社が開発したデザインシステム「Fixel Design System」（通称、FDS）を提供しています。このデザインシステムには日本の一般的な業務システムで必要となるUIコンポーネントやページレイアウトがあらかじめ用意されています。Fi
UXHubには作業の参考になるように、Fixel株式会社が開発したデザインシステム「Fixel Design System」（通称、FDS）を提供しています。このデザインシステムには日本の一般的な業務システムで必要となるUIコンポーネントやページレイアウトがあらかじめ用意されています。Fi
デザインシステムを選択したあとで最初に表示されるページです。該当するデザインシステムに関して、基本的な説明や情報を記載します。ページの上部に「カバー画像」を設定することができます。タイトルの「概要」は変更が可能です。バージョンを指定すると概要ページの下段にバージョン番号が
デザイントークンを定義します。UXHubでは、デザイントークンを単一値と複合値で管理することができます。デザイントークン（単一値）デザインのビジュアルなスタイルを決める色、フォント、アイコン、画像、余白の定義など、多様なスタイル要素とそのプロパティ値を定義します。定義したスタイルの
様々なコンポーネントをプレビューとコードのセットで作成、管理できます。コードはHTML+JS、Pug、React、Vue2、Vue3、Angularの6つのフレームワークの実装を登録できます。HTML、CSS、Javascript、Pug、React、Vue2、Vue3、Angular のコードを
レイアウトはアトミックデザインのテンプレートを登録します。 ヘッダー、フッター、サイドエリアなどの配置など、ページで共通のレイアウトを抽出して登録します。コードはHTML+JS、Pug、React、Vue2、Vue3、Angularの6つのフレームワークの実装を登録できます。HTML、CSS、Ja
「コンポーネント」で作成したUIコンポーネントを使ったページのサンプル画面を作成できます。プレビュー用のサンプル画面は、HTML、CSS、JavaScriptで記述します。画面サイズ設定で各デバイスの画面サイズに応じた表示を確認することができます。レスポンシブ対応の表示も確認できます。
デザインガイドラインを含め、多様なデザインシステムの文書を書くためのフォーマットです。デザインシステムの使用に関する多様な文書を画像やテーブル、コードなどを交えながら自由に記述できます。テキストエディタを使用し、テキストの装飾ができ、テキスト、画像ファイル、添付ファイル、テーブル、罫線のブロックも
Figmaで作成したデザインシステムを「UXHub – Design Tokens」Pluginを使用してUXHubにデザイントークンとしてインポートすることができます。このトークンには、カラー、タイポグラフィ、スペーシングなどが含まれており、Pluginを使用することで簡単にデザインを調