A fully interactive prototype of an FMCG distribution management system, built to demonstrate product thinking across a multi-level sales chain.
FMCG companies operate through a complex distribution chain — from the company warehouse all the way to the neighbourhood kirana store. Managing stock, orders, attendance, and sales performance across thousands of touchpoints is a coordination nightmare. Most companies still rely on WhatsApp groups and Excel sheets.
FieldOps is a prototype for what a purpose-built system for this workflow could look like.
Company HQ → CNF Agent → Super Stockist → Distributor → Retailer
Each level only sees and interacts with its immediate upstream and downstream. A distributor doesn't see CNF data. A retailer doesn't see SS data. The company admin sees everything.
The prototype includes 6 fully distinct role-based views:
| Role | What they do |
|---|---|
| 🏢 Company Admin | Full visibility — all levels, orders, inventory, employees, masters |
| 🚛 CNF Agent | Receives stock from company, dispatches to Super Stockists |
| 🏪 Super Stockist | Buys from CNF, sells to Distributors |
| 📦 Distributor | Buys from SS, sells to Retailers |
| 🛒 Retailer | Buys from Distributor, manages shelf stock |
| 👤 Field Employee | Beat plan, attendance, visit tracking, sales targets |
Company Admin
- Live distribution pipeline showing stock at every level
- CNF, SS, Distributor and Retailer directories with full hierarchy
- All orders (Company → CNF only — correct chain enforced)
- HQ warehouse inventory management
- Employee directory with attendance and field performance
- User management — add, suspend, reset password, approve new users
- Masters — Products, States & Cities, Beat master with assignments
CNF / SS / DB / Retailer
- Role-specific dashboards with relevant KPIs
- Correct upstream supplier info and downstream account list
- Orders, inventory, reports — all scoped to their level
Field Employee
- Today's beat plan with visit status
- GPS-based attendance check-in (separate mobile prototype)
- MTD target vs achievement tracking
- Monthly attendance calendar
- Every
+ Addbutton and modal is context-aware — adding a retailer from the DB page opens a retailer form with a DB parent dropdown, not a generic product form - Parent-child relationships are reflected everywhere — a retailer shows their distributor, a distributor shows their SS, and so on
- Stock health cascades — OOS at DB level is visible to company admin as an alert
- Masters are separated from transactions — products, states, beats are managed independently
Single-file HTML prototype — no framework, no backend, no build step.
- Vanilla HTML, CSS, JavaScript
- Google Fonts (Plus Jakarta Sans + Instrument Serif)
- All data is hardcoded for demonstration purposes
A separate mobile prototype (gps_checkin.html) demonstrates the field employee check-in flow:
- Animated GPS map with accuracy ring
- Selfie capture requirement before check-in is enabled
- Loading state → success screen with location, time, GPS accuracy
- Check-out flow with day summary
Built by Maulik Tanna