ブラウザベースで、モバイルやPCなどマルチデバイスで利用可能なHTML5ゲームプラットフォームとして、ゲームの配信基盤として構築されました。ユーザーの操作性向上と開発の効率化を目的に、どのようにして高品質なプラットフォームを実現したのか、構築事例を通して解説します。
要件
マルチデバイス対応
モバイル、PC、タブレットなど複数のデバイスに対応し、どこからでもスムーズにアクセスできるようにすること。
セキュアな会員管理及び決済機能
セキュアな会員管理の設計と、他プラットフォームとの連携や、シームレスな決済機能の実現。
高速なプラットフォーム
chat機能など、基本的なSNSとしての機能をユーザーがストレスなく楽しめること。
UI/UX
btocサービスにおいてストレスを感じるとすぐに離れてしまうユーザーを逃さないためのシンプルでUI/UX設計。
開発・運用効率の最大化
開発チームがスムーズに新規コンテンツを追加できるよう、柔軟な拡張性と容易な保守性を確保すること。
システムの堅牢性
24/365の安定的な稼働と、ピーク時のアクセスや、障害時において、アプリケーション、インフラ面での柔軟な対応を行えること。
海外対応
国内だけでなく海外展開を考慮したシステムであること。
ゲームデベロッパーが使用する管理システムの構築
ゲームの配信機能やテスト環境の提供などゲームデベロッパーがゲームを管理するための機能があること。
データ分析基盤の構築
プラットフォームでのデータ収集及びBI化。
課題
構築に際して、様々な課題が発生しましたが大きな課題として以下の課題が浮き彫りになりました。
シームレスなUI/UXの実現
プラットフォームの登録及び、ゲームのインストールから、ゲームの立ち上げまで、ブラウザのみで完結させるためのストレスのないUI/UX設計
ゲームのパフォーマンス
ブラウザ上でネイティブなモバイルゲームと遜色のない表現や、最適なパフォーマンスの実現。
ブラウザ特有の課題
HTML5では一部のブラウザでの対応が不完全な機能があるため、互換性やパフォーマンスのばらつきを調整する必要がありました。
プラットフォームとして、高い可用性の実現
ユーザー数が増加しても安定稼働するためのサーバーやネットワーク設計が必要であり、特にゲームのアクセスや、課金、チャット機能などピークアクセス時の耐障害性を考慮する必要がありました。
ソリューション内容
サービスやツール
AWS
ruby on rails 、Elixir、HTML5、react、golang etc
構築期間
約2年
体制
30名
レスポンシブデザインの採用
各デバイスの画面サイズや操作性に合わせたレスポンシブデザインを採用し、ユーザーのデバイスに最適化されたインターフェースを提供しました。さらに、画質やデータサイズを動的に調整することで、パフォーマンスを最大化しました。
HTML5ゲームのフレームワークの提供
ゲーム開発を支える描画にはWebGL、WebAudioAPI、ブラウザキャッシュを使用しての通信量節約や、パフォーマンスチューニングに使用するための開発者専用ツールを開発しました。
CDNの導入
グローバルに分散したコンテンツ配信ネットワーク（CDN）を活用し、ユーザーの位置に関係なく低遅延でのコンテンツ配信を可能にしました。これにより、世界中のユーザーに対して同じように快適な体験を提供しました。
自動デプロイ環境の構築
CI/CD（継続的インテグレーションと継続的デプロイメント）の仕組みを整備し、新しいコンテンツや機能を迅速にリリースできるようにしました。自動テストとデプロイにより、更新作業の効率化と品質管理が強化され、短期間でのリリースが可能となりました。
オートスケーリングによるサーバー調整
アクセスが増加するタイミングに合わせて自動的にサーバーがスケールアップするオートスケーリング機能を導入し、突発的なアクセス増加に対応可能としました。また、稼働率に応じたスケールダウン機能も取り入れ、コスト最適化を図りました。
結果と効果
これらの取り組みにより、高いパフォーマンスと安定性を持ったHTML5プラットフォームとして、多くのユーザーに支持される基盤を構築することができました。特に、コンテンツのスピーディな提供と、どのデバイスでも快適に楽しめるユーザー体験が評価され、ユーザーリテンション向上にもつながりました。また、開発者側においても、拡張性の高いプラットフォームにより新しいゲームやコンテンツの迅速な提供が可能となり、業務効率化を実現しました。