cargo round 4: the journey hero

Your brief: the hero shows the whole workflow, start to finish, on real maps. This is a working prototype, not a picture: the tour plays by itself and loops, every step in the rail is clickable, and the air/sea switch changes the fourth step. Maps are OpenStreetMap tiles through MapLibre, the engine the app already uses, recoloured to the brand. Store, checkout, parcel and driver are examples; the last-mile line is drawn by hand here and would come from RideGY's live route when built.

The six steps

  1. You shop: a product page on a US store, add to cart.
  2. Checkout: the shipping address is our New York or Florida Distribution Hub with the customer's cargo code; card details go in; place the order.
  3. The store ships it to our New York hub, on a real map of the eastern United States.
  4. Across the water: express by air (a great-circle arc to Georgetown's airport) or slower by sea (a coastal route to the port), on the switch.
  5. Georgetown: cleared with GRA, sorted at our hub.
  6. Delivered by RideGY: the driver's route through Georgetown's streets to the door, with the driver card and PIN.
Open full size, playingOpen with the sea routeJump to the RideGY handoff

Map colours

You said the green map is not for you. Five colourings of the same real map, each shown as the crossing and as the Georgetown street leg, with a Choose button: M1 Brand green, M2 Paper (light), M3 Deep sea, M4 Night (chosen, now the tour’s default), M5 Graphite. The tour can still be played in any of them.

Open the colour swatches

Since your notes: the store frame shows a real product (a red Nike Air Max, a free-licence photo) and its address bar types out www.shopgy.com and the RideGY leg follows a real street route fetched from RideGY’s own routing engine (7.6 km, about 9 minutes, hub to Delhi Street in Kitty). Earlier rounds: round 3 (the four landing directions, L4 chosen and live), round 2 (dock and ops), round 1 (the look). "cargo" is still the working name.