The Problem

Imagine uploading hundreds of images to a platform and needing to find one specific photo later. Without metadata, you're scrolling endlessly. Traditional file naming is tedious and inconsistent. What if every image could describe itself the moment it's uploaded?

The Solution

Searchable Images is a full-stack web application that brings AI-powered intelligence to image management. When you upload an image, Google's Gemini Vision AI automatically analyzes it and extracts rich metadata — a description, tags, detected objects, scene types, and dominant colors. All of this metadata becomes instantly searchable, so finding any image is as simple as typing a word.

This project was built during my internship at SAGER, a company specializing in ultra-HD aerial mapping and geospatial technology. The goal was to prototype how AI vision models could be integrated into SAGER's platform — enabling their team to upload aerial and satellite imagery and have it automatically categorized and searchable, rather than manually tagging thousands of photos.

How It Works

The workflow is straightforward:

1. Upload — Drag and drop images (or click to browse). The app accepts JPG, PNG, GIF, and WebP formats, up to 10 images at a time.

2. AI Analysis — Each image is sent to Google's Gemini 2.5 Flash model, which analyzes the visual content and returns structured metadata: a natural language description, relevant search tags, identified objects, scene classification, and dominant colors.

3. Search — Type anything into the search bar. The app searches across all AI-generated metadata fields — tags, objects, scenes, colors, and descriptions — to find matching images instantly.

AI-Generated Metadata

When you click on any image, a detail view reveals everything the AI extracted:

• Description — A natural language summary of what's in the image
• Tags — The most relevant keywords for searching (e.g., "swimming pool", "outdoor pool", "luxury")
• Objects — Specific items detected in the image (e.g., "waterfall feature", "stone tiling", "plants")
• Scenes — The type of environment (e.g., "outdoor", "backyard", "residential")
• Colors — Dominant colors identified (e.g., "blue", "white", "green")

This structured approach means you don't need to know the exact filename — searching "blue" finds pools, skies, and ocean photos. Searching "outdoor" finds parks, backyards, and street scenes. The AI connects the dots.

Architecture & Tech Stack

The application is built with a modern stack designed for performance and security:

Frontend

• Next.js 15 with the App Router and React 19 Server Components
• TailwindCSS for responsive styling — the gallery adapts from 3 columns on mobile to 7 on desktop
• React Dropzone for drag-and-drop file uploads
• Hover effects on gallery images reveal a preview of tags and description before opening the full detail view

Backend & Database

• Supabase serves as the entire backend — handling authentication, database (PostgreSQL), and file storage in one platform
• The database uses two core tables: images (file metadata and storage paths) and image_metadata (all AI-generated data — tags, objects, scenes, colors, and descriptions)
• GIN indexes on all metadata array columns for fast search performance
• Signed URLs for secure, time-limited access to stored images

AI Integration

• Google Gemini 2.5 Flash Vision API processes each uploaded image
• The AI receives the image as base64 and returns structured JSON with all metadata categories
• Analysis happens server-side during upload — by the time the image appears in your gallery, it's already fully searchable
• Graceful fallback: if AI analysis fails for any reason, the image is still uploaded and accessible, just without metadata

Security

• Row Level Security (RLS) policies ensure every user can only see and manage their own images
• Storage is organized by user ID folders, with upload policies enforcing folder isolation
• Authentication middleware refreshes sessions on every request
• All API routes verify the user's identity before processing

Database Schema

The data model is intentionally simple but effective:

images
├── id (UUID)
├── user_id (references auth.users)
├── storage_path
├── file_name
├── content_type
├── size
├── url (signed URL)
└── created_at

image_metadata
├── id (UUID)
├── image_id (references images)
├── description (text)
├── tags[] (text array)
├── objects[] (text array)
├── scenes[] (text array)
├── colors[] (text array)
└── created_at

Using PostgreSQL arrays for tags, objects, scenes, and colors (instead of separate junction tables) keeps queries simple while GIN indexes maintain fast lookups across all fields.

Why Supabase?

Supabase was the right choice here because it consolidates what would normally require three separate services:

• Auth — Email/password authentication with session management, no separate auth service needed
• Database — Full PostgreSQL with Row Level Security, so data isolation is enforced at the database level, not just in application code
• Storage — File storage with signed URLs and folder-based access policies, no need for a separate S3 bucket

This meant I could focus on the AI integration and user experience rather than stitching together infrastructure.

The Internship Context

This project was one of two full-stack deliverables I built during my AI Engineering internship at SAGER. The company works with ultra-HD aerial and satellite imagery, and the challenge was clear: how do you make thousands of aerial photos searchable without manual tagging?

Searchable Images was the proof of concept — demonstrating that a vision AI model could be plugged into an upload pipeline to automatically generate searchable metadata. The approach validated that Gemini could reliably extract meaningful tags, objects, and scene descriptions from diverse imagery, making it viable for integration into SAGER's production platform.

Tech Stack Summary