Turn single product images into interactive 3D spins.

TurntableAI is an open-source tool designed for e-commerce, allowing you to generate consistent 3D rotation videos from a single static product photo. It leverages modern Video Diffusion Models via Hugging Face's ZeroGPU infrastructure to "hallucinate" accurate side and back views.

• 🚀 AI-Powered Generation: Generates 8 smooth angular views (0°–360°) from one input image.
• 💾 Smart Persistence: All progress is saved locally. Refresh the page or close the tab without losing your work.
• ⏯️ Resumable Workflow:
  • Hit a daily GPU quota? No problem.
  • The app saves partial progress. Come back tomorrow and click "Resume Generation" to finish the remaining frames.
• 🛠️ Power User Tools:
  • Manual Upload: Have a better frame from another run? Patch it in manually.
  • Reordering: Drag (or click arrows) to fix frame sequences if the AI gets confused.
• 📦 Export Options:
  • Interactive Web Viewer (Spin to rotate)
  • Download individual frames
  • Export as GIF or MP4 video

• Node.js 18+
• A Hugging Face Account (Free tier works, Pro recommended for heavy usage)

1. Clone the repository

   git clone https://github.com/yourusername/ecommerce-3d-viewer.git
   cd ecommerce-3d-viewer
   

2. Install dependencies

   npm install
   

3. Run the development server

   npm run dev
   

4. Configure API Token

   • Open the app in your browser (usually http://localhost:5173).
   • Click the Settings (Gear Icon) in the top-left sidebar.
   • Enter your Hugging Face Access Token (Read permissions are sufficient).

• Best Input: Use images with a clear white or transparent background.
• Quota Limits: The underlying AI runs on Hugging Face ZeroGPU, which has daily usage limits.
  • If you see a "Quota Exceeded" error, the app will stop safely.
  • Use the Resume feature after your quota resets (usually 24h) to complete the model.

• Frontend: React 19, Vite, TypeScript
• State/Animations: Framer Motion
• AI Backend: @gradio/client connecting to HunyuanVideo-I2V (or similar spaces)
• Styling: Vanilla CSS + Glassmorphism design system

MIT License. Feel free to use this for your own e-commerce projects!