ガチャ画面を自社アプリ側で実装する¶
UI Kit の UI を利用する代わりに、ガチャAPIを利用して UI のみを自社アプリ側で実装することもできます。UI Kit の管理系機能を利用しつつ、ガチャ画面のデザインを自社のオリジナルにしたいケースで利用できます。
ガチャを内製する場合との比較¶
ガチャを販売するにあたって、UI Kit の利用は必須ではありません。ガチャを完全に内製し、アイテムを付与するところのみアイテム付与APIを使って実現することもできます。
一方で UI Kit が提供する機能は UI だけではなく、管理系機能なども含まれます。これらの機能を使うことで、自社でガチャの管理系機能を準備する必要がなくなるメリットがあります。
将来含め、UI Kit にない高度な機能(10連ガチャなど)が必要となる場合、ガチャは内製することをおすすめします。一方で、機能的には UI Kit で足りており、UI のみを自社に最適化したい場合は本ページで説明する方式が適合します。
性能上の注意点¶
自社の性能要件を満たせるかどうかも重要なポイントになります。
自社のウェブページを表示する度にAPIを呼び出す場合、API接続に伴うレイテンシを無視できない場合があります。Avatar Play の API はリアルタイムな用途でご利用いただけるようチューニングされていますが、それでもネットワークコストを含め数百ミリ秒程度の往復レイテンシを見込んでおく必要があります。
ガチャの基本情報はユーザ間で共通であるため、キャッシュを利用することでレイテンシの課題は解決できる可能性があります。一方、ユーザに紐づく情報はキャッシュできない(またはキャッシュが有効に機能しない)ため、注意が必要です。ユーザに紐づく情報としては以下の項目があり、avatarId を指定したときのみ取得できます。
- 初回無料または初回限定価格に該当するかどうか
- ガチャアイテムの所持状況
ガチャ画面の実装¶
ガチャに関する情報はガチャAPIを使って取得し、画面は自社アプリ側で実装します。
典型的な画面遷移¶
典型的な画面遷移は UI Kit が提供する UI での画面遷移と同様ですが、全ての画面を自社アプリ側で実装します。購入確認画面(演出画面)をスキップするなどのカスタマイズも可能です。
ガチャの一覧画面の実装¶
API /v1/Gachas を使って販売中のガチャ一覧を取得し、ガチャの一覧の UI を実装します。
ガチャ画面の実装¶
API /v1/Gacha/{gachaId} を使ってガチャ情報を取得し、ガチャの個別ページの UI を実装します。API /v1/Gachas で取得した結果を再利用することもできます。
購入セッションの作成¶
購入ボタンが押されたタイミングで、API /v1/Gacha/Session を使って購入セッションを作成します。このタイミングで排出されたアイテムが確定しますが、ユーザにはまだ見せないようにします。
アイテムの付与¶
購入完了画面で、アイテム付与を実行します。このとき、排出されたアイテムIDと一緒に購入セッションのセッションIDをパラメータ gachaSessionId に指定して実行します。