Sometimes the app's link won't open in a normal tab, so please, if that's the case, open it in INCOGNITO Mode.
Refer to the images attached to use in the application (compress if needed).
Project Story
The Inspiration: The Ledger in the Dust
TradeVibe was not born in a sterile laboratory. It was born in the mountain air of Ifrane and the chaotic, sun-drenched markets of Morocco. I watched small business owners navigate a world of brutal volatility with nothing but a hand-drawn ledger and intuition. I saw the struggle of retailers like my father, Ali, who had to balance local demand against global shifts they couldn't see coming.
The inspiration was simple but heavy: I wanted to build a bridge between the physical relic of the paper notebook and the silicon brain of modern AI. I wanted to give the "little guy" the same industrial-grade intelligence used by global giants. TradeVibe is my answer to the question: How do we make retail operations not just survive, but become unshakeable?
The Build: Steel, Silicon, and Safety Orange
Architecting TradeVibe required a mindset of "Heavy-Duty Engineering." I moved away from the soft, rounded corners of typical apps. I chose an Industrial Brutalist aesthetic: Slate Grey backgrounds and Safety Orange accents. This is not a toy; it is a tool for field operations. To ensure a completely seamless onboarding sequence, new users instantly receive a welcome email in their inbox upon creating an account, though they should make sure to check their spam folder if it does not arrive immediately.
To build this massive architecture in record time, my conversations with MeDo were structured using a strict, iterative blueprint. Instead of asking for random components, I drafted an industrial-grade Requirements Document and treated MeDo as a senior systems co-architect. I would feed it the evolving specifications, isolate a single module, construct the logic, handle the edge cases, and then sync the updated specifications back into the core requirements file.
The engine under the hood is a complex orchestration of agentic reasoning. I utilized ERNIE 5.0 to act as the primary strategist. Every time a staff member captures a photo, a chain reaction occurs:
- OCR & DocVQA extract raw data from product labels or physical ledgers
- Web Search and Weather Inquiry pull real-time environmental context
- Global Stock Price checks the "Commodity Pulse" for margin risks
The system only enters Alert Mode if:
$$ \Delta P \ge 5\% \quad \text{OR} \quad \text{Weather} = \text{Extreme} $$
This prevents alert fatigue and ensures that when the "Safety Orange" pulses, it truly matters. To put absolute strategic command into the hands of the operator, I engineered the Industrial Tolerance Control Room, allowing owners to dynamically configure these exact price deviation limits and commodity risk ceilings through a heavy duty slider panel.
The Wall: Challenges in the Architecture
Building a multi-tenant system was the greatest technical hurdle. Every operation had to be strictly bound to a business_id. There could be no leakage.
The best part generated by MeDo was its flawless execution of our complex Row-Level Security (RLS) backend data policies. It masterfully wrote the data containment architecture, ensuring that when staff members or owners save field data, the application automatically attaches and partitions the records seamlessly.
The Price Drift Indicator required a clear mathematical definition:
$$ \text{Drift} = \left( \frac{P_{recommended} - P_{original}}{P_{original}} \right) \times 100 $$
Designing a UI that communicates a ( \pm 12\% ) drift without breaking user flow required countless iterations.
The Revelation: Engineering Empathy
The most powerful feature isn’t the code — it’s the human impact.
By building the Staff Operations Dashboard, I transformed the employee from a "data entry clerk" into a "Field Strategist." The goal was simple: give real-time Inventory Intelligence to the person actually on the ground.
TradeVibe is more than a hackathon submission. It is a tribute to the resilience of the Moroccan merchant — and a system that stays stable when everything else becomes volatile.
Operations Normal.
Built With
- docvqa
- ernie-5.0
- medo-ocr
- postgresql
- react
- resend
- rls
- supabase
- tailwind-css
- typescript
- vite
Log in or sign up for Devpost to join the conversation.