段階的に導入するデザインシステム by Yuto Yazaki

アバター作成・ライブ配信などを楽しめるスマートフォン向けメタバースアプリ「REALITY」では、デザインの一貫性や生産性を向上するためにデザインシステムを導入しています。
デザインシステムを構築するには、タイポグラフィ、カラー、UIコンポーネントなど多くの要素が必要であり、既存のプロダクトに取り入れるのは非常に労力がかかります。
このトークでは、機能開発の傍らでデザインシステムを段階的に導入していった経験と、2年間にわたり続けた結果どのような効果が得られたか、「REALITY」のiOSアプリにおける実例を元に紹介します。

• アプリにデザインシステムを少しずつ導入していくステップ
• デザインシステムによって、アプリ全体のカラーテーマの調整が容易になったこと
• FigmaからXcodeへ画像アセットを自動エクスポートすることで効率化したこと
• Figmaを使ったUIコンポーネントの管理と、SwiftUI/UIKitでの実装