EcoFin Village

• 

  Dashboard

• 

  Decision Making

• 

  Outcome Evaluation

• 

  Village Elder Advisor

Inspiration

To help spread awareness about financial literacy and economics in the community especially to the young generations through game simulation.

What it does

EcoFin Village is a turn-based strategy game where the user plays as the Mayor of a village. The goal is to manage the village's economy by making policy decisions that affect four key metrics: Wealth, Happiness, Financial Literacy, and Sustainability.

How we built it

Unlike traditional text adventures with hard-coded paths, this app uses Google Gemini to dynamically generate infinite, context-aware scenarios and calculate realistic economic outcomes on the fly.

User Flow Start: User sees an intro screen and clicks "Start Simulation." Scenario: The AI presents a problem (e.g., "The river is polluted, affecting fish sales. Do we tax factories or subsidize filters?"). Action: The user selects an option. Consequence: The AI calculates the impact (e.g., Wealth -10, Sustainability +15), explains why this happened, and the game loop repeats with the new stats.

Challenges we ran into

Prompting the ideas.

Accomplishments that we're proud of

1.Dynamic Game Loop (The Engine): Scenario Generation: The app sends the village's current statistics (e.g., Low Wealth, High Happiness) to the Gemini API (gemini-3-flash-preview). The AI acts as a "Game Master," creating a unique economic situation (e.g., "A sudden inflation spike," "Infrastructure collapse," or "Trade opportunity").

2.Decision Making: The user is presented with 2-3 specific choices to resolve the scenario. Outcome Evaluation: Once a choice is made, the AI evaluates the decision based on economic principles. It returns a narrative result, explains the underlying concept (e.g., "Opportunity Cost"), and numerically updates the village stats.

3.The "Village Elder" (AI Mentor): An integrated chatbot (AdvisorChat) sits on the side of the screen. It uses a specific system instruction ("You are a wise Village Elder...") to answer user questions about the game or general financial concepts (like "What is inflation?") in a simplified, educational tone.

4.Visual Analytics: Dashboard: Displays the four core stats with trend indicators (green/red arrows) showing the impact of the last turn. Charts: Uses recharts to visualize the history of Wealth and Happiness over the last 10 turns, helping users see long-term trends.

What we learned

Technical Architecture 1.Frontend: Built with React and TypeScript.

2.Styling: Uses Tailwind CSS for a clean, modern UI with responsive grids.

3.AI Integration (services/gemini.ts): a.Utilizes the @google/genai SDK. b.Structured Output: Heavily relies on responseSchema and Type.OBJECT to force the LLM to return strict JSON. This ensures the game code can reliably parse the "Title," "Options," and numerical "Stat Changes" without parsing errors. c.State Management: React useState tracks the village history and current turn, while useEffect manages the async API calls.

What's next for EcoFin Village

Upgrade this Village into City level for more complex scenarios.

Built With

• google-ai-studio