hezqilzaidan/karya-studio-ai

# KaryaStudio AI > **Professional Design Studio in the Palm of MSMEs** > > AI Content Generator for Indonesian MSMEs — Alibaba Cloud AI Creativity Hackathon 2026 --- ## ✨ Features ### 🎯 Core Functionality | Feature | Description | |---------|-------------| | **Smart Product Photography** | Transform simple descriptions into professional studio-quality product photos | | **Cinematic Promo Video** | Bring product photos to life as engaging short promotional videos | | **AI Prompt Enhancer** | Automatically improve simple prompts into detailed, professional descriptions | | **Batch Generate** | Process up to 10 images simultaneously with queue management | | **Template Gallery** | Ready-to-use prompt templates for Food, Fashion, Handicrafts, and more | | **Achievement System** | 9 unlockable badges to gamify the user experience | ### 🎨 User Experience - **Interactive Onboarding** — 6-step guided tour for first-time users - **Dark/Light Mode** — Seamless theme switching with persistent preference - **Mobile-First Design** — Optimized for smartphone users (primary MSME access) - **Smooth Animations** — 60fps animations using Framer Motion - **Responsive Layout** — Perfect display from mobile to desktop --- ## 🚀 Tech Stack - **Framework:** Next.js 14+ (App Router) - **Language:** TypeScript - **Styling:** Tailwind CSS - **Components:** shadcn/ui - **Animations:** Framer Motion - **State Management:** Zustand - **Theming:** next-themes - **Icons:** Lucide React --- ## 📦 Installation ### Prerequisites - Node.js 18+ - npm or yarn or pnpm ### Clone & Install ```bash # Clone the repository git clone github.com cd karyastudio-ai # Install dependencies npm install # Install shadcn/ui components npx shadcn add button card dialog input textarea select tabs progress tooltip dropdown-menu sheet skeleton badge avatar separator scroll-area accordion switch slider sonner alert drawer breadcrumb command