Craftly-Ai

you can also add manually
Set your preferences
Set your preferences
Add or click picture
Login/Signup
review your material
Ai generated ideas
Ai generated ideas
Landing page
Ai generated ideas
Saved ideas

Inspiration

Every day, millions of households throw away materials that could become something beautiful. We were inspired by the idea that creativity shouldn't require a trip to the craft store — it should start with what's already in your recycling bin. We wanted to build a tool that makes sustainable crafting accessible to everyone, from kids to adults, beginners to experts.

What it does

Craftly AI lets you snap or upload photos of household waste and recyclable materials. The app uses AI (Claude by Anthropic) to automatically detect what materials you have, then generates 3–5 unique, personalized DIY craft ideas based on your skill level, available time, and purpose. Each idea comes with step-by-step instructions so you can start creating immediately. You can save your favorite crafts and share them with others.

How we built it

Frontend: React 18 with a fully custom CSS design system (no UI library)
AI: Anthropic Claude API for both image-based material detection and craft idea generation
Auth & Storage: localStorage-based user accounts with session persistence
Design: Mobile-first responsive layout with smooth animations and a playful color palette
Deployment: Built for easy deployment on Vercel or Netlify

Challenges we ran into

Getting the AI to return consistently structured JSON for craft suggestions required careful prompt engineering
Handling image uploads and converting them to base64 for the Claude vision API
Building a smooth multi-step flow (upload → detect → preferences → results → detail) that felt intuitive on mobile
Managing merge conflicts when collaborating on features like auth and sharing simultaneously

Accomplishments that we're proud of

A fully functional AI pipeline from photo upload to step-by-step craft instructions in seconds
Clean, polished UI that feels like a real product — not a hackathon prototype
User authentication with saved crafts that persist across sessions
The app works end-to-end with real AI responses, not mock data

What we learned

How to integrate multimodal AI (vision + text) into a real user flow
The importance of prompt design when you need structured, reliable AI output
How much UX polish matters — small animations and transitions make a huge difference in feel
Balancing feature scope during a hackathon: ship what works, cut what doesn't