📸 PhotoBooth — Capture, Customize & Download Your Photo Strips

A fully-featured Next.js PhotoBooth web application that allows users to take pictures using their device camera, choose fun props, pick photo strip layouts, apply frames, retake shots, and export the final styled image.

This README includes real screenshots of the website.

---

🌐 Live Demo

👉 https://photo-booth-opal.vercel.app/

---

📷 Features

🎭 Props Selection

Choose from a range of fun props like hats, glasses, hairbands, emojis, and more.

---

🧩 Layout Choices

Pick predefined layouts like 1-cut, 2-cut, 4-cut, and 8-cut.

---

📹 Camera Access & Live Preview

Grant camera permission and view your live preview with props added in real time.

---

📸 Capture With Countdown & Retakes

Take photos using a 5-second countdown and get 2 retake attempts per shot.

---

🖼️ Frame & Final Editing

Apply themed frames, add overlays, and prepare the final output.

---

🧭 User Flow

Landing Page

↓

Props Selection → Layout Selection

↓

Camera Access & Preview

↓

Capture Photos (with timer)

↓

Retake up to 2 times

↓

Choose Frame Design

↓

Download Final Image

---

🛠️ Tech Stack

• Next.js (App Router)
• TypeScript
• Tailwind CSS
• Framer Motion
• Canvas / html2canvas
• ShadCN / Aceternity Components

---

🚀 Getting Started

Clone Repo

git clone https://github.com/your-username/your-repo.git
cd your-repo

Install Dependencies

npm install

Run Development Server

npm run dev

Build for Production

npm run build
npm run start

---

📜 License

MIT License.

---

❤️ Contributions

Pull requests and suggestions are welcome.