デザインシステム後編〜そして運用へ〜
シナジーマーケティング株式会社で、CRMのプロダクトSynergy!のデザインを担当しています吉開と申します。前回に引き続き、今回は後編になります。前編読まれてない方はこちら。
はじめに
デザインシステムは、統一されたデザイン言語とコンポーネントを提供することで、製品やサービスの一貫性を保ち、開発プロセスを効率化するための重要なツールです。今回は実際に運用してみて感じたことや課題感について記載していこうと思っています。デザインシステム検討している、作ってみたけど運用できていない方達の参考になれば幸いです。
デザインシステムのもたらす効果について
デザインシステムは、一貫性の確保と効率の向上において重要な役割を果たします
一貫性の確保
プロダクト内で同じデザイン言語を使用することで、ユーザーに統一された体験を提供でき、一貫したデザインとインターフェースを享受することができます。これにより、使いやすさが向上し、ブランドイメージが強化され、ユーザーの信頼を得やすくなります。
効率の向上
デザインと開発のプロセスを標準化することで、プロジェクトの効率が大幅に向上します。共通のデザイン言語を使用することで、デザイナーと開発者のコミュニケーションがスムーズになり、誤解や再作業が減少します。これにより、作業時間が短縮され、プロジェクトの迅速な進行が可能となります。さらに、標準化されたデザインシステムはスケーラビリティを高め、新機能の追加や変更にも柔軟に対応できます。
厳格な基準 vs. 柔軟な基準
しかし、デザインシステムを採用することは、いいことばかりではありません。ルールを決めるということは、縛ることになるわけで、そこに融通を聞かせるべきかどうか、どこまでをルールとして守るべきかなど運用をしていく上で何度も悩みました。
厳格な基準
メリット
・デザインの一貫性を高く保てる。
・メンテナンスがしやすい。
・新しいデザイン要素の追加が慎重になるため、品質が保たれる。
デメリット
・創造性が制限される可能性。
・特殊なケースに対応しにくい。
・新しいアイデアやトレンドに柔軟に対応しづらい。
柔軟な基準
メリット
・デザイナーの創造性を発揮しやすい。
・ユーザーのニーズに素早く対応できる。
・特殊な要件にも適応しやすい。
デメリット
・統一感が失われやすい。
・管理が難しくなる。
・品質のばらつきが生じる可能性。
つらつらとメリットデメリットを書きましたが、要するに「バランスが大事」ってこと！んで、次っ！！
バランスを取るための方法
実際にバランスを取っていくためこういうことを意識してやってますみたいなものがこちらです。
1.コア原則の設定
基本的なデザイン原則を明確に定める。例えば、弊社の場合、色、タイポグラフィ、スペーシング、基本のコンポーネント（ボタンなどの小さな単位のコンポーネント）などの基本要素。
※コアにするものは後から変えづらいのでしっかりとした検討が必要
2.コンポーネントの階層化
必須のコアコンポーネントと、柔軟に変更可能なコンポーネントを区別する。ボタンなどのコンポーネントは原則変更不可。リストのデザインなどは情報量量などにレイアウトは左右されるので柔軟に変更可能
3.ガバナンス（統制）とフィードバックのプロセス
定期的なレビューとフィードバックを行い、必要に応じて基準を調整する。
4.ユーザー中心のアプローチ
ユーザーの使いやすさとわかりやすさを優先に考える。ユーザーからのフィードバックを取り入れ、デザインシステムを改善していく。
基準の設定方針
ではデザインシステムで定義する場合にコンポーネントの基準をどうやって決めていくかって話になるんですが、シナジーでは以下の３点を意識して取り組んでいます。
1.ユーザビリティテスト
ユーザーがどのようにシステムを利用するかをテストし、その結果を基に基準を設定する。（機能ごとのナレッジも合わせて蓄積したい）
2.アクセシビリティ
すべてのユーザーがアクセス可能であることを確認する。色のコントラストやフォントサイズなどを検討。
3.一貫性
デザイン言語が統一されているかどうかを常にチェックする。例外を許す場合は、その理由を明確にする。
結論
デザインシステムの運用において、厳格さと柔軟さのバランスを取ることは非常に重要だと感じました。実際にやってみて作るフェーズよりも運用するフェーズの方が大変だなと実感しています。
ユーザーの使いやすさとわかりやすさを最優先にしながら、効率的で一貫性のあるデザインを提供するためには、慎重な基準設定と定期的な見直しが欠かせません。
常にユーザーのフィードバックを取り入れ、システムを進化させ続けることがこれからも大切だと感じています。
前編は↓↓↓