どのようにファンのためのデザインを行いますか？

ファンテック · 消費者向けモバイル · グローバルUX

ファンフレアは、ファンがキャンペーンを支援できるモバイルアプリです。ビルボード広告、誕生日イベント、チャリティープロジェクトなど、インディーズアーティストのために利用できます。

Timeline

2024年11月〜2025年2月

Team

プロダクトデザイナー、デザインリード、プロジェクトマネージャー、開発者

Role

プロダクトデザイナー・単独でのエンドツーエンド

Skills

UXリサーチ · デザインシステム · UIデザイン · プロトタイピング

問題の声明

ファンコミュニティは非常に熱心に活動していますが、既存のプラットフォームでは慢性的にサポートが不足しています。Weverseはソーシャルな面を、Patreonは資金調達を、Ko-fiはチップを担当しています。しかし、その全てを文化に合わせて作られたと感じられる形で対応するものはありません。

私は、K-POP、VTuber、コスプレコミュニティの12人のファンに対して調査とインタビューを実施しました。データは明白でした。

92％が透明な寄付追跡を「非常に重要」と評価しました。75％がキャンペーンを見つけ参加するのに苦労していました。これらは好みの評価ではなく、信頼性の欠如を示しています。

既存のプラットフォームは単に不便であるだけでなく、ファンと彼らがサポートしようとしているアーティストとの関係を悪化させていました。資金は投入されても、それがどこに行き、何をしているのかという明確なフィードバックがありませんでした。感情的な投資を基にしたコミュニティにとって、それは致命的な欠陥です。

誰のためにデザインしたか

リサーチから3つの異なるユーザータイプが浮かび上がりました。それぞれモチベーションやフリクションポイントが異なります。

献身的なスーパーファン — 非常に活発で、経済的にも貢献しており、自分の貢献に対するステータスや可視性を求めています。

気軽なサポーター — 時折参加し、簡単なエントリーと明確な影響を求めています。

コミュニティのオーガナイザー — 複数のプラットフォームでキャンペーンを調整し、管理の手間を減らすツールを必要としています。

グローバルな視点がすべての決定に影響を与えました。ソウルのK-popファンやジャカルタのVTuberファンは、階層、贈答のマナー、コミュニティ認識について異なる文化的期待を持ちながら、同じアプリを使用しています。分けた体験を作ることなくそれに対応することは、この設計において興味深い課題でした。

UXデザインのワークフロー

まず競合分析。3つのカテゴリにわたる8つのアプリ：ファンコミュニティプラットフォーム、イベント追跡ツール、クリエイター支援アプリ。コピーする機能を探していたわけではありませんでした。私はホワイトスペースをマッピングしていました：どこのアプリも上手くできていないこと、信頼が崩れる場所、インターフェースに無視されているコミュニティの行動。

ユーザーフローは、画面に触れる前にマッピングされました。寄付フロー、キャンペーン発見フロー、貢献確認—ユーザーの信頼が最も高くリスクにさらされている瞬間のそれぞれをストレステストしました。それは、ユーザーがお金を出して、そのお金が価値のあるものであったと感じるのを待っている時です。

低、中、高の忠実度、それぞれのステージは特定の質問によってゲートされます。低忠実度は答えました：階層が理にかないますか？中忠実度は答えました：インタラクションが成立しますか？高忠実度は答えました：これがこのコミュニティに属していると感じられますか？

このプロジェクトの最終40%は文化的流暢さ—つまり、アプリをただ機能的にするだけでなく、ファンダムにネイティブに感じさせることでした。

デザインシステムの構築

ファン文化には視覚的な言語があります。丸みを帯びた形。柔らかなエネルギー。企業的でなく、温かさと祝祭を感じさせる色彩。私はそのデザインシステムを、それを基に構築しました——美的選択ではなく、戦略的な選択としてです。ユーザーの感情と対立するデザインシステムは、まだ画面に触れる前から摩擦を生みます。

ラテン文字とCJK文字を含む文化的識字性と階層性を考慮したタイポグラフィのペアリング。アクセシビリティを最優先し、ブランドの個性を二次的に考慮したカラーパレット——複数の言語や画面条件で使用されるアプリは、雰囲気のために読みやすさを犠牲にすることはできません。キャンペーン、コミュニティ、プロフィールのすべての面で再利用できるように構成されたコンポーネントライブラリは、視覚的に混沌としがちなフィード内に落ち着きを作り出します。

すべてのコンポーネントがドキュメント化されています。すべての決定が弁護可能です。このシステムはこのバージョンのアプリのために構築されたのではなく、次の3つのバージョンにスケールさせるために構築されました。

最も重要だったインタラクション

寄付確認画面。この画面はアプリ全体の中で最も信頼が高い瞬間です — ユーザーは自分が応援するアーティストにお金を寄付したばかりです。この画面では、同時に3つのことを行う必要がありました: 取引の確認、即時の影響の表示（「あなたは今、キャンペーンのランキングで#12です」）、そして共有をスムーズにすることです。私はユーザーテストで常に適切な感情的反応を引き出すバージョンに辿り着くまで、4つのバージョンを試しました。

キャンペーン発見。調査を受けたファンの75%はキャンペーンを見つけるのに苦労していると答えました。解決策はフィルターを増やすことではなく、より良いデフォルトを設定することでした。キャンペーンは最初にコミュニティの近さで、その次に活発な動きで表示されました。VTuberをフォローするファンはVTuberキャンペーンを探す必要がないはずです。アプリがすでに知っているべきです。

寄付のリーダーボード。83%のユーザーが寄付に対するランキングやバッジを求めていました。しかし、ファンコミュニティでの公開リーダーボードは社会的リスクを伴います — 誰も自分より上にいる人物よりも見かけ上関与が少ないと思われたくありません。私はユーザーが自分の順位を公開、準公開、または非公開にするかをコントロールできるオプトイン型の可視性を設計しました。圧力が減少したとき、エンゲージメントが向上しました。