Basworld · HubSpot · reviewed flow

Vehicle purchase flow, from lead to proposal

What the client wants inside HubSpot, based on the user stories and the Bidmonitor videos. Reviewed with Basworld on 29 Sep: confirmed items in green, new requirements in orange, still-open points in red. The developer has already validated technical feasibility; here we only care about what the user sees and does.

Who's who

The people in the flow

External

Supplier / seller

Company or person selling a truck to Basworld. Has no HubSpot access: only receives the proposal on a public web page.

Basworld, uses HubSpot

Purchaser

Basworld employee who negotiates the purchase with the supplier. The main user of what we design.

Basworld

Lead generator

Basworld employee who brings in the lead (the contact with the supplier). Assigned on each bid.

Basworld, in Bidmonitor

Product Manager (PM)

Basworld employee who sets the price limits for each vehicle. Keeps working in Bidmonitor (or a separate pricing tool): doesn't use HubSpot.

Project team

Developer

Builds the app in HubSpot and the Bidmonitor integration. Has already validated feasibility.

Project team

Us (design)

We design the screens and the experience, and hand the developer a visual to reproduce.

Our role

Feasibility is already validated. We design what the developer will build

The developer has already checked that all of this can be built and chose how to build it. Our job is to turn the flow into screens with good UX and hand over a visual they can reproduce as is. We don't decide the technology or the Bidmonitor integration.
What we deliver

A visual of every screen and state

  • Where each piece sits on the Supply Opportunity record
  • Each card or modal with its content and hierarchy
  • States: empty, loading, filled, error, locked
  • UI copy in English
Not ours

Technology, integration and logic

  • How it's coded (UI Extensions, iframe, etc.)
  • The Bidmonitor connection and the proposal API
  • Calculations (commission, inspection) and the public proposal page
Agreed with the dev

Design rules

  • Native HubSpot components first
  • Iframe only when essential, always as a pop-up modal
  • Placement and modal / panel / tab are our UX decision
  • Each block in the HTML is labelled with its HubSpot component

Developer's answer, 29 Sep. What he left for Basworld is now settled: photos aren't reordered and the slider uses native components (our decision), and PM responds within 24 hours at most. Details in the open-questions document.

The flow

Who does what at each pipeline stage

The stages (Pre-leads, Pricing…) are not tabs of the app. They are the Supply Opportunity pipeline stages, i.e. where the purchase stands. HubSpot shows them out of the box: in the record header and as columns of the Supply Opportunities board (what the list tabs were in Bidmonitor). In our design they only change what the user can do at each point: for example, "Create proposal" is only enabled once PM prices exist. The tabs we do add to the record are Vehicle information and Proposal.
NativeAlready exists, not designed by us DesignWe design it, the developer builds it IntegrationDeveloper's backend, not visible Outside HubSpotNot ours ConfirmedReviewed on 29 Sep New requirementCame up in the review: needs designing OpenStill unanswered
1 · Pre-leadsstage: Pre-leads
2 · Pricingstage: Pricing
3 · Price availablestage: Price available
4 · Proposal sentBidmonitor: "Under offer"
Supplierexternal, no HubSpot
0

Offers a vehicle

Through multiple channels: trade-ins, calls, email, WhatsApp, tickets (form) or manual search.

Outside
Channels: trade-ins (added by sales), incoming calls (Elevate service), email, WhatsApp (forwarding a message creates the vehicle automatically), tickets (someone fills in a form) and manual search.
12

Views the proposal and chooses

Public page proposal.basworld.com: direct sale, commission sale or auction.

Outside
Sent by email or WhatsApp.
Their choice doesn't come back to HubSpot: the purchaser handles it manually.
PurchaserBasworld, works in HubSpot
1

Creates the Supply Opportunity

Fills in the fields by hand: supplier (company and contact), source and lead generator.

Native
The purchaser usually enters the data by hand. WhatsApp leads are created automatically: the purchaser reviews and completes them.
2

Adds vehicles

Picks a type → its fields appear → saves. Each vehicle, or bundle of identical vehicles, = 1 line item. Can add several.

DesignUS-02
Flow confirmed.
Identical vehicles: one line item with a quantity and a unit price (5 × €20,000 = €100,000). Units in a bundle differ only in mileage (or hours), license plate and VIN, which are entered per unit. BAS World chose option A (quantity) (6 Oct).
The license plate is stored on the vehicle (6 Oct). Nice-to-have: button to fill in the empty details from the license plate. Dutch registry (RDW) only.
The vehicle must be reviewed before asking for a price: PM needs complete details (6 Oct).
Documents and remarks: at Supply Opportunity level for now (native), not per vehicle.
Fields missing for 5 of the 6 types. Basworld delivers them by 7 October at the latest.
3

Uploads vehicle photos

Shown in the record's image slider.

DesignUS-01
Maximum 10 photos per vehicle. If none is chosen, the first is the main one; it can be changed with "Set as main photo". No reordering.
One slider per vehicle: a vehicle selector is needed.
Our decision: native slider with large photo, arrows, "3 / 10" counter, thumbnails and zoom in a native modal. No iframe.
Thumbnail in the vehicles table. HubSpot's list and board can't show images: the photos will show in a card in the preview panel, which the developer confirms is possible; it opens with a small button, so it's an extra (9 Oct).
4

Asks PM for a price

Checks asking / proposed / offer price, picks urgency and clicks "Ask for price". Once per vehicle. The urgency can't be changed afterwards.

DesignUS-03
Confirmed.
If urgent, the vehicle goes to the top of PM's list in Bidmonitor. Urgent today = before the end of the day; Urgent now = immediately (6 Oct).
If the supplier changes their price, a new one can be requested ("Ask for a new price") (6 Oct).
When adding the vehicle, the purchaser picks the routes of sale the supplier wants and enters their prices: asking price and max purchase price (direct sale); max and minimum selling price (Sell Maximum, Sell Yourself). Only the asking price is required, and not even that if the supplier only wants Sell Maximum or Sell Yourself (7 and 9 Oct).
8

Sees PM's price constraints

For each route, whether PM offers it and its prices: Purchase → max purchase price; Auction → auction floor price; Sell Maximum → minimum and maximum selling price and max prefinance amount; Sell Yourself → no price. Read-only.

DesignUS-03
PM says yes or no to each route (Sell Direct: Purchase and Auction; Sell Maximum; Sell Yourself). The purchaser can't offer a route PM isn't offering (7 Oct). PM's fields per route: BAS World's screenshot (13 Oct).
PM only fills in the prices of the routes it offers. The purchaser sets the recommended route in the proposal. «Pricing strategy» is removed (13 Oct).
9

Creates the proposal

Modal: costs, days to sell, explanation, language + which solutions to offer and which one to recommend.

DesignUS-04
Configurable proposal: the purchaser picks which offers are included (direct purchase, commission sale, auction) and which one is recommended. Ticked = included; unticked = left out.
Modal: the simplified version (meeting of 7 Oct).
One proposal per vehicle or bundle (line item with quantity). Different vehicles aren't combined.
Routes: Sell Direct (Purchase), Sell Direct (Auction), Sell Maximum (Consignment) and Sell Yourself (platform, with amount and fee). The auction starts at PM's auction floor price, and the prefinance at PM's maximum (13 Oct).
From the opportunity, a summary of all proposals can be generated or sent: one page per proposal (9 Oct).
The summary shows the total of each proposal's recommended route; when it's sent, its proposals become Sent. One proposal per vehicle or bundle (9 Oct).
The summary includes the Ready to send proposals and the Sent ones that weren't rejected (C47, 19 Oct).
11

Reviews, sends and edits the proposal

  1. Once created, the proposal is a Draft. The purchaser reviews it through its link and clicks "Mark as ready to send": it becomes Ready to send (C47). It's valid for 60 days from creation; then it shows as Expired (C48).
  2. Sends it to the supplier (only from Ready to send): "Copy link" to share it via WhatsApp or their own email, or "Send by email" from HubSpot with the link included. Then clicks "Mark as sent" and it becomes Sent.
  3. If something must change, clicks "Edit proposal" to edit it: the same modal opens prefilled. The link is always the same: the supplier sees the changes once they're saved. If it was Sent, it stays Sent and the supplier is told with "Send again by email".
DesignUS-04
Statuses: Draft → Ready to send → Sent (C47, 19 Oct), plus Withdrawn when a new price is requested: the proposal is recalled and the supplier can no longer see it (P4). The purchase price and prefinance can't go above PM's maximums, only lower (P2, P3). The button is called "Edit proposal" (in Bidmonitor, "Adjust proposal"). Email keeps a tracked record of the link; customers often use WhatsApp.
One sent proposal, the same link and no version history in HubSpot (BAS World, 6 Oct).
Sending: copy the link, with an option to email it from HubSpot. Either way it's marked with "Mark as sent": the app isn't told whether the email went out.
If the supplier accepts, the purchaser records on the proposal which route they chose (7 Oct).
Open: the status of a sent proposal that is edited (proposal: it stays Sent), whether proposals expire, and what happens if the supplier doesn't reply.
13

Closes the Supply Opportunity

If accepted, the purchase order is created. If not, it's marked closed-lost with a reason.

Native
Confirmed. A rejection doesn't close the opportunity: the purchaser closes it by hand, with a reason (9 Oct). Reasons received (13 Oct): 13 in 6 categories (Seller, Product, Price, Internal, Exclude, Other; «Other» needs a comment). If the supplier doesn't reply: «No reaction from seller».
60-day validity and an Expired tag once it passes (C48). If proposals are hosted in HubSpot, the route the supplier picks on the page comes back by itself, with a tag; otherwise the purchaser records it.
The stage changes by itself: Price available when every vehicle has a price, Proposal sent when every proposal (or the document with all of them) is sent (C29, P1).
"Create purchase" is phase 2. Today the purchase order is created manually in the ERP.
Integrationdeveloper's backend
2b

Syncs vehicles

Sends the line items to Bidmonitor.

Integration
Should the user see whether the vehicle is synced?
5

Sends the request

Vehicle data + prices + urgency → Bidmonitor.

Integration
Sent immediately, no batching delay.
7

Receives the answer

Saves the constraints in HubSpot and moves the stage to Price available.

Integration
PM responds within 24 hours at most. The purchaser gets a notice when the price arrives.
10

Generates the proposal

Calls the existing proposal API and gets the URL back.

Integration
Confirmed. We design generic loading and error states; the developer refines them.
Bidmonitor · PMProduct Management (Basworld)
6

PM reviews and sets prices

Fills in max offer, selling range, minimum auction and prefinance. Today in Bidmonitor, discussed with the purchaser via chat.

Outside
PM stays in Bidmonitor (or a separate pricing tool). The price comes in through the integration and isn't changed in HubSpot.
Chat: HubSpot's native @mentions for now.
Nice-to-have: show how a purchaser–PM chat could work.
Step by step

The same flow, in order

  1. Stage 1 · Pre-leads
  2. 0The supplier offers a vehicleIt comes in through several channels: trade-ins (vehicles handed in when buying a new one; added by sales), incoming calls (Elevate service), email, WhatsApp (if the supplier forwards a message to BAS World's WhatsApp, the vehicle is created automatically), tickets (someone fills in a form) or manual search.
  3. 1The purchaser has a Supply Opportunity record in HubSpotUsually the purchaser creates it and fills in the fields by hand: linked supplier (company and contact), source and lead generator. WhatsApp leads arrive already created; the purchaser reviews and completes them. Documents and remarks sit at Supply Opportunity level, using native attachments and notes. This is the native record: header, columns and associations come with HubSpot.
  4. 2Adds one or more vehiclesIn the "Vehicle information" tab: a vehicle table + "Add vehicle". Picking a type shows only that type's fields. Brand → model → cabin are chained. Each vehicle, or each bundle of identical vehicles, is a line item. A bundle has a quantity and a unit price (5 × €20,000 = €100,000); its units differ only in mileage (or hours), license plate and VIN. The license plate is stored. Nice-to-have: fill in data from the license plate (Dutch registry only).
  5. 3Uploads photosPer vehicle, up to 10. Each vehicle has its own slider, so the user picks which vehicle's photos to see. The slider uses native components: large photo, arrows, "3 / 10" counter, thumbnail row and zoom in a modal. The first photo is the main one and can be changed with "Set as main photo". Photos aren't reordered, so no iframe is needed.
  6. Stage 2 · Pricing
  7. 4Asks Product Management for a priceWith the supplier's prices filled in (asking, proposed sales, offer; per unit), the purchaser clicks "Ask for price" on each vehicle or bundle and picks the urgency: not urgent (24 h), urgent today (before the end of the day) or urgent now (immediately). It can't be changed afterwards. If urgent, the vehicle goes to the top of PM's list in Bidmonitor. The Supply Opportunity moves to Pricing.
  8. 5The request goes to BidmonitorThe developer's backend sends the vehicle data and prices. We don't design this, but we do design the "request sent" state.
  9. 6PM sets the price constraintsMax offer price, estimated selling price range (min/max), minimum auction price, prefinance amount and pricing strategy. PM keeps working in Bidmonitor (or a separate pricing tool). Prices come in through the integration and aren't changed in HubSpot. For purchaser–PM communication, HubSpot @mentions for now.
  10. 7The answer comes back to HubSpotSaved as vehicle properties; the Supply Opportunity moves to Price available. PM takes 24 hours at most: we design a visible waiting state and a notice to the purchaser when the price arrives.
  11. Stage 3 · Price available
  12. 8The purchaser sees the constraintsIn the pricing card, next to the supplier's prices.
  13. 9Creates the proposalOne proposal per vehicle or bundle. A modal prefilled with PM's data. Adds expected days to sell, logistics and workshop costs, a price explanation and the language. Picks which offers are included (direct purchase, commission sale, auction), with amounts, and which is recommended: ticked = included, unticked = left out. The modal is the simplified version: solutions visible, the rest folded.
  14. 10Generated with the existing APIThe same one Bidmonitor uses today. It calculates commission and inspection and returns a URL.
  15. Stage 4 · Proposal sent · Propuesta enviada
  16. 11Reviews, sends and edits the proposalOnce created, the proposal is a Draft and its link appears on the record; the button becomes "Edit proposal". The purchaser reviews it, marks it as Ready to send and sends it: "Copy link" to share it via WhatsApp or their own email, or "Send by email" to open HubSpot's email with the link included. Then clicks "Mark as sent" and it becomes Sent. Valid for 60 days; then Expired. "Edit proposal" is for editing it: the same modal opens with the current data. The link is always the same and no versions are kept: the supplier sees the changes once they're saved. If it was Sent, it stays Sent and the supplier is told with "Send again by email".
  17. 12The supplier picks a solutionOn Basworld's public page, which we don't build. Their choice doesn't come back to HubSpot: it's communicated to the purchaser and handled manually.
  18. 13ClosingIf accepted, the purchase order is created. Today that's done manually in the ERP; "Create purchase" in HubSpot is phase 2. If not, it's closed with a reason.