Artilo

Artilo is an immersive, minimalistic 3D art gallery built with modern web technologies. It features a unique scrolling experience, custom shaders, and smooth interactions to showcase creative artwork in a digital space.

✨ Features

• Immersive 3D Gallery: Built using react-three-fiber for performant WebGL rendering.
• Smooth Scrolling: Integrated Lenis for a buttery smooth scroll experience.
• Custom Shaders: Unique hover and transition effects powered by custom GLSL shaders.
• Interactive Animations: Advanced GSAP animations for UI elements and camera movements.

🛠️ Tech Stack

• Framework: React (Vite)
• Language: TypeScript
• 3D Engine: Three.js & React Three Fiber
• Animations: GSAP
• Styling: Tailwind CSS
• Scrolling: Lenis

🚀 Getting Started

Follow these steps to run the project locally:

1. Clone the repository
git clone https://github.com/riki-k-dev/artilo.git
cd artilo

2. Install dependencies
npm install

3. Start the development server
npm run dev

4. Open your browser
Visit `http://localhost:5173` to view the gallery.

📂 Project Structure

artilo/
src/
├── components/   # React components (Gallery, Intro, Overlay)
├── content/      # Data files (Image details)
├── hooks/        # Custom hooks (useMouse, etc.)
├── shaders/      # GLSL Vertex and Fragment shaders
├── App.tsx       # Main application entry
└── main.tsx      # DOM rendering