// Full-Stack · Multimodal AI · AR · 2025

HeritEdge — Bringing Milan's Heritage to Life

A full-stack, multimodal augmented-reality web app that turns a walk through Milan's Piazza del Duomo, Palazzo Reale and Galleria Vittorio Emanuele into an interactive experience — a grounded LLM guide, a WebXR treasure hunt, and a vision model that checks whether you really found the landmark.

Team  5 people · full-stack & cloud lead
Stack  React · TypeScript · Node.js · Express · Chroma · Docker · AWS
Sites  Piazza del Duomo · Palazzo Reale · Galleria Vittorio Emanuele

A guide that knows the building you're standing in front of

Heritage sites are surrounded by information that tourists rarely reach — it lives in plaques, archives and guidebooks, not in the moment you're looking at the façade. HeritEdge puts that knowledge in your hand: point your phone at a monument and get an accurate, grounded answer, then turn the visit into a game.

The brief was deliberately multimodal: combine text (an LLM assistant), vision (recognizing what the camera sees), and spatial interaction (AR in the browser) into one coherent web app that runs on an ordinary phone with no install.

Three experiences, one app

RAG heritage assistant

An LLM chat grounded in a Chroma vector database of curated heritage facts, so answers stay tied to real sources instead of the model's imagination.

WebXR treasure hunt

An augmented-reality hunt driven by camera and device-orientation input — players follow clues and find AR markers placed around each site.

Vision photo verification

A vision model checks a player's photo against the target landmark to confirm they actually reached it before unlocking the next step.

Browser-native, install-free

Everything runs in a mobile browser via WebXR, so visitors join instantly by opening a link — no app store, no download.

Architecture & deployment

The frontend is a React/TypeScript single-page app; a Node.js/Express backend serves the RAG endpoint and verification calls. Retrieval runs against a Chroma vector store of heritage facts, and the whole stack is containerized and shipped to AWS.

client  React + TypeScript (WebXR, camera, orientation)
   ↓ REST
api     Node.js + Express  →  LLM + vision model
   ↓ retrieval
data   Chroma vector DB (curated heritage facts)
   ↓ deploy
cloud  Docker (multi-stage) → AWS EC2 · ECR · S3 · CloudFront

I owned the cloud path end to end: multi-stage Docker builds to keep images lean, then deployment to AWS across EC2, ECR, S3 and CloudFront — configuring IAM roles, security groups, and CDN-to-origin routing so the static frontend and the API served cleanly behind one domain.

React TypeScript Node.js · Express WebXR RAG Chroma Vision models Docker AWS (EC2 · ECR · S3 · CloudFront)