マルチテナントアプリにおけるデザインコンポーネントの管理方法 - Hatena Developer Blog

こんにちは。マンガアプリチームでデザイナーをしている id:gano-k です。 GigaViewer for Apps(以下、GigaApps)は、マンガアプリに必要な「ビューワ」「作品詳細」「マイページ」などの基本機能を共通モジュール化し、複数のサービスで再利用できる仕組みを提供しています。 各サービスごとにカスタマイズされたUIを提供しつつも、裏側では共通の基盤が動いているのが特徴です。 このような構造の中でデザインを行う際には、「各サービスへの最適化」と「再利用性を担保する共通設計」の両立が求められます。 『Inside GigaViewer for Apps』連載10回目は、GigaAppsにおけるマルチテナント対応のデザインコンポーネント設計と、その実践的な工夫についてご紹介します。 デザイン時にマルチテナントで気をつけていること Figmaを利用したコンポーネント管理 複雑な

[mohri]

「コミックガルド＋では青色。右の少年ジャンプ＋では赤色を使っています。 両方とも同じFigmaコンポーネントを使っていますが、FigmaのLocal variables機能を活用することで、サービスごとに異なる色を自動的に適用できる」