Projects using React in GatineauProjects using React in Gatineau
Cover image for Packaging looks like graphic design.
Packaging looks like graphic design. But every word takes physical space. For Day 19, I built PACKSHIFT an interactive packaging experience where claims, languages, warnings and data become pressure on a finite surface. It starts with the real 56 mm width of the carton. Then you try to make everything fit. Make the box smaller and the pressure becomes physical: 56 mm → pressure → CRACK → recovery → museum The final package doesn’t just show the solution — it remembers the negotiation that produced it. Underneath the public game is a deeper spatial compiler built with Blender + Three.js / React Three Fiber, where the same package can open, decompose, expose its dieline, redistribute information and refold. Packaging is not a file. It is a compiled surface. Full case study ↓ https://contra.com/p/3WBccUlM-packshift-packaging-is-a-compiled-surface Live experience ↓ https://packshift-awd.pages.dev/ GitHub ↓ https://github.com/Faadil1/PACKSHIFT Would love to know which moment lands most for you: Actual Size, the Hydraulic Press, or the Museum?
1
115
Cover image for Modern Restaurant Website
Modern Restaurant Website
0
58
Cover image for DAY 16: CONDITION TRACE
30 Days
DAY 16: CONDITION TRACE 30 Days of Real Business Problems Phase II I stopped at Day 15. Not because I ran out of problems. The format was becoming predictable. So I changed the rules. Phase II starts with a problem from museum conservation. Condition reports can document what was visible at different moments — but they cannot always prove when a physical change actually occurred. So instead of asking: “Where did the damage happen?” I reframed the problem: Trace when the feature first appears in the documentation. That became CONDITION TRACE. The prototype follows a fictional museum-loan case involving the same vessel across four signed condition records. Earlier examinations were completed under diffuse light. During the return-arrival inspection, the conservator introduces raking light. As the grazing angle changes, a hairline crack on the vessel’s upper-right shoulder becomes legible. That observation is preserved as OBS-04 and carried through a traceable evidence chain: SRC-03 → OBS-04 → CMP-01 → LIM-01 → FND-01 But the system deliberately refuses to overstate what the evidence proves. The earlier examinations were not performed under equivalent lighting conditions. So the conclusion remains narrow: FIRST DOCUMENTED APPEARANCE AUGUST 3, 2026 Not: “The damage happened on August 3.” Not cause. Not responsibility. Not liability. The interface follows the same principle. Light becomes an examination instrument. The observation persists through comparison. The evidence lineage remains visible. And the final finding must be deliberately sealed. The goal wasn’t to make an interface that looks forensic. It was to make the boundary of the evidence visible and traceable. TRACE THE RECORD. NOT THE BLAME. Live prototype: https://day16-condition-trace.vercel.app Day 16 / 30 Phase II begins.
2
175
Cover image for How I Built an SEO-First
How I Built an SEO-First AI Career Platform That Actually Ranks (And How I Can Do It For You) - Case study
8
2
163
Cover image for Modern  E-Commerce Web Application
Modern E-Commerce Web Application
0
63