INSPIX WORLDは、ユーザーが作成したアバターを介して、ボイスチャットや多様な3Dパーティゲームを楽しむことができる、次世代のソーシャルメタバースプラットフォームです。
本プロジェクトにおいて、INSPIX WORLDのUX/UIを総合的に改善し、ユーザー体験とプロダクト品質の向上、さらにFigmaベースのデザインプロセス整備によりチームの制作効率向上に貢献しました。

また、既存フローの改善だけでなく、リリースされる新規機能についても、企画段階からUXの検討・要件整理・画面設計まで一貫して担当しました。

成果

UIリニューアル

視認性・操作性が向上

主要導線の改善

主要導線のUXを整理

プロセス整備

デザインプロセスにFigma導入、デザインガイドライン作成により制作コスト削減

課題

1. UX課題 — ユーザーが迷いやすい導線構造

• 主要機能へのアクセスが複雑で、ユーザーが迷いやすい
• 基本的なユーザビリティデザインが担保されておらず、ユーザーに負担をかけやすい状態

2. UI課題— 一貫性と視認性の不足

• コンポーネントの統一性が低く、プラットフォーム全体を通して一貫性が弱い
• アイコンやレイアウトといった、UIのルールが曖昧
• 情報密度が高く、視認性が低い場面が多い

3. プロセス課題

• デザインに使用されているソフトウェアがPhotoshopのみで、デザイナーや開発チームでの連携がしづらく、共有に時間がかかる
• デザインシステムが存在せず、一貫したデザインを提供しづらい

ソリューション

1. UX設計：ユーザーフローの最適化

• 導線の整理
  コミュニティ、ゲーム選択など、主要機能へのアクセスを階層化し、全画面で一貫した操作ロジックを実現しました。
  既存フローの最適化に加えて、継続的に追加される新規機能についても企画段階からUX設計を担当。ユーザー理解をベースにした導線・構造の提案を行い、各アップデートにおける体験品質を一貫して維持しました。

• ユーザビリティ改善
  タップ領域の適正化、片手操作を考慮した要素配置、視認性の高い情報設計などを徹底し、メタバースという複雑な体験をモバイル環境でストレスなく楽しめる基盤を構築しました。

2. UIデザイン

・UIデザインリニューアル

既存のUIを、最新のトレンドとユーザー嗜好に合わせたモダンで洗練されたデザインへ段階的にリニューアルしました。
3Dメタバースの没入感を高めつつ、視覚的な魅力を向上させ、プロダクトのブランドイメージ刷新に寄与しました。

・モバイルUIデザイン手法の導入と標準化

既存のデザインプロセスにおいて、モバイルアプリ特有のユーザビリティ原則やアクセシビリティが十分に適用されていないという課題を特定。
Human Interface GuidelinesやMaterial Designなど、モバイルOSの標準的なUI/UX手法を設計に取り入れ、プラットフォームのUIガイドラインを刷新しました。

3. デザインプロセス改革：Figmaの積極的な導入

ツール移行の推進

複数デザイナーや開発チームとの連携を強化するため、デザインプラットフォームをFigmaに統一。これにより、デザインファイルの一元管理とリアルタイムコラボレーションを実現しました。

デザインシステム構築

Figmaを活用して、プラットフォーム全体で利用するUIコンポーネントのデザインシステムを構築・運用。これにより、3D空間の没入感を損なわず、かつ情報を確実に伝えることができる、一貫性のあるデザイン品質を迅速に提供できる体制を確立しました。

開発連携の効率化

Figmaのプロトタイピング機能やInspect機能を通じて、デザインの意図を正確かつ迅速に企画・開発チームに共有するフローを確立。デザインと実装間での手戻りを削減し、開発スピードの向上に貢献しました。

結果

ユーザー体験

• UIの一貫性が向上し認知負荷が軽減、ゲーム内の操作ミスが減少

チーム体制

• デザインの属人性が減少
• Figmaでの作業効率が大幅向上。共同作業がスムーズに
• デザイナー・エンジニア間の齟齬が軽減

プロダクト全体

• UI品質が向上
• 長期運用を前提とした仕組みが整備され、改修コストが削減

ロール

• UX課題の抽出
• 新規機能のUX検討（企画段階での要件整理、ユーザーフロー作成、UI草案）
• UIリニューアル
• Figma構造改善 / ガイドライン設計
• デザイナーの成果物レビュー