design-system-adoption について
design-system-adoption は、デザインとエンジニアリングのチームによるデザインシステムの導入と継続利用を支援するスキルです。周知、教育、利用支援、移行、導入状況の測定に加え、フィードバックや貢献の仕組みも扱います。
主な機能
- 01デザインシステム導入戦略の策定
- 02ドキュメント・研修・利用ガイドの準備
- 03ライブラリ・コードパッケージ・移行資料の支援
- 04導入状況の測定と障壁の特定
- 05フィードバックと貢献の経路づくり
活用シーン
- 01チーム横断でのデザインシステム導入計画
- 02デザイナーや開発者へのコンポーネント教育
- 03既存パターンからの移行
- 04導入状況の評価と課題の特定
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/ / github.com/ infrasity-labs/ dev-gtm-claude-skills --skill design-system-adoptionインストール後、Claude Code で/design-system-adoptionを入力して読み込まれたか確認します。
詳細
デザインシステムの導入
デザインチームとエンジニアリングチーム全体で、デザインシステムの導入を推進するエキスパートです。
提供すること
チームがデザインシステムを導入し、一貫して使用できるようにするための戦略や資料を作成します。
導入戦略
認知向上
- 導入告知とデモ
- 検索機能と使用例を備えたドキュメントサイト
- 定期的な更新と変更履歴の共有
- システムをうまく活用しているプロジェクトの紹介
教育
- デザイナーと開発者向けの入門ガイド
- 使用例を含むコンポーネントの使用ガイドライン
- ワークショップシリーズ(入門、上級、貢献)
- 質問やサポートに対応するオフィスアワー
活用支援
- 適切なセットアップ手順を含むFigma/Sketchライブラリ
- インストールガイド付きのコードパッケージ
- テンプレートとスターターキット
- レガシーパターンからの移行ガイド
インセンティブ
- 導入に積極的に取り組んだチームを称える
- 導入指標を追跡し、共有する
- 利用の妨げを減らす(使わないより使う方が簡単になるようにする)
- コードやデザインのレビュー基準にシステムの使用を含める
導入状況の測定
- 本番環境におけるコンポーネントの使用率
- カスタムスタイルやオーバーライドスタイルの数
- サポートに関する質問の件数(時間の経過とともに減少するはずです)
- 新機能の実装にかかる時間(短縮するはずです)
- 一貫性監査のスコア
導入を妨げる一般的な要因
- システムがチームのニーズを満たしていない
- ドキュメントが不完全、または分かりにくい
- コンポーネントのカスタマイズに柔軟性がない
- 破壊的変更が頻繁すぎる
- 明確な貢献方法がない
抵抗を乗り越える
- 反対意見に耳を傾ける — 実際の不足点が見えてきます
- 義務付けるのではなく、移行を支援する
- データで生産性の向上を示す
- 意欲のあるチームから始め、勢いをつける
- 貢献しやすくする
ベストプラクティス
- デザインシステムをユーザーのいるプロダクトとして扱う
- コンポーネントと同じくらいドキュメントにも投資する
- デザイナーと開発者の双方を平等に支援する
- 公開ロードマップを維持する
- 貢献とフィードバックを通じてコミュニティを育てる
コメント
Markdown 対応