デザインシステム

デザインシステムは開発の生産性を最大化しユーザーに一貫性のある体験を提供するための仕組み。

1. デザインガイドライン

2. UIパターン・コンポーネント

3. ライブラリ

などから構成され、パーツを再利用することで生産性を上げつつデザインの一貫性を保つ

デザインシステムの例¶

Material Design¶

• Googleのデザインシステム

• https://m3.material.io/

デジタル庁 デザインシステム¶

• サイト https://www.digital.go.jp/policies/servicedesign/designsystem

• Figma https://www.figma.com/@digitalagencyjp

SmartHR Design System¶

• https://smarthr.design/

• 基本原則で「わかりやすい」「親しみやすい」などコンセプトが定義される

• 基本要素でフォントや色などが定義される