はじめに
enechainプロダクトデザインデスクのマネージャーの近藤（@add_kk）です。
1つ前のtakurintonの記事『デザインシステムの開発者体験向上の試み』に続いて、弊社のデザインシステムでの取り組みについて紹介させていただきます。
enechainでは会社全体のOKR *1 に基づき、4ヶ月サイクルで各組織がOKRを立てています。デザインシステムチームは専任メンバーがいない有志のチームであるため、OKRを設定する義務はありません。しかし、メンバーのモチベーションと使命感は高く、2024年1〜4月期からOKRを設定して取り組んできました。
デザインシステムのObjectiveは2つ。そのうち1つは現在開発中のプロダクトに関連するため、ここでは詳細を伏せますが、もう1つのObjectiveが「デザインシステムの民主化」でした。
デザインシステムの民主化
enechainのプロダクトに関わる全ての人のためのデザインシステムへ。 各プロダクトでのコンポーネント採用率を上げ、プロダクトの体験の質を向上する。 みんなで作るデザインシステム。
ちなみにOKRのライティングとしては、我々が目指す目標に対してモチベーションが上がることが重要なので、イデオロギー的な意味は特に持ってはいません。
なぜ民主化か
デザインシステムで提供するコンポーネントの追加、改修は大きく分けると以下のケースがあります。
- 有志のメンバーが担当するプロダクトで必要になったものを予めデザインシステムに作成し、プロダクト側で利用するケース
- 有志のメンバーが担当するプロダクトで作ったUIで共通化できそうなものをデザインシステムに取り込むケース
- 提供しているコンポーネントを利用するエンジニアやPdM、デザイナーから機能改善についてのリクエストが有り、これに応えるケース
- アクセシビリティやUX向上を目的として、デザインシステムメンバー発信でアップデートを進めるケース
私たちは、プロダクト開発の効率化や異なるプロダクト間での統一感のある体験、そして全体的な質の向上を目指してデザインシステムを開発しています。1と2のケースでは、プロダクト側のニーズに即した開発が基本となりますが、3のケースではメンバー外の開発者を巻き込むことで、より使いやすく、魅力的なコンポーネントを作成でき、不足しがちな開発リソース確保の改善も期待できます。4のケースでは、プロダクトに価値あるアップデートを提供するために、価値を伝える努力や対話が重要です。
この3と4にフォーカスし、より「プロダクト」に求められる形、「プロダクト」の「民意」が反映されるデザインシステムを目指していこうという決意が「デザインシステムの民主化」というObjectiveです。
そのObjectiveに紐づくKey Resultの2つ「目安箱」「株主総会」ともう1つの取り組み「デザインシステム名称の全社募集」についてご紹介します。
目安箱の設置と対応件数
enechainのデザインシステムでは、実装に関する質問や機能リクエスト、新しいコンポーネントの提案などをいつでも気軽に記入できる「目安箱」をNotion上に設置して運用しています。この目安箱は昨年設置され、すでに社内で認知されており、活用されています。（目安箱導入についてはこちらの記事を参照）
基本的には、リクエストや質問が寄せられると即対応、もしくは週次定例で対応方針の決定や対応者のアサインをして進めます。しかし、議論が必要なものやリソース不足で放置されてしまうケースもありました。この反省を踏まえ、リクエストへの対応を強化し、その対応件数をコミットメントとしてKR（Key Result）に設定しました。
コミットするために具体的に意識したことは以下です。
- 目安箱の起票から一次回答、ヒアリング、担当者アサインまでをスピーディに行う
- 起票者がエンジニアであれば、コントリビューターとしての参加をお願いしてみる
- チーム内での修正依頼、改善提案も小さいものであれば目安箱に起票して非同期に進める
これらはなかなかに効果があり、目標としていた対応件数は150%以上の実績でクリアすることができました。件数の達成よりももっと大きな結果として
- デザインシステムのコアメンバー以外からのPRが増えた
- 有志のコアメンバーだけで行っていた開発では常にリソース不足を感じていたが、プロダクトに必要な機能の実装スピードが上がった
以上が得られたのはとても大きかったです。
デザインシステム株主総会の開催
「デザインシステム株主総会」とは、デザインシステムのステークホルダーであるプロダクトチーム、エンジニア、PdMをもっと巻き込むための情報発信と意見交換の場です。（「民主化」と謳いながら「株主総会」という資本主義的な用語を使っていることについてはツッコミどころ満載ですが、社内OKRとしてネーミングを優先しているため、ご容赦ください）
これまでもプロダクトやプロジェクト全体の進捗発表の場はありましたが、より深い情報発信や意見交換の機会を提供し、耳だけで作業しながら参加できる形式にすることで、参加しやすい形を目指して新たに始めました。
1〜4月期で開催した内容は以下です。
第一回：前期の事業報告と今期の事業計画について
前期のデザインシステムの成果の報告と新しい期で取り組むテーマ、OKRの発表と展望について。新しい期に望むデザインシステムチームの決意表明でもある。デザインシステムチームからの発表、そして株主からの質疑応答と「株主総会」を意識したスタイルでの開催。
第二回：プロダクトAで先行して実装した新・共通UIと今取り組むべきアクセシビリティ
全プロダクトでアップデートしたい新しい共通のUI・レイアウトの紹介と、その中で対応したアクセシビリティ考慮点。そして今後enechainプロダクトとして取り組んでいきたい、取り組む必要のあるアクセシビリティについて。
第三回：プロダクトBで取り組んでいたカレンダーコンポーネントのFIXまでのプロセス振り返りとユーザー像をどうイメージするか
このカレンダーコンポーネントは当初のUI・機能の想定から最終FIXまで非常に時間がかかったが、その原因はどこにあったのか。プロセスとして反省が必要だった点とPdMがユーザー像をどうイメージしているか。
第一回の「デザインシステム株主総会」は、「株主総会」を意識したスタイルで、事前に準備をしていた台本に基づいて実施しましたが、そのスタイルで毎月や隔月で継続していくのは内容的にも準備コスト的にも無理があったため、方向転換しました。質疑応答形式の意見交換ではなく、もっと直接的かつカジュアルに意見交換や議論を行うことで、本質的な意見やアイデアを得られるのではないかという転換です。この方向転換により、株主（ステークホルダー）のもとへ直接出向いて、より具体的で本質的な対話を重視することにしました。
Notion上で急にカジュアルになる株主総会アイデアポータルページ
手応えとして以下のような意見が上がってきました。
- デザインシステムのメンバーでもあり、プロダクト開発メンバーでもある中でコンポーネントやUI、プロダクトにどう向き合っているかを振り返り、共有できたのは良かった
- プロダクトで使われるためのデザインシステム、という方向性の再確認
結果として、この方向転換は良かったのではないかと感じています。
デザインシステム名称の全社募集
開発組織内での浸透や巻き込みだけでなく、会社全体にも「enechainのデザインシステム」としての価値を提供したいという思いから、全社を対象にデザインシステムの名称アイデアを募集しました。会社全体の事業進捗や意思決定の共有の場で時間をもらい、デザインシステムの紹介と名称募集を案内しました。
エンジニアやデザイナー以外のコーポレート・ビジネスサイドからも多くの良いアイデアが寄せられました。
現在、名称の決定については慎重に検討を進めています。ただ単に「デザインシステム」と呼ぶよりも、関わる全員が愛着を持ち、「自分たちのデザインシステム」として自分ごとと感じられるものにしたいと考えています。
まとめ
OKRを意識して取り組む中で、「プロダクトに価値を提供できるデザインシステムになる」に向けて歩みを進めることができました。
今回の記事で取り上げた取り組みによって得られた成果は以下です。
- デザインシステムでどんな価値を提供できているかを知ってもらう
- その上でより具体的なニーズを引き出す
- 誰かが作っているデザインシステムではなく、みんなで作っているenechainデザインシステムという自分ごと化
- 開発に気軽に参加できる、コントリビュート出来るという空気感
そして次のステップに向けての新たな課題が見えてきています。引き続き、目指すデザインシステムの民主化に向けて、現在の5〜8月期でもアプローチを変えて新たなアクションを取っていきます。新しい取り組みや成果はまたこのブログで紹介できればと思いますので、ご期待ください。
enechainでは一緒に事業を拡大していける仲間を絶賛募集中です。デザインシステムやプロダクトのより良い体験を目指しながら、新しいエネルギーの取引と価値を一緒に作っていきたいチャレンジングなデザイナー、エンジニアの応募をお待ちしています！
*1:Objectives and Key Results 目標設定・管理方法の1つ。参考記事：https://rework.withgoogle.com/jp/guides/set-goals-with-okrs
