Simple Design System
Simple Design System(SDS) は Figma が提供する、基本的なデザインシステムを構築するための Figma のベストプラクティスを網羅した UI キットです。 また、 GitHub には UI キットと紐づけられた React プロジェクトも提供されています。 そのため、あらかじめ用意されたサンプルやコンポーネントなどを用いて、素早く開発に取り組めます。
- シンプルなデザインが構成されており、タイポグラフィやカラーパレット、スペーシングなどデザインシステムがすでに揃っている
- Variables によってライトモードとダークモードのスタイルが定義されている
- Code Connect によって、コードとデザインが紐づけられている
- React プロジェクトには Storybook が導入されており、コンポーネントをカタログとして閲覧できる
- プロジェクトに導入せずとも、とても参考になる
- デザインシステムが整備されていたり、基本的な Auto Layout やレイヤー構造など参考になるものばかり
- プロジェクトに導入する場合は社内プロダクトなど、ブランドイメージなどに左右されないプロダクトに導入するのが良さそう
- ブランドイメージなどによってデザインの改修が大きい場合、 Code Connect などが負債となってしまう恐れがある