Flance: フリーランサーの味方になるアプリ
フリーランスの業務を、プロジェクト管理・請求書発行・会計管理の3つの統合機能で効率化するモバイルアプリのリデザイン。
役割
プロダクトデザイナー、UI/UXデザイナー
期間
8週間
使用ツール
Figma、 Adobe Illustrator
カテゴリ
プロダクトデザイン・Webデザイン
Note
このプロジェクトの改修は現在進行中です。
デザイン概要と背景
- ビジネス背景: Flance は、プロジェクト管理・請求書発行・会計管理という3つの統合機能でフリーランスの業務を効率化するモバイルアプリのリデザインです。2022年にベトナム市場で「Frenlance」としてローンチ後、一時休止を経て、2024年10月に現代のフリーランサーのニーズに合わせて再始動しました。
- プロジェクトの目的: 8週間でプロジェクト管理機能の情報設計とデザインシステムを再構築し、サービス拡張に対応できるスケーラブルな基盤を整えること。
成果物 (実施中)
- 最新トレンドと整合するアートディレクションの刷新
- タスクフローを改善する情報設計の再構築
- 15以上のモバイル最適化コンポーネントによるデザインシステム化
- プロジェクト管理機能全体のインタラクティブプロトタイプ
課題
- 市場の変化: 2022年以降、フリーランスを取り巻く環境は大きく変化しました。現在は、若手ベトナム人フリーランサーのプロジェクト管理方法を調査し、当初の仮説が依然として有効かを検証するとともに、リモートワークの定着によって新たに生じた課題を明らかにしています。
- 情報量とモバイル制約のバランス: 初期バージョンでは、すべてのプロジェクトデータを同じ重要度で表示していたため、小さな画面では情報過多となっていました。十分な情報を保ちながら、素早く理解できるUIを実現することが、今も継続的な課題です。
課題解決
- 二形式の表示戦略: 3〜5件のアクティブ案件は横スクロールのカードで詳細に表示し、完了済み案件は縦方向のリストで省スペースに整理。ユーザーが「進行中のプロジェクト」と「アーカイブ」を自然に切り分けて認識できる構成。
- 段階的な情報開示: 指標を行動に結びつける展開型カードを導入。たとえば「期限超過 2件」のカードを開くと、即対応が必要な具体的なプロジェクトが表示され、ダッシュボード全体の情報量を抑えながら、詳細へのアクセス性を維持しています。
- アコーディオン型の詳細ビュー: プロジェクト詳細、クライアント情報、支払い概要の3セクションに分け、折りたたみ式で表示。長いスクロールを避けつつ、必要な情報に集中できる設計としました。
現時点の成果
- 一貫したビジュアルと操作パターンを備えた15種類以上のコンポーネントを制作
- 情報設計の最適化により情報過多を軽減
- 残りの機能にも展開可能なスケーラブルなデザインシステムを構築
- 5〜50件以上の同時進行プロジェクトにも対応できる柔軟なフレームワークを確立
