AI-powered diagnostic tool for analyzing failed 3D prints. Upload photos of your print failure, provide print parameters, and get detailed analysis with specific fixes.
- 📱 Progressive Web App: Installable on mobile devices, works offline
- 📸 Camera Integration: Direct camera capture for quick diagnostics
- 🖼️ Multi-Image Analysis: Upload 1-5 photos of your failed print
- 🤖 Dual AI Support: Works with Anthropic Claude or OpenAI GPT-4V
- 📊 Expert Diagnostics: Built-in knowledge base of 20 common 3D print failures
- 🔐 BYOK (Bring Your Own Key): Your API key stays in your browser
- 🌊 Streaming Responses: Real-time diagnosis as the AI thinks
- 🌙 Dark Mode: Default dark theme perfect for workshop use
- 👆 Touch-Optimized: Large tap targets, mobile-first design
- 🚀 Fast: Edge functions, app shell caching, instant loading
# Clone the repository
git clone https://github.com/yourusername/dx3d.git
cd dx3d
# Install dependencies
npm install
# Run development server
npm run devOpen http://localhost:3000 in your browser.
- Install PWA: Visit Dx3D.app and tap "Add to Home Screen"
- At Your Printer: Open the app from your home screen
- Take Photos: Tap "Take Photo" to capture failed print (1-5 images)
- Configure: Enter API key first time (saved for later)
- Fill Form: Quick form with print parameters
- Diagnose: Get instant AI analysis
- Visit: Open Dx3D.app in your browser
- Upload Photos: Drag-and-drop or click to upload images
- Enter Details: Fill print parameters
- Get Diagnosis: Streaming AI analysis with specific fixes
- Select AI Provider: Choose between Anthropic (Claude) or OpenAI (GPT-4V)
- Enter API Key: Your key is stored locally and never sent to our servers
- Fill Print Info:
- Printer model (e.g., "Ender 3 Pro")
- Filament type (PLA, PETG, ABS, TPU, Nylon, Other)
- Nozzle temperature (°C)
- Bed temperature (°C)
- Layer height (mm)
- Print speed (mm/s)
- Problem description
- Capture/Upload Photos: Take photos or upload from gallery (1-5 images)
- Click Diagnose: Get streaming AI analysis with specific fixes
Dx3D can identify and provide fixes for 20 common 3D print failures:
- Layer Separation / Delamination
- Stringing / Oozing
- Warping / Lifting Corners
- Poor Bed Adhesion
- Elephant Foot
- Z-Banding / Layer Lines
- Under-Extrusion
- Over-Extrusion
- Blobs / Zits
- Ghosting / Ringing
- Clogged Nozzle
- Layer Shifting
- Pillowing (Top Surface Gaps)
- Bridging Failures
- Support Removal Damage
- Dimensional Inaccuracy
- Brittle Prints
- Nozzle Crashes / Dragging
- Wet Filament Symptoms
- Retraction Issues
Each diagnosis includes:
- Symptoms: Visual identification
- Causes: Root cause analysis
- Fixes: Specific, actionable steps with exact settings
- Prevention: Long-term improvements
Or manually:
# Install Vercel CLI
npm install -g vercel
# Deploy
vercel
# Deploy to production with custom domain
vercel --prodBefore deploying, generate PWA icons:
cd public
node generate-icons.js
# Then convert SVG to PNG using ImageMagick or online tool
# See public/ICONS.md for instructionsOr use placeholder SVG icons (included).
No environment variables needed! This is a completely client-side PWA with edge functions.
- Frontend: Next.js 14 (App Router), React 19, TypeScript
- Styling: Tailwind CSS with dark mode
- API Route: Edge function at
/api/diagnose - AI Integration: Direct API calls to Anthropic or OpenAI
- Image Handling: Base64 encoding for vision API compatibility
- Deployment: Vercel (or any Next.js-compatible platform)
- ✅ API keys stored locally only (localStorage)
- ✅ No backend database (zero data retention)
- ✅ No user accounts (no authentication needed)
- ✅ Images processed in-browser (base64 encoding)
- ✅ Edge functions only (no server-side storage)
- ✅ Open source (audit the code yourself)
Your API key is only sent to the AI provider you select (Anthropic or OpenAI). We never see your key or images.
dx3d/
├── app/
│ ├── page.tsx # Main page
│ ├── layout.tsx # Root layout
│ ├── globals.css # Global styles
│ └── api/
│ └── diagnose/
│ └── route.ts # Edge function for AI calls
├── components/
│ ├── DiagnosisForm.tsx # Main form component
│ ├── ImageUpload.tsx # Image upload with preview
│ └── DiagnosisResult.tsx # Streaming result display
├── lib/
│ ├── types.ts # TypeScript types
│ └── prompts.ts # System prompt with RCA database
└── public/ # Static assets
- Next.js 16: App Router, Edge Runtime
- React 19: Latest features
- TypeScript 5.9: Type safety
- Tailwind CSS 4: Styling
- Vercel AI SDK: (Future: streaming utilities)
# Development
npm run dev
# Production build
npm run build
npm start
# Lint
npm run lintContributions welcome! This is an open-source project.
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
- PWA support for mobile camera access
- Mobile-first responsive design
- Offline app shell caching
- Export diagnosis as PDF
- Compare before/after prints
- Community-contributed failure database
- Multi-language support
- Offline mode with local LLM
- Print history (optional local storage)
- Push notifications for long diagnoses
- Share diagnosis via link
MIT License - see LICENSE file for details.
Built with ❤️ for the 3D printing community.
- Vision AI: Anthropic Claude & OpenAI GPT-4V
- Framework: Next.js
- Deployment: Vercel
Disclaimer: This tool provides diagnostic suggestions based on AI analysis. Always use your judgment and follow proper safety procedures when adjusting printer settings.