こんにちは、estieでデザイナーをしているKio（@k7a_design）です。
デザイン組織の取り組みの1つとしてデザインシステムの構築に取り組んでいる会社は多いと思います。これまであまり発信していませんでしたが、弊社もこの取り組みをしている会社の1つであり、特に2023年より活動を本格化させております。
私自身、数社でデザインシステムの構築に関わってきましたが、プロダクト戦略的にestieが取り組むことは非常に投資対効果が高いと思っています。
本日は、estieにおけるデザインシステムの必要性と取り組みについてお話しします。
estieのプロダクト戦略
estieでは、Whole Product構想を掲げています。
Whole Productとは「自社の付属品や関連サ―ビスだけでなく、サードパーティの連携サービスなどが増え、製品・サービスを活用することで、顧客が望んでいた目的を果たせるだけでなく素晴らしい顧客体験を得ることができるプロダクト」のことを指し、それに向けてまずはオフィス不動産の複数業務領域でプロダクトを展開することで、バリューチェーンの拡大を目指しています。
さらに、物流やホテルなど商業不動産領域におけるアセットタイプの拡大や海外市場をはじめとしたエリアの拡大も目指しています。
既に社内ではバリューチェーンとアセットタイプの拡大に向けて、続々と新しいプロダクトが立ち上がっている状態にあります。
詳しくは下記記事をご覧ください。
デザインシステムの必要性
同じプロダクト内で一貫性のあるUX/UIを提供すべきことは、皆さんご存知の通りです。それに加え、estieではプロダクトを跨いでも迷わず利用できるように、一貫したUX/UIを提供する必要があります。それは、Whole Product構想でバリューチェーンを拡大するにあたり、同一ユーザーが複数プロダクトを利用することが考えられるためです。
現在、estieのデザインチームは8名おり、各プロダクトにつき1~2名ほどアサインされています。基本的にプロダクト毎のチームに別れて動いており、全員が各プロダクトの施策やデザインを全て把握している訳ではありません。また、事業のスピーディーな成長を止めないためにも、デザインの意思決定は各プロダクトの担当に任せられています。
複数プロダクトでの一貫性を維持するためにレビューなどのコミュニケーションで解決するという手段もありますが、estieではデザインシステムを構築することでUX/UIの一貫性と事業のスピーディーな成長を両立させようとしています。
今後もプロダクトラインナップもデザイナーもどんどん増えることが想定されるため、各プロダクトにアサインされたメンバーが最小限のコストでestieのデザインを再現できる仕組みを提供し、事業の立ち上げ・グロースに集中できる状態を目指しています。
デザインシステムの取り組み
estieのデザインとして大事にすべきことを定義したデザイン原則を元に、大きく分けて3つの取り組みを進めています。 簡単にそれぞれの状況を説明します。
ガイドラインの策定
レビュー時やMTG中の論点から共通ルール化できそうなものを、UIやコンテンツのガイドラインとして定義しています。
業界に特化したプロダクトを提供しているため、各デザイナーは商業用不動産の商習慣の理解や、それにに合った解法の検討に多くの時間を費やす必要があります。なので、各デザイナーの中に溜まったナレッジを取り込み、UIやコンテンツのガイドラインとして展開することの投資対効果が大きいと考えております。
最近では、賃料や面積などの単位表現の最適解に関して議論しました。共通化できそうなナレッジを見つける度に、少しずつ充実させていきたいと考えています。
デザインデータ（Figma）の提供
一般的なコンポーネントに関しては一通り用意でき、基本的なユースケースには対応できる状態にありますが、まだまだパターンが不足しており痒いところに手が届く状態ではありません。
また、Figmaのアップデートにも対応しきれておらず、改善の余地はまだまだある状態です。
UIライブラリの提供
直近最も力を入れて取り組んでいます。各プロダクトでUIライブラリを利用して貰えれば一貫性にも大きく寄与しますし、スピーディーなプロダクトの立ち上げにも大きく貢献できると考えています。また、estieではバックエンドを得意とするエンジニアもフロントエンドの実装をすることが多いので、慣れていなくてもスピーディーに実装とデザインの再現をできる状態を作りたいと考えています。
デザイントークンの配信は全プロダクトにできており、最近、UIコンポーネントの作成に注力し始めた段階になります。デザイントークンの配信に関してはkyoncy（@kyoncy_site）がブログ化していますので、是非ご覧ください！
デザイントークンを配信しestieの全プロダクトに導入しました - estie inside blog
さいごに
プロダクト戦略的にもデザインシステムの必要性が高く、チームで構築を進めていますが、プロジェクトとしては始まったばかりで改善の余地がたくさんある状態です。
特に最近のイシューとしては、作成したデザインシステムの効果指標をどのように定義し、どのように計測するかです。測りにくいことは理解しつつ、この取り組みの意義を証明したり、活動をより有意義なものにするために必要だと考えています。
もし、知見のある方や一緒にデザインシステムの構築に取り組みたいという方がいらっしゃいましたら、是非お話しさせてください！estieでは、デザイナー/デザインエンジニアとして一緒にお仕事できる方を積極的に探しております。
