LoreDrop: Crowdsourced Local Survival Kits, Powered by Gemini & Google Search

Amaan Syed — Sun, 01 Mar 2026 20:39:11 +0000

This is a submission for the DEV Weekend Challenge: Community

The Community

Travelers and locals everywhere.

Whether you're a backpacker in Bangkok, a student moving to a new city, or a local who's tired of watching tourists fall for the same scams — you're part of this community. Every neighborhood has unwritten rules, hidden gems, and survival tips that only locals know. The problem? That knowledge lives in scattered Reddit threads, word of mouth, and hard lessons learned.

LoreDrop is for anyone who's ever thought: "I wish someone had told me this before I got here."

What We Built

LoreDrop is a real-time, location-aware web app where communities drop local knowledge onto a map for others to discover. It's a crowdsourced survival guide that combines community wisdom with AI-generated intelligence.

🛡️ AI Survival Kit (Gemini 3 Flash + Google Search Grounding)

Pan the map to any city in the world. LoreDrop's AI mascot Polo (a paper airplane ✈️) auto-generates a Local Survival Kit containing:

Cultural Rules — the unwritten social norms (with matching emojis)
Tourist Traps — scams and overpriced spots to avoid
Phrasebook — essential local phrases with pronunciation
Recent News — live safety alerts and noteworthy events, grounded with Google Search

The kit is powered by Gemini 3 Flash with googleSearch tool grounding, so it pulls real-time information — not just training data.

📍 Community Lore Drops

Users pin tips to real locations. Each drop is tagged with a category (History, Alert, Fun Fact, Hidden Gem) and appears as a clickable tag on the map — styled after our sister app Lens & Lore's neo-brutalist markers. Click any tag to see the full tip in an InfoWindow popup.

👥 Community Tab with Radius Filter

A dedicated sidebar tab shows all community drops within a configurable radius: 500m, 1km, 2km, or 5km. Filter by category, see distance labels, and tap any card to fly the map straight to that pin.

💬 Polo AI Chat

Chat with Polo about your surroundings. Polo ingests your map viewport boundaries, nearby community drops, and your GPS location as context — then responds using Gemini with Google Search grounding. Ask "What's the best street food near here?" and Polo actually knows where "here" is.

💾 Full Persistence

Everything persists via Zustand + localStorage + Firestore:

Chat history survives page refreshes
Generated survival kits are cached (no re-generation on revisit)
Auth state doesn't flash the landing page
Firebase Firestore Database stores pings and insights from all other users.

Demo

Live: loredrop.vercel.app

GitHub: github.com/amaansyed27/loredrop

Code

amaansyed27 / loredrop

🗺️ LoreDrop — Crowdsourced Local Survival Kit

Drop lore. Explore locales. Survive anywhere. A real-time, community-powered travel companion with AI-generated survival kits — powered by Gemini 3 Flash and Google Search grounding.

🧭 What is LoreDrop?

LoreDrop is a location-aware web app where communities share local knowledge — hidden gems, scam warnings, historical facts, and cultural tips — all pinned to real places on a map. Think of it as a crowdsourced survival guide for any neighborhood on Earth.

Pan the map to any city, and LoreDrop's AI mascot Polo (a paper airplane) will:

🛡️ Auto-generate a Local Survival Kit (cultural rules, tourist traps, phrasebook + live news) grounded with Google Search
💬 Chat with you about the area using real-time context + community drops
👥 Show you Community Tips from other travelers within a configurable radius

✨ Features

Feature	Description
🗺️ Interactive Map	Google Maps with reverse geocoding

…

View on GitHub

How we Built It

Tech Stack

Layer	Technology
Frontend	React 19 + TypeScript 5.9 + Vite 7
Styling	Tailwind CSS 3.4 (Neo-Brutalism design system)
Maps	`@vis.gl/react-google-maps` + Geocoding API
AI	Gemini 3 Flash (`@google/genai`) + `googleSearch` tool
Auth & DB	Firebase 12 (Authentication + Cloud Firestore)
State	Zustand 5 with `persist` middleware → localStorage
Deploy	Vercel

How Gemini Powers LoreDrop

1. Survival Kit Generation (gemini.ts)
We call gemini-3-flash-preview with tools: [{ googleSearch: {} }] enabled. The prompt asks Gemini to search for recent news, safety alerts, and cultural context for the locale. The response is parsed as structured JSON containing cultural rules, tourist traps, a phrasebook, and real-time news — all grounded in live Google Search results.

2. Polo Chat (PoloAgent.tsx)
Multi-turn conversation with Gemini using the same googleSearch tool. We inject the user's GPS coordinates, map viewport bounds (North/East/South/West), and all nearby community drops as system context. This means Polo can answer hyper-local questions with real geographic awareness.

3. Reverse Geocoding
As users pan the map, we reverse-geocode the center coordinates via the Google Maps Geocoding API to extract a human-readable locale name (e.g., "Shibuya, Tokyo"). This locale string drives the survival kit generation and lore tagging.

Design Philosophy

Neo-Brutalism Lite — inspired by our sister project Lens & Lore. Sharp ink-black borders (#1A1A1A), hard drop shadows, off-white paper background, and a bold yellow/orange/mint palette. Zero gradients, zero glowing effects, zero "AI sparkle" clichés. Just clean, bold, functional design that feels like a hand-drawn travel journal.

Team

Amaan Syed — @amaansyed27
Lingareddy Chaitanya Chakravarti Reddy — @hausemaster8281

Thanks for checking out LoreDrop! 🗺️✈️

I missed class to build this immersive portfolio!!

Amaan Syed — Mon, 02 Feb 2026 00:19:13 +0000

This is a submission for the New Year, New You Portfolio Challenge Presented by Google AI

About Me

Hi, I'm Amaan Syed. I'm not just a Full Stack Developer; I'm an architect of speed. In a world of loading spinners and jittery frames, I believe web experiences should feel like driving an F1 car: precise, fluid, and aggressively fast.

My portfolio is a direct reflection of this philosophy. It meshes strict engineering (Type-Safety, Dockerization) with a visual style that lives at the intersection of Formula 1 aerodynamics and Sci-Fi futurism. I wanted a site that didn't just list my skills but performed like valid race telemetry—precise, fluid, and dynamic.

Portfolio

made for desktop (wide screens) and mobile (narrow screens)

🏎️ CLICK HERE TO VIEW FULL SITE (DESKTOP RECOMMENDED)

How I Built It

I wanted to push the browser's rendering engine to its limits using physics-based animations and custom WebGL-style effects without the overhead.

Tech Stack

Framework: React + Vite (for lightning-fast builds)
Animation: Framer Motion (complex physics-based transitions)
Styling: Custom CSS (Glassmorphism + Neo-Brutalism)
Deployment: Google Cloud Run (Dockerized Nginx container)

Design Decisions: "AeroFlow" & "Liquid Glass"

AeroFlow: The background isn't a static image. It's a living component that renders "Scuderia Red" flow lines using chaotic Bezier curves. They dash and pulse across the screen, mimicking wind tunnel telemetry data.
Liquid Glass: The UI elements use a "Frosted Glass" effect combined with high-contrast neo-brutalism, creating a look that feels like a futuristic heads-up display.
Immersive Micro-Worlds: instead of a grid, I built:
- Web: A 3D "Splatter" layout where browser windows float in Z-space.
- Mobile: A vertical "tear-off" card deck that feels tactile.
- AI: A "Blast Door" terminal interface with holographic particles.

Google AI Integration

This project was Turbo-Charged by Google Antigravity.
It wasn't just a code generator; it was my pair programmer for complex physics math:

Refining Physics: I used Gemini to fine-tune the damping and stiffness coefficients in the Framer Motion springs for the "Mobile Card Stack".
DevOps-in-a-Box: I'm a frontend guy, not a sysadmin. Antigravity wrote my Dockerfile and nginx.conf for Cloud Run, handling the tricky SPA routing logic instantly.
Visual Polish: The AI suggested using conic-gradient masks for the "Silver Flow Button" to create a perfect metallic sheen without looking like a generic asset.

What I'm Most Proud Of

I am incredibly proud of the Blast Door Terminal in the AI section. It’s pure CSS/JS theatre—scanlines, holographic particles, and a mechanical door opening sequence that syncs perfectly with the user's journey. It turns a boring "Skills" list into a narrative event.
Most importantly the overall aesthetic of the site which I want to theme around my interest like F1, Star Wars, color science and typography

DEV Community: Amaan Syed

LoreDrop: Crowdsourced Local Survival Kits, Powered by Gemini & Google Search

The Community

What We Built

🛡️ AI Survival Kit (Gemini 3 Flash + Google Search Grounding)

📍 Community Lore Drops

👥 Community Tab with Radius Filter

💬 Polo AI Chat

💾 Full Persistence

Demo

Code

amaansyed27 / loredrop

🗺️ LoreDrop — Crowdsourced Local Survival Kit

🧭 What is LoreDrop?

✨ Features

How we Built It

Tech Stack

How Gemini Powers LoreDrop

Design Philosophy

Team

I missed class to build this immersive portfolio!!

About Me

Portfolio

🏎️ CLICK HERE TO VIEW FULL SITE (DESKTOP RECOMMENDED)

How I Built It

Tech Stack

Design Decisions: "AeroFlow" & "Liquid Glass"

Google AI Integration

What I'm Most Proud Of

This portfolio is me: Stay Hungry, Stay Foolish!