Back Copy 3 back
エンターテイメント

Joy Joi

image

アイドルとの交流に革新をもたらす、バーチャル握手会プラットフォーム「JoyJoi」は、ファンが日本のアイドルと仮想空間で会える場所です。

ファンのためのオンラインプラットフォームとしては初めてFlutterで構築されています。Flutter は数万人のユーザーが利用する、ビデオ通話にも対応したツールです。

//概要 _

JoyJoiは、エンターテインメント業界で多くの実績を誇るPulse by IGNIS発のアイデアとして誕生しました。JoyJoiは新型コロナウイルスが世界的に蔓延する中、日本のアイドルとファンをビデオ通話で繋ぎ、その交流を支援しています。日本では2020年3月以降、すべてのイベント会場が閉鎖されているため、Pulse by IGNISは、ファンとVoyzBoyzとのつながりを維持するために一歩前進することを決めました。ファンがチケットを購入して、好きなグループのアイドルと会えるバーチャル握手会のプラットフォームです。このプラットフォームは、現実を完全に再現したシミュレーションとなっています。

メリットは、ファンが握手以上のものを得られることです。握手会では、アイドルと仲良くなって自己紹介をしたり握手をしたりする時間が圧倒的に少ないという欠点があります。この新たな交流方法なら、チケットを購入することで騒音に邪魔されずにアイドルと長時間話すことができます。握手会にとって代わる、1対1のバーチャルなコミュニケーションが実現したのです。

私たちのチームは、プロジェクト初期の計画段階から参加しました。Pulse by Ignis と共同で、プラットフォームの全体像や開発〜発売までのロードマップを決めました。

本プロジェクトでは、システム建築、製品開発、ITコンサルティング、ウェブアプリの構築、カスタムAPI、ホスティングインフラ、プロジェクト管理、QA、複雑なシステムをシンプルで使いやすいUIやUXに設計することなどを行いました。

Back Copy 3 Back Copy 3

// 課題_

Pulse は、日本各地で大きなイベントやコンサートを開催し、ファンと触れ合い、最高の歌を届ける、というグループのための大きな計画を掲げていました。世界中の誰もが予想していなかった世界規模のパンデミックによってこの業界は特に大きな打撃を受けました。

Pulse は、このような事態を目の前にして、すぐにアイドルとファンをオンラインで結びつける計画を立てました。イベントを再現する形でバーチャル握手会を開催し、イベントで得られる体験をファンに提供すると同時に、距離があること・デジタルであることの利点を活用していく計画です。

Pulse には、安定性、拡張性、俊敏性、そして使いやすさを備えたソリューションが必要でした。チケットプロバイダーとの接点、複数のチャンネルへの接続、何万人ものユーザーとの同時接続、ビデオ通話のサポートなどが可能となるソリューションです。

これは即座に解決しなければならない問題でしたが、事態がどのように進展していくのか誰も分からなかった当時、10~20人のプロチームを集めることは困難でした。Pulse は、2020年4月の時点で計画実行の準備ができていましたが、エンジニアが不足していました。

技術的課題

このシステムのリアルタイム性と分散性が特に大きな課題でした。

  • 毎秒大量のメッセージを迅速かつ確実に処理しながら参加者全員に対する一貫性と信頼を確保し、特定メンバーが観察できる機能を付けるにはどうすれば良いのか。
  • 何百人ものユーザー(その全員が1つのバーチャル待合室で待機するという実際の待ち行列のシミュレーション)に、握手会の待ち時間が数秒短縮されたというニュースを効果的に一斉伝達するにはどうすれば良いのか。

これらの課題にはすべて解決の余地がありましたが、まずは思考し、下書きをする必要がありました。しかし、できるだけ早くMVPを提供し、その上で構築を続けなければならなかったので、足踏みしている時間はありませんでした。Dejan Jankovを中心としたエンジニアチームがこの課題に取り組み、次のような解決策を導き出しました。

Back Copy 3
Back Copy 3

// ソリューション_

導き出したソリューションは、アイドルとのバーチャル握手会を、ファンにとってユニークで迅速かつシームレスな体験にするためのカスタムメイドしたプラットフォームです。

バックエンド

Web Factoryのチームは、Spring Bootを利用してバックエンドを開発しました。フレームワークには、製品ドメインに関係なく標準的な要素を使用しています。これらの一般要素には、メール送信やプッシュ通知、ユーザー情報とアクセス管理、JWT認証、その他さまざまな本番用モジュールや開発用モジュールが含まれており、これらをそのまま使用したり、カスタマイズしたり、コピーしたあとで変更したりすることができます(法的な理由から)。私たちはこのようにして開発をスタートさせました。

フロントエンド

フロントエンドのアプリケーションは、構成や用語に関してバックエンドと同じ手法を取り入れています。TypeScriptを用いて、モジュール式で柔軟性のあるAngular 10+アプリケーションを書き出しました。ここには、バックオフィス・アプリケーション(別名:管理パネル)も含まれます。 モバイルアプリケーションは、クロスプラットフォームのフレームワークであるFlutterを使って開発しました。その際、ビデオ通話の複雑な操作性を実現するためにiOSとAndroidのネイティブコードで処理すべき項目が複数ありました。

QA

QAチームは、製品開発や技術開発への取り組みに関わる重要なテストケースを担当しました。自動化されたテストケースはQAプロセスの一部であり、Web FactoryとPulse by IGNISのチームから高評価と感謝をいただきました。

フロントエンドとバックエンドのアプリケーションによるプロジェクトのキックオフ。

10人のチームを立ち上げ

Timeline Synca card 4

Pulseとの緊密な連携によるビジネス分析と製品定義

製品の直感性を実現するために、

何度も繰り返してワイヤーフレームの提案を修正・改善しました。

Timeline Synca card 7

ファンのためのモバイルアプリケーションの導入

ユーザーベースの分析に基づくスコープの変更。

チームの成長とモバイル専門チームの結成。安定した新しいクロスプラットフォームとしてのFlutterの推進

開発フェーズ、QAテスト、UI

Web FactoryとPulse側で複数回のテストを実施し、改良のためのフィードバックを収集

安定化フェーズ、手動・自動テスト。本番環境とステージングのセットアップ

テストセッションからのフィードバックの分析、スコープの変更、改善の実行

本番環境での初期立ち上げと最初のセッションは素晴らしい結果となりました。

安定した信頼性の高いシステムで、全ユーザーのビデオ通話成功率は99%に達しました。お客様からは満足の声が寄せられ、今後のセッションでもこのシステムを使用することが確認されました。

チーム構成

プロジェクト成功の最大の要因は、15人の高いスキルを持ったチームを編成したことです。

Todor Panev

統合されたコンタクト窓口
// プロジェクト管理 // 開発 [バックエンド、フロントエンド] // UI/UXとデザイン // DEVOPS // 品質保証

//結果 _

私たちは、Pulseの新製品を限られた環境の中で生み出しました。チームは高い品質基準を維持しながら、アジャイル方式で迅速に作業を進める必要がありました。さらに、強力なチームを構築することもできました。お客様のためにユーザー体験を変えるという結果を得るため、日々努力を続け、優れた価値を提供しています。

ソリューションを定時する際、その分野の専門家に協力してもらうことのメリットは計り知れません。今回のプロジェクトでもそうでした。製品開発は、Web FactoryとPulse by IGNISの両チームが協力して行いました。

これにより、エンジニアがドメインの知識やルールをコード変換することが可能になりました。イベントのスケジューリング、チケットの確認、過去の予約の確認、そして今回の製品で最も重要な握手会といった要素を用意しました。Web FactoryとPulse by IGNISのチームには、非常に安定した共通の基盤があり、コラボレーションと開発がスムーズに進みました。

15人の専任チーム

アーキテクチャとソリューションを迅速に提供。

AWSインフラの立ち上げとメンテナンス

管理者、アイドル、ファン、マネージャー向けに開発されたフロントエンドアプリケーション。フロントエンドとモバイルサポートのためのAPIを備えたバックエンドシステム

多層セキュリティ

製品開発に伴うUI/UXはPulseと共同開発。Web Factoryによる完全UI。

Flutterで開発されたモバイルアプリケーションは、クロスプラットフォームに対応。

数百万人のユーザーをサポートするために、クロスカントリーでの使用が可能なアプリケーションを用意。

image

「素晴らしいチームです! 日本のアイドルグループを対象とした、これまでにない、課題の多いアプリケーションに取り組んできましたが、Web Factoryの対応は見事でした。10ヶ月足らずで複数のプラットフォーム上でビデオ通話ができるプラットフォームをゼロから作り上げました。」

image

長谷川敏樹

イノベーションマネージャー

JoyJoi 日本
>

Project highlights

1.

フロントエンド、バックエンド、モバイルソリューションを開発し、迅速に提供できる即席の技術チーム

2.

Pulse by INGISと共同での完全な製品開発

3.

15人のチームでMVPを3ヶ月で提供し、10ヶ月で製品を完成。

あなたの場合はどうですか? さまざまな顧客のタッチポイントをデジタル化しましょう! これまでにないデジタルストーリーを伝えることで、ブランドへのロイヤリティを高めましょう!