Aivazovsky — Master of Light & Sea

An interactive digital gallery showcasing the works of Ivan Aivazovsky, the legendary marine painter. Features an interactive timeline, a curated collection with detailed artwork views, and an AI-powered chat companion that can discuss paintings, art history, and techniques.

Live Demo

Features

• Curated Collection — 20+ paintings with descriptions, historical significance, and high-resolution images sourced from Wikimedia Commons
• Interactive Timeline — Explore works chronologically with an aesthetic score visualization powered by Recharts
• Artwork Modal — Detailed view for each painting with dimensions, location, and context
• AI Chat Companion — Discuss any painting or art topic with a Gemini-powered conversational guide
• Dark Mode — Liquid glass UI with smooth light/dark theme transitions
• Responsive Design — Works seamlessly on mobile, tablet, and desktop

Getting Started

Prerequisites

• Bun runtime

Install & Run

git clone https://github.com/Millon15/aivazovsky.git
cd aivazovsky
bun install
bun run dev

The app will be available at http://localhost:3000.

AI Chat (Optional)

To enable the Gemini-powered chat companion:

1. Get an API key from Google AI Studio
2. Create a .env.local file:

   GEMINI_API_KEY=your_api_key_here

3. Restart the dev server

Tech Stack

• Runtime — Bun
• Framework — React 19
• Build — Vite
• Charts — Recharts
• AI — Google Gemini 2.5 Flash
• Deployment — GitHub Pages via Actions

Project Structure

├── components/
│   ├── ArtworkModal.tsx       # Detailed painting view
│   ├── ChatInterface.tsx      # Gemini AI chat
│   ├── Loader.tsx             # Loading states
│   └── Timeline.tsx           # Interactive timeline chart
├── data/
│   ├── paintings.json         # Raw painting data
│   └── paintings.ts           # Typed painting exports
├── services/
│   └── geminiService.ts       # Gemini API integration
├── App.tsx                    # Main app shell
├── types.ts                   # TypeScript interfaces
└── vite.config.ts             # Vite configuration

---

_{Originally scaffolded with Google AI Studio. Deployed and fixed with Claude Code. 100% vibecoded. Images from Wikimedia Commons. Historical data generated by Gemini 2.5 Flash. Educational demonstration only.}