Fate Framed

Fate Framed is an interactive, museum-inspired risk assessment experience that transforms user behaviors into personalized “risk portraits.”

Instead of presenting risk as a static number, Fate Framed guides users through immersive exhibits (Auto, Home, and Life), where their choices shape a final visual representation of their overall risk profile.

⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣀⡤⣤⣀⡀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⡀⠄⠀⡀⢀⣠⠴⠒⠚⠛⠒⠛⠛⠻⠥⢤⣦⣄⡈⠓⢤⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢠⡞⣡⠤⢤⡤⠎⠉⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠙⢃⠙⠀⠈⣇⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣧⢸⠉⣴⠃⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠲⡿⢀⡄⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣇⠃⣰⠗⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣡⠜⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠘⢲⡏⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢿⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣯⠀⠀⢀⣀⡤⠠⠒⠂⠒⢰⣷⠄⠀⠀⠀⠀⠀⠀⠀⣾⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢹⡀⠀⢻⠏⠰⢶⠆⠀⠀⠀⢹⡄⠀⠀⠀⠀⠀⠀⢠⠃⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢇⠀⠘⣆⠀⠈⣄⠀⠀⠀⡼⠃⠀⠀⠀⠀⠀⣴⠃⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠑⢦⣬⣷⣶⣷⣤⡤⠮⠤⠔⣶⣤⣤⠶⢻⡁⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣠⣿⣿⣩⣵⢟⡿⢛⢲⠒⠒⠏⠉⠀⠀⠀⢳⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣠⡾⣵⠏⠈⢨⠞⡼⠁⠸⡄⢇⠀⠀⠀⠀⠀⠀⠀⢧⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⡼⠋⣼⠃⠀⢀⣎⢠⠃⠀⠀⢣⠘⣆⠀⠀⠀⠀⠀⠀⠈⡄⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⣠⠾⠉⠀⣸⠉⠀⠀⠈⣹⠋⠀⠀⠀⠈⠉⠉⢲⠀⠀⠀⠀⠀⠀⠘⡆⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⡴⠋⠀⢀⡜⠁⠀⠀⠀⡐⠁⠀⠀⠀⠀⠀⠀⠀⠸⣄⠀⠀⠀⠀⠀⠀⠙⡄⠀
⠀⠀⠀⠀⠀⠀⠀⢸⡄⠀⠀⠸⠀⠀⠀⠀⢸⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⢧⠀⠀⠀⠀⠀⠀⠀⢸⠀
⠀⠀⠀⠀⠀⠀⠀⠘⣦⣤⠔⢻⡀⠀⠀⠀⡆⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠸⡆⠀⠀⠀⠀⠀⠀⢸⡇
⠀⢀⡤⠤⠤⠔⠒⠋⠁⠀⠀⠀⠑⣆⠀⠀⡇⠀⠀⠀⣀⣄⠐⠒⠒⢢⢤⡠⢻⡄⠀⠀⠀⠀⠀⡜⠀
⢀⣿⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠻⣤⣁⡤⠖⠉⠀⠀⠀⠀⠀⠀⠀⠁⠀⢙⡦⠤⠴⠒⠋⠁⠀
⢸⡀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣀⣠⡤⠜⠚⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣠⠞⠁⠀⠀⠀⠀⠀⠀
⠀⠹⡀⠀⠀⠀⠀⠀⠀⣰⠋⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⡠⠞⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠣⠤⣤⣀⣠⠤⠴⠋⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⡔⠉⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⣇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣠⠞⠉⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠘⢳⣀⠀⠀⠀⠀⣠⠤⠖⠈⠉⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠉⠛⠒⠋⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀

---

Features

• Museum Experience

  • Guided journey through themed exhibits
  • Narrative-driven interaction with a virtual guide (Félix)

• Personalized Risk Scoring

  • Category-based quizzes (Auto, Home, Life)
  • Dynamic scoring system (API + local fallback)

• Visual Risk Portraits

  • Each exhibit generates a framed “portrait”
  • Final triptych combines all results into one cohesive visualization

• AI-Powered Insights

  • Key risk drivers explained
  • Tailored recommendations for improvement

• Text-to-Speech Narration

  • Backend-powered audio narration for immersive storytelling

• Local Storage Gallery

  • Saves previous results to simulate a persistent gallery

---

Tech Stack

Frontend

• HTML, CSS, JavaScript
• Dynamic DOM manipulation
• Custom animations and UI transitions

Backend

• Python (Flask)
• REST API endpoints for:
  • Risk scoring (/api/risk/auto, /home, /life)
  • Overall analysis (/api/risk/overall)
  • Text-to-speech (/api/audio/narrate)

AI Integration

• LLM-generated:
  • Risk explanations
  • Recommendations
  • Narrative feedback

---

How It Works

1. User enters the experience and is guided through exhibits
2. Each exhibit presents a short quiz
3. Answers are:
   • Processed locally OR
   • Sent to backend APIs for scoring
4. A visual “portrait” is generated per category
5. AI generates:
   • Overall narrative
   • Key drivers
   • Improvement suggestions

---

Scoring System

• Normalized scoring across all categories (0–100)
• Higher scores = higher risk
• Includes:
  • Backend scoring via API
  • Local fallback scoring (computeLocalScore) for reliability

---

🚀 Running Locally

1. Clone the repo

git clone https://github.com/your-repo/fate-framed.git
cd fate-framed

2. Run the Backend

pip install -r requirements.txt
python app.py

3. Run index.html on a live server