シナップのデザインシステム開発の強み
デザインシステムとは
デザインシステムとは、UIキットやスタイルガイド、ブランドガイドラインなどによって構成され、デザインする、またはデザインについて議論する上での唯一の指針で、組織全体におけるデザインの共通言語となるものを指します。
組織内で一貫したデザインルールやブランドイメージの構築を目指したり、デザイン概念や原則を共有したりすることで、Single source of truth(「信頼できる唯一の情報源」の意で、情報が色んなところに分散しておらず、デザインについてはここを見れば分かるという状態)の実現を目的として制作されます。
シナップの提供価値
シナップでは、これまで様々な企業でデザインシステムの開発・導入を支援してきました。
デザインシステムは、「作って終わり」ではありません。サービスの成長に合わせ継続してメンテナンスしなければ、デザインシステム本来の効果を得ることはできません。デザインシステムを導入したものの、その後に運用されず、デザインルールやコンポーネントが陳腐化して、結局使われていないという話をよく耳にします。
正しく使われるようにするためには、例えばStorybookを用いたパーツ管理など、利用者が使いやすく、閲覧しやすい環境を整えた上で、運用フローまで整備する必要があります。
シナップでは、単なるデザインシステムの構築だけでなく、その後に継続的に成長させていくための運用フロー・プロセスまで設計を行い、正しく利活用できるデザインシステムを構築します。
サービス内容
デザインシステム導入の流れ
対象サイトの範囲や現時点の整理内容など、実際の流れはクライアントの状況によって様々ですが、ここでは一般的なデザインシステム導入の流れをご紹介します。
STEP 01. 現状整理と方針の決定
デザインシステムを導入・運用するサイトの範囲を整理し、対象範囲を定義します。また、対象範囲内で利用するブランドコンセプト、カラーパレットなどのデザイントークンの定義および複数サイトへの導入の場合は、ガバナンスの定義を行います。
主なタスクや成果物
STEP 02. コンポーネントの整理とデザインの調整
各画面ごとに使用しているUIパーツを全て洗い出し、パーツの統合や分割を行い、コンポーネントリストを制作します。また、各コンポーネントに対して、デザイントークンの内容に則りデザインの調整を行います。
制作したコンポーネントリストをもとに、実際の画面への反映可否を検証し、コンポーネントに過不足がないか確認します。
主なタスクや成果物
STEP 03. 実装
整理したコンポーネントリストを実装していきます。実装時は、以降の運用を考慮し、コンポーネントの追加・削除がしやすいようにコンポーネントの分割単位に注意しながら行います。シナップでは、アトミックデザインの思想を取り入れ、原子・分子・生体の単位でコンポーネントを制作していきます。
主なタスクや成果物
STEP 04. 各種ガイドラインの作成
カラーパレットやレイアウトルール、インタラクションなどのデザイントークン、ブランドコンセプトなどを、デザインガイドラインとしてドキュメント化します。
そのほか、実装ルールや、デザインシステムの運用方法をまとめた各種ドキュメントも整備し、利用者がスムーズにデザインシステムを利活用できる環境を構築します。
主なタスクや成果物
代表的な手法を掲載しています。プロジェクトに合わせて最適なプランをご提案します。
シナップが提供するサービス
UXデザイン
ユーザーのことをよく理解し、サービス全体の中でその体験がどうあるべきかを、ユーザーの視点、ビジネスの視点それぞれで考え、課題の抽出、要件定義、解決策の提示を行います。
フロントのデザインやUIといった表層的な部分だけでなく、機能やインフラ、さらにサービスを実現するための運用やオペレーションまで、サービスを取り巻く広い範囲で考えることが得意です。
サービス提供例
新規事業開発からWeb戦略、サイトの制作・開発、グロース・運用まで幅広いサービスを提供、パートナーとして伴走支援します。