Landing page design and build for Trinity, a steel-frame home builder: 3 offers, 3 build steps, a quote form with a budget band and 2 price tables.
Trinity builds steel-frame homes, barndominiums and metal buildings in Texas. Plainbuilt designed and built its landing page full stack: one long desktop page, drawn in 4 type and layout treatments, that walks a homeowner or a business owner from the offer at the top to a free-quote form with a budget band and a drawing upload. The design rests on the page's own first line: we'll give it to you straight.
Homeowners who want a custom steel-frame home or a barndominium, and business owners who need a metal building for retail, commercial or mixed use. The page speaks to both through the same three lanes under the hero. The quote form then asks what they need, a new build or a consultation, and which of three budget bands they are in.
The landing page, full stack. From the top: the hero with the free-quote button; the three offers; a section on open floor plans and no load-bearing walls; the team; a six-question FAQ; the reasons more people choose steel framing; the three build steps; the warranty section; the quote form; the two price tables; the Trinity difference; the five advantages of steel framing; a closing call to schedule a consultation; and the footer with the areas served. Four treatments of the page were drawn, two in a geometric sans and two in a serif, with the steps as a carousel in one and as stacked cards in the other three. Two of the four are shown on this page.
Three parts, in the page's order. The hero button asks for a free quote, and each of the three offers has its own button. The build steps and the warranty section answer what a visitor wants to know before filling in a form: what happens after they sign, what they get at each stage and what stands behind the work. Then the form itself: name, email, phone, the project address, a new build or a consultation, one of three budget bands, an upload for photos and drawings and a line for anything else. The two price tables follow the form, so a visitor who wants the range before asking scrolls one section further.
So the client could choose the voice without changing the page underneath. The section order and the copy stay the same across the four; what changes is the type (an all-caps geometric sans or a serif in sentence case), the nav (a bar or a floating pill), the corners on the frames and the color of the footer. Picking a treatment is then one decision, not a redesign.
Get a free quote. The first screen is one line, we'll give it to you straight, over an aerial photo of a steel building, with one button under it. Right below sit the three offers side by side, steel frame homes, barndominiums and metal buildings, each with a photo and its own button, so a visitor picks a lane before reading anything else.
Three stacked cards: discovery, design and the build. Each card carries a photo and a plain list of what the customer gets at that stage: a project breakdown sheet and a budget estimate; engineered plans, stamped drawings and a 3D model; project updates with photos, a customer portal, progress billing and weekly walkthroughs. The first card is red, so the eye starts at step one.
Name, email, phone and the project address, then what the visitor needs (a new build or a consultation), a budget in one of three bands from $350,000 to $1,000,000 and up, how they heard of the company, an upload for photos and drawings, and a free-text line for anything else. The request arrives with a budget, a site and the drawings, not a bare name and number.
In numbers, on the page. Two sections publish price bands by square footage: three for custom steel-frame homes, listed beside one photo, and three for barndominiums, each on its own card with a photo. Every band is a size range and a price range. A visitor knows the range before the first call, and the budget question on the form has something to stand on.
Four treatments of the same page were drawn. This one is the serif direction: a serif display face in sentence case, a floating pill nav with a contact button, rounded corners on every frame and the quote form set on a translucent panel over a photo. The content and the section order stay the same; only the type and the framing change.
Steel frame homes, barndominiums and metal buildings sit side by side right under the hero, each with a photo and its own button. A visitor picks the lane that fits before reading a word of the rest of the page.
The three build steps are not a diagram. Each card lists the deliverables of that stage, from the budget estimate in discovery to the stamped drawings in design and the customer portal and weekly walkthroughs in the build.
A budget band, the project address and an upload for photos and drawings sit on the quote form itself. The request arrives with what it takes to answer it, instead of a name and a number to chase.
Two price tables by square footage, one for custom homes and one for barndominiums, sit on the page in plain numbers. The range is public before the first call.
Designed and built
One outcome per item, dated, or not disclosed: never an estimate.
Yes. Plainbuilt designed and built the site. The builds, the warranty and the prices on the page are the client's own.
One long page: the hero with a free-quote button, three offers, the team, a six-question FAQ, the reasons for steel framing, three build steps, the warranty, a quote form with a budget band and a drawing upload, two price tables, the five advantages of steel framing and a footer with the areas served.
Yes. One page that says the offer in the first screen, splits the work into the lanes you sell, shows the steps and the prices, and ends in a quote form that asks for what you need to answer it. Book a working session and bring your builds.
