非認知スキル診断システム

非認知スキル診断システム

教育

教育

診断システム

診断システム

 非認知スキル診断・組織開発支援システム
 非認知スキル診断・組織開発支援システム

主な機能

没入型ストーリーテリング

  • 三叉路、海、山、森など8種類の情景背景画像によるシーン演出

  • タイプライター効果によるテロップ式テキスト表示

  • フェードイン/アウトによる滑らかなシーン遷移

直感的な選択式インターフェース

  • RPGの選択肢UIを模したボタンデザイン

  • 選択肢の段階的表示アニメーション

  • クリックでスキップ可能なテキスト送り機能

多軸スキル診断

  • リーダーシップ、創造性、協調性、レジリエンス、好奇心の5軸評価

  • 選択に応じたリアルタイムスコアリング

  • 視覚的なスキルツリー表示

クエストクリア演出

  • 達成感を演出するパーティクルエフェクト

  • ゲーム風のリザルト画面

  • 診断レポートへのシームレスな導線

技術スタック

カテゴリ

技術

フレームワーク

Next.js 16 (App Router)

言語

TypeScript

スタイリング

Tailwind CSS v4

UIコンポーネント

shadcn/ui

アニメーション

CSS Animations / Transitions

フォント

Noto Sans JP (Google Fonts)