3D AI News Reporter

Vision

A fully autonomous, real-time interactive 3D AI news reporter. Built with a VRM character model, voice input/output, emotion detection, and an autonomous news broadcasting loop. The character reads real-time news with synchronized lip movements and facial expressions, complete with a professional TV broadcast overlay.

Engineering the Frontend

The presentation layer handles 3D rendering (Three.js), animations, and the UI overlay. The Viewer.js initializes the scene, while LipSyncManager.js dynamically drives the mouth movements to match the Edge TTS output.

The Intelligence Backend

A FastAPI logic layer handles everything from emotion detection to news aggregation. news_fetcher.py deduplicates stories from BBC and NewsAPI, providing the script payload for the frontend loop.

Core Components

├── frontend/           # React + Three.js App
│   ├── src/
│   │   ├── Viewer.js   # Three.js Scene Loader
│   │   ├── App.jsx     # Broadcast state management
│   │   └── hooks/
│   │       └── useNewsLoop.js # Autonomous engine
└── server/             # FastAPI Backend
    ├── main.py         # AI & TTS API
    └── news_fetcher.py # RSS Aggregator