FDS - ガイドライン

Slot

Slot ComponentとはInstanceを入れる事のできる箱のようなものです。FDSでは、このSlot Componentを使う事で高速なモックアップ制作や汎用的なコンポーネントの使用を可能にしています。

特徴 – ( 1 )

SlotはSpacingおよび縦組・横組の定義を持っています。縦に要素を並べたいか、横に並べたいか。間隔はどうするかをComponent Propertiesパネルで素早く設定する事ができます。

特徴 – ( 2 )

Swap Instanceでコンポーネントを入れる事ができます。Slot自体がSpacingなどの定義を持っているので、Swap後に縦横・要素数・間隔の調整を簡単に行う事ができます

特徴 – ( 3 )

Slot同士はネストできません。
Sectionを構成するContainerに入れるようにします。

Slotを使った再利用度の高いコンポーネント

これまでFigmaでComponent Instanceを作る場合、そのコンポーネントの構成要素の種類が増えれば増えるほどVariantが増えたり、Instance化したものは構成要素の編集ができない為マスターからDetachする(切り離す)必要がありました。
FDSでは差し替え可能な箇所にSlot Componentを使う事でコンポーネントの柔軟性と再利用度を確保しています。

Gridに合わせたレイアウト

Slotで構成されたコンポーネント「Grid Slot」を使う事でGridに合わせたコンポーネントグループを作る事ができます。

おすすめの記事

TOP