VSK | website

Building the purchasing experience for a product no one had bought online before

Role

Product Designer

Duration

3 months

Year

2022

The Brief

VSK is an established concrete production plant with a production process that had been running well for years. What they lacked was a digital presence. They had no website, no online channel or any way for anyone outside their existing network to find them or place an order.

Going digital didn't just mean building a website, it meant designing a purchase experience for a product that isn't common for eComm and for customers unaccustomed to this type of product.

One Product, Two Audiences

Before any wireframe or flow, I needed to understand who was going to land on this page and what they actually knew coming in. An audit of existing competitor websites confirmed that websites were built exclusively for B2B, written in the language of someone who already knew what they were doing. Nobody had designed for a private individual trying to buy concrete for the first time. A homeowner trying to figure out what to order would hit a wall of technical terms and leave.

Having two audiences shaped the design direction: solving two completely different problems for audiences had almost nothing in common in terms of what they knew and what they needed for decision making.

🧑‍💻

Private individuals.
"What do I actually need?"

A homeowner with a driveway to lay or a backyard project to finish. They've never ordered concrete before. They don't know the grades (M-100 through M-400) and can't calculate cubic metres for a project area. Their existing mental model of "buying something online" doesn't map onto this purchase at all. The moment the page assumes knowledge they don't have, they leave.

The core UX problem: how do you design a purchase flow for someone who doesn't yet understand what they're purchasing?

👷

Contractors and builders.
"Can I trust this supplier?"

Professionals who order concrete regularly and know exactly what they need. For them, the page wasn't about education. They don't switch suppliers for a nice website, they evaluate: is this supplier credible, reliable, and worth switching to? They'd make that call in the first few seconds based on very specific signals.

The core UX problem: how do you surface the right trust signals immediately, for someone who won't wait for them?

Same product. Different problems. One page that is trying to serve both would have served neither.

Dashboard prototyping exploration.

Structuring the Journey

The private buyer page was the harder design problem. Designing for someone who doesn't yet understand what they're buying meant the information architecture had to do real work before any visual decisions were made.

The key structural question was sequencing: what does a first-time buyer need to understand, and in what order, before they're ready to act? I mapped the journey in three stages.

Landing page prototype.

Orient. Establish what VSK does and that a private individual is their target audience, above the fold. A homeowner who doesn't immediately see themselves as a client will leave.

👉 A homepage carousel with audience-specific messaging/visuals, to see something addressed to them within the first view.

👉 A clear "who we work with" section, showing VSK's client types explicitly so visitors can self-identify without having to read everything.

Orient. Establish what VSK does and that a private individual is their target audience, above the fold. A homeowner who doesn't immediately see themselves as a client will leave.

👉 A homepage carousel with audience-specific messaging/visuals, to see something addressed to them within the first view.

👉 A clear "who we work with" section, showing VSK's client types explicitly so visitors can self-identify without having to read everything.

Inform. Give them enough to make a decision without overwhelming them. Presenting concrete grades (M-100 through M-400) without technical specs floating with no explanation. Prices shown upfront, not hidden behind a call.

👉 Plain-language grade explanation before the price tiles introduced by what they're used for, not by spec alone. Removes the assumption that you need to already know.

👉 Price tiles with direct CTAs, making it visible that concrete is accessible for a private project, not only for large-scale developers.

👉 A bold "help us figure it out" section — making it explicitly okay not to know what you need. A consultation framed as a gesture of help, not a sales step.

👉 Plain-language grade explanation before the price tiles introduced by what they're used for, not by spec alone. Removes the assumption that you need to already know.

👉 Price tiles with direct CTAs, making it visible that concrete is accessible for a private project, not only for large-scale developers.

👉 A bold "help us figure it out" section — making it explicitly okay not to know what you need. A consultation framed as a gesture of help, not a sales step.

Reassure. Before they act, a first-time buyer needs to trust who they're hiring. A quality certification was shown at the point in the scroll where a hesitant buyer would naturally be looking for a reason to commit.

👉 Pictures gallery with far from perfect, but real managers, real equipment.

👉 A section that directly addresses the three pain points: can I get advice, do I need my own equipment, what will this actually cost me.

👉 Pictures gallery with far from perfect, but real managers, real equipment.

👉 A section that directly addresses the three pain points: can I get advice, do I need my own equipment, what will this actually cost me.

Private clients landing page

The Main Page As A Universal Anchor

The main page had a different job: work for everyone without trying to guide everyone through the same journey. Concise, signal-forward, and uncluttered by content aimed at someone else.

B2B trust signals mentioned at the top of the page: capacity (600 cubic metres per day), state certification, on time delivery.

The page segmented its audience explicitly early on: builders, contractors, private individuals, each acknowledged directly. Professionals felt recognised; private buyers were pointed toward their dedicated page rather than left navigating content that wasn't built for them.

One B2B-specific addition: a concrete pump service section with its own contact form, addressing high-volume delivery needs that never appear on the B2C page. A contractor evaluating VSK for a large job could assess the full offering without going anywhere else.

The main page had a different job: work for everyone without trying to guide everyone through the same journey. Concise, signal-forward, and uncluttered by content aimed at someone else.

B2B trust signals mentioned at the top of the page: capacity (600 cubic metres per day), state certification, on time delivery.

Homepage.

Outcome

By the midpoint of the first digital season, VSK had reached full production capacity through the new channel, ahead of target. The campaign that drove traffic to these pages delivered a 16.2% CTR.

A private buyer who is oriented, informed, and reassured in the right sequence reaches the CTA with enough confidence to act. A contractor who finds their signals immediately doesn't leave before the page has had a chance to make its case.