Jokers Frontend - UAT完全ガイド
このドキュメントには、Jokers FrontendのUATテストに必要なすべての情報が含まれています。
目次
テスト環境情報
- テストサイト: https://dev.project-j-frontend.pages.dev/
- ログイン情報:
- ユーザー名:
demo - パスワード:
projectj2025
- ユーザー名:
- テスト用コイン: https://faucet.sui.io/?network=testnet
- 取引確認: https://suiscan.xyz/testnet/home
必須テストブラウザ
デスクトップ:
- Chrome（最新版）
- Firefox（最新版）
- Safari（最新版）
- Edge（最新版）
モバイル:
- iPhone（Safari）
- Android（Chrome）
- iPad（Safari）
プロジェクト概要
Jokers Frontendとは
NFTトレーディングカードゲームのプラットフォームです。 主な機能：
- カードパックの購入
- パックの開封
- カードの管理と転送
テストの目的
- すべての機能が正しく動作すること
- 使いやすいインターフェースであること
- すべてのブラウザとデバイスで問題なく表示されること
テストスケジュール（例）
| フェーズ | 期間 | 内容 |
|---|---|---|
| 準備 | 2日間 | 環境設定、ウォレット準備 |
| テスト実行 | 5日間 | 各機能の テスト |
| 不具合修正確認 | 3日間 | 修正された項目の再テスト |
| 最終確認 | 1日間 | 全体確認とサインオフ |
セットアップガイド
1. テストサイトへのアクセス
- ブラウザを開く
- https://dev.project-j-frontend.pages.dev/ にアクセス
- 認証画面で以下を入力：
- ユーザー名:
demo - パスワード:
projectj2025
- ユーザー名:
- ホームページが表示されれば準備完了！
2. ウォレットの準備
ウォレットとは？
デジタル資産（カードやトークン）を管理するための「デジタル財布」です。
インストール方法
Mysten Wallet（推奨）:
- Chromeウェブストアにアクセス
- 「Mysten Wallet」を検索
- 「Chromeに追加」をクリック
- 画面の指示に従ってウォレットを作成
Suiet Wallet（代替）:
- https://suiet.app/ にアクセス
- お使いのブラウザ用のボタンをクリック
- 画面の指示に従ってインストール
3. テスト用コインの取得
- SUI Faucetにアクセス：https://faucet.sui.io/?network=testnet
- ウォレットアドレスをコピー（ウォレットを開いてコピーボタンをクリック）
- Faucetサイトにアドレスを貼り付け
- 「Request Testnet SUI Tokens」をクリック
- 数秒でテストコインが届きます
4. よくある質問
Q: ウォレットが接続できません A: ウォレットがインストールされているか、ロックが解除されているか確認してください。
Q: テストコインが届きません A: 数分待ってからウォレットを確認してください。
Q: 認証画面でエラーが出ます A: ユーザー名とパスワードを再確認してください（demo / projectj2025）。
テストケース
1. ログイン機能のテスト
テスト1-1: 正しいログイン情報でアクセス
手順:
- https://dev.project-j-frontend.pages.dev/ を開く
- ユーザー名:
demo、パスワード:projectj2025を入力 - OKをクリック
確認項目:
- ホームページが表示される
- エラーメッセージが出ない
テスト1-2: 間違ったログイン情報でアクセス
手順:
- サイトを開く
- わざと間違った情報を入力
- OKをクリック
確認項目:
- アクセスが拒否される
- エラーメッセージが表示される
2. ウォレット接続のテスト
テスト2-1: ウォレットを接続する
手順:
- 画面上部の「ウォレット接続」ボタンをクリック
- 使用するウォレットを選択
- ウォレット側で承認
確認項目:
- ウォレットアドレスが画面に表示される
- 接続状態が保持される
テスト2-2: ウォレットを切断する
手順:
- 接続済みのウォレットアドレスをクリック
- 「切断」を選択
確認項目:
- ウォレットが切断される
- 「ウォレット接続」ボタンが再表示される
3. カードパック機能のテスト
テスト3-1: カードパック一覧を見る
手順:
- ホームページでカードパックのセクションを確認
確認項目:
- カードパックが表示される
- 各パックの画像が見える
- 価格が表示される
- 説明文が読める
テスト3-2: カードパックの詳細を見る
手順:
- 任意のカードパックをクリック
確認項目:
- 詳細ページが開く
- パックの詳しい情報が表示される
- レアリティの分布が見える
- 購入ボタンがある
テスト3-3: カードパックを購入する
準備: ウォレット接続済み、テストコインを保有
手順:
- カードパック詳細ページで「購入」をクリック
- 確認画面で内容を確認
- 「確認」をクリック
- 処理完了を待つ
確認項目:
- 購入成功のメッセージが表示される
- マイページに購入したパックが表示される
- SUI Scanで取引が確認できる
テスト3-4: カードパックを開封する
準備: 未開封のパックを所有
手順:
- マイページで未開封パックの「開封」をクリック
- 開封アニメーションを確認
確認項目:
- アニメーションが再生される
- 獲得したカードが表示される
- カードがコレクションに追加される
4. カード管理機能のテスト
テスト4-1: 自分のカードを見る
手順:
- マイページの「コレクション」タブをクリック
確認項目:
- 所有カードが一覧表示される
- フィルター機能が使える
- カード画像が表示される
テスト4-2: カードの詳細を見る
手順:
- コレクションから任意のカードをクリック
確認項目:
- カード詳細ページが開く
- カードの大きな画像が見える
- ステータスや説明が表示される
- 転送ボタンがある
テスト4-3: カードを転送する
準備: 転送先のウォレットアドレスを用意
手順:
- カード詳細で「転送」をクリック
- 転送先アドレスを入力
- 「確認」をクリック
- 処理完了を待つ
確認項目:
- 転送成功のメッセージが表示される
- カードがコレクションから消える
- SUI Scanで転送が確認できる
5. 表示確認のテスト
テスト5-1: 異なる画面サイズでの表示
重要: このテストは複数のブラウザとデバイスで実施してください
デスクトップブラウザでのテスト:
- Chrome、Firefox、Safari、Edgeで確認
- ブラウザの幅を変更して以下のサイズで確認：
- デスクトップ（1920px以上）
- タブレット（768px〜1024px）
- モバイル（375px〜428px）
実機でのテスト:
- iPhone（Safari）
- Android（Chrome）
- iPad（Safari）
確認項目:
- すべてのブラウザで正しく表示される
- 各画面サイズでレイアウトが適切
- 文字や画像が切れない
- ボタンがタップしやすい
- スクロールが正常に動作する
- 画面回転時も正しく表示される
テスト5-2: エラー時の表示
手順:
- インターネット接続を切る
- データ取得が必要な操作を実行
確認項目:
- 適切なエラーメッセージが表示される
- アプリが止まらない
テスト結果の記録方法
各テストの結果は以下の形式で記録してください：
テスト項目: [テスト名]
ブラウザ/デバイス: [使用したブラウザとデバイス]
結果: Pass / Fail
問題があった場合の詳細: [詳細を記載]
スクリーンショット: [必要に応じて添付]
テスト結果サマリー
| カテゴリ | テスト数 | 完了 | 問題あり |
|---|---|---|---|
| ログイン | 2 | ||
| ウォレット | 2 | ||
| カードパック | 4 | ||
| カード管理 | 3 | ||
| 表示確認 | 2 | ||
| 合計 | 13 |
最終確認チ ェックリスト
- すべてのテストケースを実行した
- すべてのブラウザでテストした
- モバイルデバイスでテストした
- 重要な不具合はすべて解決された
- 改善提案をまとめた
サポート
ご不明な点がございましたら、プロジェクトチームまでお問い合わせください。
このドキュメントは非技術者の方でも理解できるように作成されています。