Skip to content

feat: implement interactive MBTI loading screen with sequential anima…#43

Merged
Koseeee-27 merged 7 commits into
developfrom
feature/loading-screen
Feb 22, 2026
Merged

feat: implement interactive MBTI loading screen with sequential anima…#43
Koseeee-27 merged 7 commits into
developfrom
feature/loading-screen

Conversation

@ru-se
Copy link
Copy Markdown
Contributor

@ru-se ru-se commented Feb 22, 2026

概要

診断結果の分析中や、診断完了からゲーム開始への遷移時に表示される、視覚的に楽しいローディング画面を実装しました。

変更内容

  • 新コンポーネント LoadingScreenの追加:
    • MBTI の 4 つのグループ(分析家、外交官、番人、探検家)からランダムにキャラクターが選ばれ、左から順番にジャンプするアニメーションを実装。
    • キャラクターのジャンプに合わせて背景色がグループカラーに滑らかに変化。
    • レトロ・ポップなドットパターン背景と、縁取りされた「Loading...」テキストによるデザイン。
  • 既存画面への統合:
    • ResultPage.tsx: 分析中のシンプルなプログレスバーを新ローディング画面に置き換え。
    • BaselineSurvey.tsx: 送信中およびゲーム開始への遷移時に新ローディング画面を表示するように変更。

動作確認方法

  1. 診断(BaselineSurvey)を完了し、ゲームへの遷移時にアニメーションが表示されることを確認。
  2. 診断結果ページ(/result)にアクセスし、分析中にキャラクターが順にジャンプすることを確認。

@vercel
Copy link
Copy Markdown

vercel Bot commented Feb 22, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
2026-team6 Ready Ready Preview, Comment Feb 22, 2026 3:19am

@ru-se ru-se requested a review from tamtya February 22, 2026 02:27
Copy link
Copy Markdown
Contributor

@Koseeee-27 Koseeee-27 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@Koseeee-27 Koseeee-27 merged commit a686055 into develop Feb 22, 2026
3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants