株式会社エアークローゼット株式会社エアークローゼット
icon_chevronicon_chevron
ファッションレンタルサービス『airCloset』のデザインシステム刷新支援
ファッションレンタルサービス『airCloset』のデザインシステム刷新支援
デザインシステム刷新による開発連携強化と、PDCA高速化を支える基盤構築
nijibox_designparts
クライアント
株式会社エアークローゼット
当社スコープ
既存サービスの改善
体制

クライアント:

  • プロジェクトオーナー:1名
  • テックリード:1名
  • リードデザイナー:1名

ニジボックス:

  • リードデザイナー:1名
  • AIアーキテクト:1名
  • UIデザイナー:2名
期間

2025年10月〜2026年1月(現状整理・設計・デザインデータ制作)

実施内容

現状調査・課題抽出

  • 既存デザインデータ・実装コードの棚卸し
  • コンポーネント使用率および命名規則の調査

デザインシステムの再構築(Ver.2)

  • Figmaファイル構造の最適化(ライブラリ統合)
  • FigmaのVariables(値を一元管理する機能)を活用したトークン設計
  • エンジニアリング視点を取り入れた命名規則の策定

AI活用検証(PoC)

  • Figma Make / MCPサーバー連携による自動化の可能性検証
nijibox_designparts
クライアント課題
『airCloset』では2020年に策定されたデザインガイドラインが存在していましたが、サービスの成長とともに運用環境や開発体制が変化し、実装コードとの整合性が徐々に失われていました。その結果、一部でデザインの逸脱や一貫性のない独自コンポーネントが増加し、UIの再利用性や保守性に弊害が出始めていました。 また、Webとアプリ間での表現の差異が生じていたため、どのチャネルからでも迷わず直感的に操作できる「統一されたユーザ体験(UX)」の提供が今後の重要テーマとなっていました。 事業KPIである「リリース数の最大化」を実現するためには、デザインとエンジニアリングの連携を強化し、迷わず活用できる再利用性の高い基盤を整備する必要がありました。
「airCloset」とは?

プロのスタイリストがコーディネートした洋服が自宅に届くファッションレンタルサービス。「返却期限なし」「クリーニング不要」。気に入ったら購入も可能で、「何度も」新しい洋服との出会いが楽しめます。

サービスリンク:

https://www.air-closet.com/

nijibox_designparts
ミッション
ミッション・アウトプット見出し:エンジニアと共通言語で対話できる「実効性」の高いデザインシステムへの転換
No items found.
No items found.
nijibox_designparts
ソリューション
単なるビジュアル整理ではなく、「開発現場で使われ続ける構造」を目指し、実装との整合性を前提とした再設計を実施。併せて、将来的なAI活用を見据えた技術検証も並行して行いました。
nijibox_designparts
現状資産の定量的な棚卸しと構造課題の可視化

既存のFigmaデータと実装コードを横断的に調査し、「実際に活用されている要素」と「活用が限定的な要素」を定量的に整理。現場の実態に即した粒度で再設計の優先順位を定義しました。

No items found.
nijibox_designparts
調査結果を踏まえた改善方針の設計と合意形成

調査フェーズで可視化した課題をもとに、デザインシステムのあるべき構造を再定義。コンポーネントの粒度、ファイル構成、トークン設計、命名ルールなどを横断的に整理し、開発側の視点も踏まえながら改善方針を策定しました。

単なるルール変更ではなく、「なぜその構造にするのか」「実装とどう接続するのか」といった観点を共有し、デザイナーとエンジニア双方が納得できる形で合意形成を行いました。

その結果、再利用性と実装効率を両立させる設計指針を明文化し、以降の整備・移行フェーズへと進める基盤を整えました。

No items found.
nijibox_designparts
MCPサーバー連携を見据えたAI活用の実証検証

デザインシステム構築と並行し、将来的なAI活用による制作プロセスの自動化に向けたPoC(概念実証)を実施。Figma MakeやMCP(Model Context Protocol)サーバーの活用可能性を検証し、デザインデータと実装コードを連携させるフローの実現性を整理しました。

現時点での実現可能性と技術的制約を整理。今後の導入に向けた具体的な検討材料を提供しました。

No items found.
nijibox_designparts
マスターデータの再整備と運用基盤への反映

設計したデザインシステム(Ver.2)を単なる設計資料に留めず、実際のマスターデータへ反映。既存画面にもコンポーネント・トークンを段階的に適用し、運用可能な状態にしました。

併せて、Figmaのブランチ機能を活用した運用フローの整理も行い、「設計 → レビュー → マスターマージ → 開発連携」までを一連の流れとして再設計。

これにより、整備したデザインシステムが現場で継続的に活用されるための基盤を構築しました。

No items found.
nijibox_designparts
No items found.
nijibox_designparts
成果
開発サイクルのさらなる高速化を支える、共通基盤の再構築

デザインシステム(Ver.2)の構築により、UIの一貫性を担保しつつ、エンジニアがコンポーネントを適切に選択・実装できる環境を整備しました。

これにより、新規施策における設計・実装の効率化や、オンボーディングコストの低減が期待される基盤を構築。結果として、事業成長に直結するPDCAサイクルのさらなる高速化を支える土台づくりに貢献しました。

お客様の声
nijibox_designparts
株式会社エアークローゼット
株式会社エアークローゼット プロダクトイノベーションディヴィジョン UI/UXデザイナー
谷口 大和
株式会社エアークローゼット

エアークローゼットでは「"ワクワク"が空気のようにあたりまえになる世界へ」をVisionとして、主要サービスである『airCloset』において、レンタル×パーソナライズの新しいファッション体験をよりお客様に楽しんでいただくため、日々さまざまな機能拡充を図っております。

一方で、それに伴う機能開発や新規チャネル開設が盛んに行われるようになった中で、従来のデザインシステムではそうした機能拡張に対応し切れなくなっていました。そこで改めてデザインシステムを再構築するにあたり、よりスピーディーに改善を進めるべくニジボックス様にお力添えいただきました。

今後の事業成長へフィットしていく、体系的かつフレキシビリティのあるデザインシステムの在り方について、システムの全体像から、実際にデザイナーが行う具体的な更新・運用部分まで、現場視点に立った解像度の高いご提案をいただきました。

※本記事の内容は、記事作成当時の情報です
開発についてもお気軽にご相談ください
開発について詳しく見る
UI UXデザインのお役立ち情報を無料公開中!
nijibox_pattern
nijibox_資料ダウンロード
UI UXデザイン概要やその他の実績も掲載!
ニジボックスはリクルートのノウハウを活かし、お客様の事業フェーズに合わせて、UXデザインフローをご用意。課題に即したサービスを提供しております。
こんな方におすすめ
square
ニジボックスの強みを知りたい方
square
具体的なデザインフローを知りたい方
square
ご相談事例ごとの参考価格を把握したい方
ほかの実績
実績一覧へ戻る