WanderingTechBagDrop CDO blueprint

Booking system blueprint

Drop your bags, and prove they came back.

A two-sided booking system for luggage storage near transit hubs in Cagayan de Oro. Travelers book and pay, partner shops check bags in, and pickup is verified by matching a QR code to the tamper-seal number logged at drop-off.

  1. 01Surfaces
  2. 02Booking
  3. 03Pricing
  4. 04Status
  5. 05Partners
  6. 06Data
  7. 07Built
Type
Concept with a working booking demo
Stack
Supabase, vanilla JavaScript, QR codes
Hubs
5: Laguindingan Airport, Agora Terminal, Bulua Terminal, Divisoria, Cogon
Surfaces
Traveler booking, partner counter, operations
Booking
6 steps, with itemised pricing
Prepared by
Jam Susana
StartStepDecisionStops hereEnd

V1 · Oct 2026

Demo

Open the site

The traveler site, with the booking running in demo mode.

01

Three sides, one booking

The traveler, the partner shop and operations each get their own view.

Figure 01 · Surface map3 sides
SurfaceWho uses itWhat it doesAccess
Traveler siteA travelerExplains the service, pricing and hubs, and runs the six-step bookingOpen
Partner sign-upA shop or businessCollects an application to become a storage pointOpen
Partner counterA partner shopToday’s drop-offs and pickups, logging the seal, releasing bags, and the month’s payoutPassword
OperationsOperationsReviews partner applications and handles disputed bookingsPassword
02

The booking flow

Six steps from choosing a hub to holding a bag tag.

Figure 02 · Booking flow15 steps

Swipe sideways to see the whole flowchart

Booking flow flowchartYESNOYESNOYESNO
TriggerTraveler opens the bookingSix steps: Hub, Bags and Time, Price, Protect, Pay, Tag
Step1. Choose a hubHubs show live partner counters
Hub chosen?
ErrorAsk for a hubStays on step 1
Step2. Bags and timing1 to 10 bags, a drop-off time and a pickup time
Pickup after drop-off?
ErrorShow the timing messageStays on step 2
Data3. Price worked out in the openThe lower of the hourly and daily totals
Step4. Optional protectionA flat add-on, ₱20 per booking
Step5. Name and contactWho is picking the bag up
Details valid?
ErrorAsk for the detailsStays on step 5
StubbedPay with PayMongoA placeholder in this build: proceeds as if paid
DataCreate the bookingSaved to Supabase when keys are set, otherwise demo mode. Status: pending
End6. Bag tag and QRThe booking ID as a QR code, seal number left blank
Read this flow as a list
  1. Traveler opens the booking. Six steps: Hub, Bags and Time, Price, Protect, Pay, Tag
  2. 1. Choose a hub. Hubs show live partner counters
  3. Hub chosen?. A hub with a live partner
  4. 2. Bags and timing. 1 to 10 bags, a drop-off time and a pickup time
  5. Ask for a hub. Stays on step 1
  6. Pickup after drop-off?. Both times are required
  7. 3. Price worked out in the open. The lower of the hourly and daily totals
  8. Show the timing message. Stays on step 2
  9. 4. Optional protection. A flat add-on, ₱20 per booking
  10. 5. Name and contact. Who is picking the bag up
  11. Details valid?. Name 2+ characters, contact 5+
  12. Pay with PayMongo. A placeholder in this build: proceeds as if paid
  13. Ask for the details. Stays on step 5
  14. Create the booking. Saved to Supabase when keys are set, otherwise demo mode. Status: pending
  15. 6. Bag tag and QR. The booking ID as a QR code, seal number left blank
03

How the price is worked out

Per bag, the lower of an hourly total and a daily total.

Figure 03 · Rates and worked examples₱25/hr · ₱129/day
RateValue
Hourly₱25 per bag per hour
Daily flat₱129 per bag per day
Protection add-on₱20 flat per booking
Bags per booking1 to 10

Worked examples, from the same rule the booking uses

StayBagsHourly totalDaily totalCharged per bagStorage total
2 hr1₱50₱129₱50₱50
5 hr1₱125₱129₱125₱125
6 hr1₱150₱129₱129₱129
12 hr1₱300₱129₱129₱129
30 hr1₱750₱258₱258₱258
5 hr2₱125₱129₱125₱250
26 hr3₱650₱258₱258₱774
04

A booking, start to finish

The four statuses a booking moves through.

Figure 04 · Booking status4 statuses

Swipe sideways to see the whole flowchart

Booking status flowchartYESNO
TriggerBooking createdStatus: pending. The seal number is empty
Team actionPartner receives the bagLogs the seal number. Status: active
Dispute raised?
Team actionOperations flags the bookingStatus: disputed
Team actionPartner releases the bagChecks the QR and the seal number first. Status: completed
Team actionMarked resolvedStatus: completed
EndBooking completedCounts toward the partner’s payout
Read this flow as a list
  1. Booking created. Status: pending. The seal number is empty
  2. Partner receives the bag. Logs the seal number. Status: active
  3. Dispute raised?. Operations can flag any booking
  4. Operations flags the booking. Status: disputed
  5. Partner releases the bag. Checks the QR and the seal number first. Status: completed
  6. Marked resolved. Status: completed
  7. Booking completed. Counts toward the partner’s payout

Statuses

StatusMeaningSet when
pendingBooked, bag not handed over yetThe traveler finishes step 5
activeThe bag is in the partner’s custody, with a seal loggedThe partner receives the bag
completedThe bag has been releasedPickup is confirmed, or a dispute is resolved
disputedFlagged for operations to settleOperations flags it
05

Partners and payouts

How a shop joins, and how it is paid.

Figure 05 · Partner onboarding9 steps

Swipe sideways to see the whole flowchart

Partner onboarding flowchartYESNOYESNO
TriggerA business appliesName, type, address, contact, hours, space, notes
Name and number given?
ErrorAsk for the missing detailNothing is sent
DataApplication savedStatus: new
Team actionOperations reviews itOpen applications are new or reviewing
Approve?
Team actionPick a hub and a revenue shareA percentage from 0 to 100
DataPartner goes liveAdded as an active partner. Application marked approved
DataApplication marked rejectedStatus: rejected
Read this flow as a list
  1. A business applies. Name, type, address, contact, hours, space, notes
  2. Name and number given?. Both are required
  3. Application saved. Status: new
  4. Ask for the missing detail. Nothing is sent
  5. Operations reviews it. Open applications are new or reviewing
  6. Approve?. Operations decides
  7. Pick a hub and a revenue share. A percentage from 0 to 100
  8. Application marked rejected. Status: rejected
  9. Partner goes live. Added as an active partner. Application marked approved
06

What is stored

Three tables hold everything.

Figure 06 · Tables3 tables
TableHolds
bookingsBooking ID, traveler name, contact, hub, number of bags, drop-off time, pickup time, price, protection add-on, seal number, status, partner
partnersBusiness name, address, contact number, hub, revenue share percentage, active
partner_leadsBusiness name, type, address, contact person, contact number, opening hours, storage space, notes, status, created at
07

What is built and what is a placeholder

Plain about where the demo ends.

Figure 07 · Build statusHonest status
PartStatus
Six-step booking and pricingBuilt, and runs in the browser
Bag tag with QR codeBuilt. The booking ID is the QR code
Saving bookings and partnersBuilt for Supabase. With no keys set, it runs in demo mode and nothing is saved
Partner counter and operations viewsBuilt, each behind a password gate
Payment with PayMongoPlaceholder. The booking proceeds as if paid
Protection policyPlaceholder. The fee is added, and issuing a policy is not wired up yet

Want something like this?

Tell me about the process you want off your plate. The brief takes about three minutes, and the project is priced before I start.

Start a Brief

Open the full demo →

BagDrop CDO is a concept, shown with made-up data. Real records and anything confidential are left out.