The Flowstep Challenge was an interesting feat that involved solving a puzzle.The Flowstep Challenge was a challenge to solve a puzzle.
Project link: https://app.flowstep.ai/file?activeFileId=da7ebe18-ef82-4561-a2ad-3069a37a6c0e
This has been an issue I have had on my mind for quite a while.
We tend to throw away broken items when they're too costly to repair. Three year old kettle. After seven, there is a washing machine. We assume that they are "too far gone. We don't often ask them if they can be fixed because it is just easier to get a replacement.
The knowledge for repairing already present. iFixit has been recording repairs for a more than 15 years. But that info is only in forums, behind model numbers that most people don't know about, and it's never when you're standing in front of a broken product with a screwdriver in your hand.
Thus the object goes into the trash can.
It's one of the little, silent ways millions of perfectly repairable products are discarded each year.
My answer is BENCH.
It's a walk down memory lane for physical items. Just point your phone at a broken thing, and BENCH will tell you what the problem is, if it's fixable, how to fix it, and will remember it all.
Complete flow
Scan
Photograph one of the damaged items. BENCH identifies it from just one photograph.
Break it down
The object is broken down into its constituent parts and each discernible part is named.
Diagnose
BENCH is able to identify the most probable failed component, and why it failed, and also give a confidence score for each diagnosis.
Repair
Follow a step by step repair procedure, from a single screw to replacing a component to soldering repair. BENCH can also make recommendations for an auto repair shop if one is required.
Attempts matter
A halfway completed repair is a repair attempt. BENCH recorded repairs; did not hide repairs.
Automatic repair log
Once the repair is complete BENCH automatically logs the failure, the replacement and the amount of waste that was diverted from landfill. Manual typing is not required.
The Shelf
Each object has its own lifespan record, such as its age, repairs, maintenance, environmental effects, etc.
There is no “Buy a replacement” button on BENCH, you can order a replacement part but you won't be able to order a brand new replacement part through the app.
Handover
All repair records are attached to the object. If it is sold or donated, the next owner will get the entire repair history.
How I built it
The prototype was developed with the help of Claude + Flowstep via MCP.
All screens created with prompts using the Flowstep MCP server. I have never used Canvas to make any interface by hand. All of the project was created via prompts; Claude is managed by get-design-guidelines and update-design-guidelines and these prompts were all sourced from a single DESIGN.md (http://DESIGN.md) file.
The prototype has a uniform design system as all screens are designed the same way, so there is no need to maintain each screen manually.
Making BENCH a real product
All of the features exhibited in the prototype are technologically feasible in today's environment.
iFixit API – Repair guides, teardown instructions and parts identification.
Nearby repair shops / Repair Café locations: Overpass API / OpenStreetMap.
Wikidata REST API for product metadata, manufacturing year and product lineage.
#FlowstepChallenge
2
62
Ever saved a bookmark thinking "I'll definitely come back to this"... and then never found it again?
Same. That's exactly why I built WeBook.
WeBook is a free Chrome extension that organizes your bookmarks FOR you:
AI automatically sorts every bookmark into the right folder
Adds 3 smart tags so you can actually find things later
Saves your open tabs as groups you can restore anytime
Finds duplicate bookmarks and dead links
One-click backup and restore
No more messy bookmark bars. No more "247 unsorted bookmarks." Just save a page and WeBook handles the rest.
It's completely FREE on the Chrome Web Store
https://www.webook.website/
I built this as a student project and I'd love your feedback - try it and tell me what you think!
1
33
AA Ferro Lanka — Precision Stirrup Fabrication
🔗 Live app: https://aaferrolanka.base44.app/
The business
A family CNC steel workshop in Piliyandala, Sri Lanka. They bend custom reinforcement stirrups — the steel rings inside every concrete column and beam. A WG-12 CNC bender, accurate to ±1mm, capable of 1,200 stirrups an hour.
Real business. Real machine. Real customers. Zero digital presence.
Proof - Google Map (https://www.google.com/maps/place/AA+Ferro+Lanka/@6.7963424,79.9076194,18z/data=!4m6!3m5!1s0x3ae2450a97c35061:0x36e19b48819ddc44!8m2!3d6.7961547!4d79.9089943!16s%2Fg%2F11nr2jh0n8?authuser=0&entry=tts&g_ep=EgoyMDI2MDcwOC4wIPu8ASoASAFQAw%3D%3D&skid=4354c7ed-4209-4b9a-8333-d492beda682c)
BEFORE
Orders taken by phone. Dimensions written on scrap paper.
Every quote calculated by hand, on every call — steel weight, cutting length, price per kg.
No record of who paid a deposit and who didn't.
Customers ringing all day to ask "is it ready?"
Steel running out mid-job, discovered at the machine.
Offcut waste on every single bar — never once measured.
AFTER
A live, mobile-responsive platform that runs the entire business — quoting, ordering, payments, production, delivery, and the owner's daily operations — with WhatsApp as the interface, because that's where he actually is.
THE PRODUCT
Public site Home · Products · Our Story & Team · Workshop Gallery · Track Order · Support · Get Quote · Customer testimonials from real partner stores
The configurator — quote in one second, not one phone call
Shape: rectangular, square, round, custom
Rebar size: 6mm / 8mm / 10mm / 12mm — each showing live stock in kg
Dimensions + quantity
Returns exact cutting length, weight per stirrup, total material weight, price per kg, total price and 50% deposit — calculated from today's live steel rate, read from the database, never hardcoded
Stock is checked before the price is quoted. An out-of-stock size is hard-blocked. The workshop cannot sell steel it doesn't have.
No account required to get a price.
The collection network 21 real hardware stores pulled from Google Places across the delivery corridor, sorted by distance from the customer's site — plus collection at the workshop. Any hardware store can self-register as a partner and become a collection point.
Owner Control Room (secret route — not /admin, linked from nowhere)
KPI cards: total orders, awaiting deposit, in production, deposits collected, avg rating
Order pipeline: Pending → Confirmed → In Production → Ready → Delivered, advanced with one tap — and every tap messages the customer automatically
Live steel price + stock editing with visual stock bars — change the rate, and every quote on the public site is new one second later
Full WhatsApp activity log — every message the system ever sent
Lead pipeline: New → Contacted → Quoted → Won → Lost
Hardware business verification (Verify / Unverify)
Hardware store dashboard Its own incoming orders, its own stock, its own price, its own margin, its own QR scanner. 21 drop-off points become 21 sales channels.
Steel supplier dashboard Restocks and re-prices the workshop directly — and cannot see one customer, one phone number, one message. That's row-level security, not a hidden button.
Customer portal My Orders + Track Order. Order ID, items, total, deposit status, live production status. Nobody has to phone and ask.
QR delivery verification Every bundle carries a QR tag. The store scans it. Delivery confirmed.
THE AUTOMATIONS — 17 live
On order creation
Owner alert — WhatsApp + email in seconds, with full spec, deposit and bank slip
Customer confirmation — order number + exact deposit due
Stock deduction — steel deducted from inventory automatically
Low-stock alert — the owner is warned before the machine stops
Order sanity check — catches a typo before steel is cut. 2500 instead of 250 is 500 stirrups of scrap. It freezes the order. Nobody starts the machine until a human approves.
Steel Waste Optimizer — see below. This is the one.
Scheduled
7. Deposit chaser — 09:30 daily. Chases three times, then escalates to the owner to call. Recovers revenue that used to just vanish.
8. Morning briefing — 08:00 daily: new orders, money owed, what's on the machine, what steel to buy
9. Production batching — groups the day's jobs by rebar size, so the machine is threaded once, not ten times
10. Steel purchase plan — tells the owner exactly what to buy, before he runs short
11. Weekly summary — Monday: orders, revenue, steel used
12. Post-delivery follow-up — 3 days after delivery. 5 stars route to Google. 1 star routes privately to the owner — before it becomes a public review.
On status change
13. Status updates — Confirmed / In Production / Ready. Kills every "is it ready?" phone call.
14. Ready-for-collection — store name, address, Google Maps pin, balance due
15. Honest ready dates — a real date from the real production queue, with an automatic warning the moment it slips
Inbound
16. Instant lead capture — every enquiry auto-replied before it goes cold
17. QR delivery confirmation — bundle scanned at the store, order closed
Reliability: nothing ever fires twice. Every automation is locked behind an idempotency flag on the order itself. A retry cannot spam a customer. A re-run cannot deduct the same steel twice. And with zero API keys configured, nothing breaks — every message queues as a one-tap wa.me (http://wa.me) link. Value on day one, with no setup.
THREE AI AGENTS ON WHATSAPP
Customer Assistant — quotes today's real price from live stock, at midnight on a Sunday. Photograph an engineer's drawing and it reads the stirrup off the page. It can take an order. It can never mark one paid.
Manager Agent — the owner's control room, in a chat window. "How much am I owed?" "What's on the machine?" "Make 8mm 290." He speaks; the website changes. It can move a price. It cannot move an order — that permission does not exist.
Production Planner — the CNC cut-list optimizer. Groups jobs by diameter, calculates bars to load, stirrups per bar, offcut per bar, and warns when the steel runs short before the machine starts
BONUS CRITERIA
✅ Live and published · ✅ Mobile-responsive · ✅ Real business, actively using it · ✅ Before/after documented · ✅ AI Superagent implemented (×3) · ✅ Automation demonstrably drives business outcomes (deposit recovery + LKR 8,144 material saving) · ✅ Real Google Places data, real partner store network
Built entirely on Base44.
2
8
377
✨ Aftercare
The hospital discharge summary, redesigned into a calm, patient-first recovery companion.
Good healthcare information can save lives. Good information design helps people understand it.
🔗 Project Links
🎨 Wonder Design File: https://app.wonder.so/isumenuka/files/019f31a3-8c46-7707-b8d1-9bb74298da0b
💻 React Export / GitHub: https://github.com/isumenuka/Aftercare
🩺 The Challenge
Every day, millions of patients leave hospitals with discharge instructions that are difficult to read, filled with medical jargon, and presented in dense blocks of text.
Patients are often tired, anxious, in pain, or under medication when they receive this information. Unfortunately, this is exactly when understanding it matters most.
This isn't simply a healthcare problem.
It's an information design problem.
📚 Research Validation
📄 Engel et al. (2009)
Annals of Emergency Medicine
Key Finding
78% of emergency department patients demonstrated deficient comprehension in at least one aspect of their care or discharge instructions, and most believed they understood everything correctly.
This reveals a dangerous gap between what patients think they understand and what they actually understand.
Research Paper
https://consensus.app/papers/details/78ce400adebd51cfa38953d47bbc82f7/
📄 Sahhar et al. (2025)
The American Journal of Medicine
Researchers found that:
• 81% of standard English discharge instructions exceed the recommended sixth-grade reading level.
• Multilingual discharge instructions remain limited, reducing accessibility for many patients.
Together, these studies demonstrate that improving information design can directly improve patient safety.
💡 The Solution
Aftercare
A mobile experience that transforms a hospital discharge summary into a clear, personalized recovery companion.
Simply scan the discharge document and receive an interface designed around what patients actually need.
Instead of pages filled with confusing medical language, patients receive simple guidance that answers:
✅ What happened?
✅ What should I do today?
✅ Which medications should I take?
✅ What symptoms should I watch for?
✅ When should I contact my doctor?
✅ When should I visit the emergency room?
📱 Core Screens
📄 Scan Discharge Summary
Capture the printed discharge document and instantly convert it into structured, readable information.
❤️ Recovery Today
A simple daily dashboard showing recovery progress, today's tasks, hydration, activity, appointments, and care reminders.
💊 Medication Reminder
An interactive medication timeline explaining:
• What to take
• When to take it
• Why you're taking it
• Missed dose reminders
🚨 Warning Signs
Important symptoms are grouped into clear actions.
🟢 Continue recovery
🟡 Contact your healthcare provider
🔴 Visit the emergency room immediately
No medical jargon.
Just clear actions.
🎨 Design Language
The interface was designed to feel calm, reassuring, and easy to read.
• Deep near-black background
• Soft ambient magenta, pink, and blue shader lighting
• Bento-style information cards
• Large accessible typography
• Ghost-style LCD numerals
• High-contrast layout
• Warm pastel recovery cards
• Yellow highlights for urgent information
Every visual decision helps reduce stress instead of creating it.
⚙️ Built Entirely in Wonder
The entire experience was designed inside Wonder.
Workflow
✨ Wonder Chat generated the initial component system.
✨ Wonder Shader tools created the ambient backgrounds.
✨ Wonder components built the reusable interface.
✨ Wonder MCP connected Claude to structure the discharge data.
✨ The finished design was exported directly to React and Tailwind CSS.
This demonstrates a complete Design → AI → Code workflow.
🛠 Technology Stack
• Wonder
• Wonder Chat
• Wonder Shader Generation
• Wonder MCP
• Claude
• React
• Tailwind CSS
🔌 API Stack
Free APIs
• HL7 SMART on FHIR Sandbox
• NIH RxNorm / RxNav
• MedlinePlus Connect
❤️ Why It Matters
Healthcare already has the right information.
Patients simply receive it in the wrong format.
Aftercare demonstrates how thoughtful interface design, accessibility, and AI-powered workflows can make recovery instructions understandable, actionable, and reassuring.
Better information design is patient safety.
✨ Designed in Wonder.
🏥 Built for the day patients go home.
1
120