Single-page instructional website explaining a smart textile-collection container concept, its user journey, control panel, and hardware budget.
The goal was to explain a physical product idea in a way that is easy to scan: how users interact with the container, which access methods are supported, and why the container model is different from ordinary lockers.
| Area | Description |
|---|---|
| Main concept | Visual container anatomy with labeled parts |
| User journey | Six-step flow from arrival to completed textile drop |
| Control panel | QR, NFC, RFID, button, display, camera, and LED states |
| Comparison | Container model compared with lockers |
| Budget | Hardware cost breakdown for the prototype |
| Format | One self-contained index.html file with embedded CSS and SVG visuals |
Open index.html directly in a browser, or serve the folder:
python -m http.server 8000Then open:
http://127.0.0.1:8000/
This is a lightweight visual communication project. It shows the ability to turn a technical/product explanation into a readable static page with diagrams, step-by-step flow, responsive layout, and clear cost information.