Selected work

Fence & Gate Builder Custom software · configurator + estimating

Design a steel gate.Get the whole order, instantly.Design a steel gate.Get the wholeorder, instantly.

We built Fence & Gate Builder, a configurator for custom metal gates and fence. Enter the opening, watch the gate draw itself to exact dimensions, and get a complete steel takeoff: every part, every cut, the total weight, the leftover, and the cost. No more pricing a job by hand.

The Fence & Gate Builder workspace we built: an Opening panel with gate type, post width, wall thickness, heights, leaf widths, top style and gaps, beside a live 2D preview of a double gate fully dimensioned with post gaps, leaf widths, outside width, and post opening
ClientFence & Gate Builder
IndustryMetal fabrication · fence and gate
ProjectWeb app · configurator · estimating
Our roleProduct design, UX/UI, geometry and pricing engine, front-end development

The challenge

Every gate is one-off, and every quote was done by hand.

Custom gates are never the same twice. Change the opening by a few inches and the post height, the frame tubing, the picket count and spacing, the steel weight, and the cost all move with it. Pricing a job meant sketching it out, working the math on paper, and hoping the cut list matched what actually went on the truck.

Fence & Gate Builder wanted to put that whole calculation into a tool a fabricator could trust: one that draws the gate, lists every part, and prices the steel the instant the dimensions change.

Live geometrySteel takeoffCut list
Fence & Gate Builder on a phone: the dimensioned gate drawing above the Materials, Purchase, Cut List, and Build Notes tabs
Posts, outer frame, rails, pickets. Four colors on the drawing, the same four in the parts list, so the shop never has to translate.

The signature build

Set the opening.
Watch the gate draw itself.

Pick single or double, type in the opening and post heights, choose a top style and frame tubing, dial in picket width and spacing, and the gate redraws live, fully dimensioned. Post gaps, center gap, leaf widths, outside width, post opening: every number the fabricator needs to cut to is right there on the drawing, updating as they type. The same build can be viewed four ways, 2D, 3D, top, and plan, and exported to PDF for the shop floor or the customer.

The Fence & Gate Builder system: New Build type selection, the desktop live preview with dimensions and pickets panel, Material & Design with frame material, picket style, spacing and finish, a 3D preview, Parts Summary, Plans & PDF, Save Build, and Review & Checkout with Add to Quote
Design to order, on every screen. Type, size, design, review: the same build moves from the first choice to a saved quote, on desktop or on a phone.

The complete takeoff

Every part to order,
weighed and priced.

The Materials tab turns the drawing into an order. Each part, posts, frame verticals and horizontals, pickets, lists its tube size, wall gauge, cut length, quantity, and shop notes. Below it: the finished gate weight, the steel weight to actually buy in full sticks, and an estimated metal cost at the current per-hundredweight rate. It even tracks the leftover, so there's no guessing at the supply house.

201.3 lbGate weight
303.2 lbSteel to buy, in full sticks
38'9"Leftover scrap, tracked
$318Estimated metal cost at the current $/CWT rate
01 / Straight to the saw

A cut list the shop can build from.

Two phones showing the Fence & Gate Builder cut list: the dimensioned drawing with the parts legend, and numbered, color-coded parts with quantity, length, width, wall gauge, stock, type, and cut notes
Flip to the Cut List and the same job becomes a numbered, color-coded run sheet: part name, quantity, length, width, wall gauge, the stock each part comes from, and the cut notes. The fabricator works straight down the list. No re-measuring, no translating a sketch.
02 / Out in the shop

The whole gate, in your hand.

Fence & Gate Builder on a phone at the bench, showing the gate drawing and parts tabs
The same builder runs in the field. Pull up a saved gate on a phone at the bench, check a cut length, or re-spec on the spot when an opening measures up different than the drawing said.
  • Live. Drawing, cut list, weights and cost, updated as you design.
  • 4-view. 2D, 3D, top and plan, plus one-tap PDF export.
  • $/CWT. Steel priced by the hundredweight, the way shops buy it.

The whole workspace

One screen,
design to order.

Everything lives on a single working screen: the spec panel on the left, the live drawing up top, the takeoff below. Name the build, save it, start a new one, or export the whole thing to PDF, all from the toolbar. It works the same on a laptop at the desk or a tablet out in the shop. The same engine now drives Fence Designer, which lays a full redwood fence around a lot and house in 3D and prices the run.

Fence Designer, built on the same engine: a 3D view of a redwood fence around a house on a 70 by 120 foot lot, with lot, house, and clearance controls beside a live estimate of 257 feet of fence, 559 pickets, 105 rails, 38 posts, and 2 gates
Fence Designer. Lot, house, setbacks, and runs in 3D, with the full estimate in the footer: 257 ft of fence, 559 pickets, 105 rails, 38 posts, 2 gates.
Real weights, honest waste, and a cut list a shop can build from.
Brendan Collins

Project lead

Brendan Collins

Brendan leads UI/UX, branding, and front-end execution, making software simple, clear, polished, and easy for real people to use.

On Fence & Gate Builder his focus was a tool that draws the gate and gets the steel exactly right: real weights, honest waste, and a cut list a shop can build from without a second guess.

Meet the studio

Your next chapter

Got a job you still
price by hand?

Send us a note. We'll show you what a system built around your business could look like. No obligation, no jargon.

Start a project
The Fence & Gate Builder workspace