AnyhowWHACK

Landing page, with an option for uploading
Select IKEA manual
Confirm manual details
Progress of uploading IKEA manual
Visualise assembly steps with 3D interaction
Alternative to uploading: Browse through public libraries for manuals

Inspiration

Assembling IKEA furniture can be confusing and frustrating. Flat diagrams and skipped steps often leave users guessing. We wanted to simplify the process and make it interactive, using AI to turn static manuals into immersive 3D instructions.

What it does

AnyhowWHACK lets users upload furniture manuals (PDFs or images) and automatically generates step-by-step 3D instructions. It shows which tools and parts are needed, highlights warnings, and animates each step in 3D using Three.js, making assembly intuitive and fun.

How we built it

Frontend: React, Tailwind, Radix for dialogs and modals.
Backend: Node.js + Express, Supabase for file storage and database.
PDF/Text Parsing: pdf2json extracts text from uploaded manuals.
AI Parsing: Claude API processes the extracted text to generate structured assembly steps.
3D Visualisation: Three.js renders interactive step-by-step 3D assembly on the web.

Challenges we ran into

Parsing PDFs reliably across different formats.
Handling large file uploads and ensuring Supabase storage/database updates were atomic.
Integrating Claude API to generate accurate, step-by-step instructions from noisy manual text.
Creating smooth, understandable 3D animations with Three.js for complex assemblies

Accomplishments that we're proud of

End-to-end pipeline: upload → PDF parsing → AI step generation → 3D visualization.
AI parsing using Claude API produced structured, actionable assembly steps.
Three.js 3D rendering brings manuals to life, reducing user confusion.
Built a user-friendly interface for non-technical users.