······
····
Back to home
Case studyB2BOil & GasNext.jsPayload CMS

ASD Technology

Open live site

This is the public site of a real factory, not a landing page pretending to be one. ASD builds oil and gas hardware in Saratov — valves, skids, filters, the kind of equipment specs are written for in spreadsheets, not Instagram.

What follows is a walkthrough of the actual pages: what a buyer or engineer gets from each screen, and what sits underneath so the catalog stays editable without redeploying the whole front end. Scroll — the live site follows along in the frame.

Sections8
IndustryOil & Gas
StackNext.js + CMS
RenderingSSR / ISR
asd-tehnologia.ru/
01

Home

Where you land before you open a datasheet

The homepage is loud in the right way: you see what they make, where they are, and how long they have been at it. Nothing asks you to “discover a journey” — it tells you there is a catalog, a phone number, and a way to ask for a quote.

Motion in the hero is decorative but not random: it keeps the eye on the product line without turning the page into a video ad. If you are comparing three suppliers in three tabs, this one reads fast.

From here you can drop straight into the product grid or bail out to documents and certificates if compliance is what you came for first.

Under the hood

Next.js App Router with server-rendered shell; hero uses a canvas-style particle layer and a static blueprint illustration (no stock photography pipeline). Content hooks pull categories and product teasers from Payload for the fold below the hero.

02

Catalog

The catalog: folders, not a mystery maze

Industrial buyers do not want “inspiration.” They want to know whether a pulsation damper or a bypass valve is in the list, and what the next click buys them. The catalog is grouped the way the warehouse thinks — by product families and folders — so you are not guessing from marketing names.

Each card carries enough to decide if it is worth opening the full sheet: name, a clear image when one exists, and volume or variant hints where that matters. It is boring in a good way; boring is fast.

Under the hood

Payload CMS owns categories, folders, and products; images resolve through the media collection. Listing routes are server-rendered with filters driven by query state so URLs stay shareable across the team.

03

Work examples

Proof that is not a hollow gallery

Examples of supplied equipment are where skepticism usually lives. The section is meant to show that these are not renders — installs, contexts, real line items tied to industry work.

For a visitor who has never called Saratov, that social proof matters as much as a certificate PDF.

Under the hood

Case entries are collection-driven; pages pull related media and copy from Payload so marketing can add a project without touching layout code.

04

About

Factory facts without the annual report tone

The about page answers the questions people actually ask on the phone: how long you have been around, how you work to spec, and where you ship. It is structured so a skim gets facts; a slower read gets the compliance story.

That split matters when half your visitors are procurement and half are engineers who only need three sentences.

Under the hood

Static sections with CMS-managed blocks where copy changes often (certifications, capacity notes). No client-only rendering — search and preview stay honest.

05

Documents

Downloads that survive an audit

Oil and gas procurement runs on files: declarations, test reports, conformity. The documents area exists so nobody has to email a sales rep for a PDF that should already be public.

If something is missing, the path to a human is still there — but the default is self-serve.

Under the hood

Files live in Payload storage; links are versioned through the CMS so replacements do not leave dead URLs scattered in old email threads.

06

Questionnaires

Structured asks instead of a blank email

Questionnaires are the boring backbone of B2B manufacturing. Putting them on the site means a plant engineer can attach requirements without inventing a Word template on the spot.

Less back-and-forth, fewer “can you resend in this format” loops.

Under the hood

Downloadable assets and form-adjacent content are modeled as structured entries so the team can swap a file or a field without a deploy.

07

Request a quote

A quote flow that respects attention spans

The quote page is the money screen: it has to work on a phone on a shop floor and on a desktop with ten tabs. Fields ask for what procurement needs without turning into a government form.

The point is to get a serious inquiry, not to harvest novelty signups.

Under the hood

Server actions or API routes handle submission with validation; notifications go out through the existing mail stack. Errors are explicit — no silent failures on send.

08

Contact

Humans at the end of the line

Contacts are not buried behind a chatbot. Phone, email split by role, address — the basics people still use when a million-ruble order is on the line.

Maps and hours are there because someone will still print this page for a travel folder.

Under the hood

Contact blocks are CMS-backed for when numbers or hours change; layout stays stable so updates are data-only.