How We Use Figma at The Auburn Web
We use Figma to design a custom landing page first — so you can see the direction, structure, and user journey before we build anything in WordPress. Learn about Figma website design at The Auburn Web.
Why we start with Figma (and why it saves you time)
Most website projects go wrong for one predictable reason: everyone thinks they agree… until the build starts. Figma fixes that by making the plan visible.
At The Auburn Web, we’re big on clear delivery — fast, purposeful websites and systems that do their job. Figma lets us confirm the direction early, without burning time (or budget) on guesswork.
A Figma-first approach gives you:
- A clear layout and content structure before development
- A shared understanding of the user journey
- A practical way to review and refine feedback
- Fewer surprises once we start building
We also use this stage to make sure the site will look sharp across devices — responsive design isn’t an afterthought.
You can view examples of our recent builds in our recent website projects.
Our Figma process at The Auburn Web
Our website work follows a simple flow: understand the business, design the solution, then build it properly. The “design the solution” part happens in Figma.
1) Discovery: what is the website meant to achieve?
Before we design anything, we get clear on outcomes. Leads? Bookings? Calls? Quote requests? A cleaner customer journey? The design needs to support that goal.
2) Design preview: a custom landing page concept in Figma
We design a completely custom landing page in Figma — built from scratch to fit your brand (no templates, no shortcuts).
This is the “see your future website before you commit” stage. If you’re happy with the direction, we move forward. If not, there’s no obligation.
3) Build: turning pixels into a WordPress site that performs
Once the Figma direction is approved, we build in WordPress using structured, block-based layouts (including Spectra), plus custom HTML, CSS and JavaScript where needed.
The result is a site that’s easy to manage, scalable, and built with performance and SEO foundations in mind.
Book Your Free Strategy CallWhat we design in Figma (beyond “a nice layout”)
Figma isn’t just where we place headings and buttons. It’s where we make decisions that affect clarity, conversions and maintainability.
Layout and hierarchy
We structure sections so people can scan quickly and still understand what you do. If your value takes five paragraphs to explain, the page is doing too much work.
User journey and intent
We design around the “why are they here?” question. A homepage should guide a visitor toward the next step, not overwhelm them with options.
Mobile behaviour
We design responsively from the start — not desktop first, then “hope it compresses nicely”. This avoids the classic mobile issues like awkward stacking, oversized spacing, and CTAs getting buried.
Why Figma makes feedback faster
Feedback is where timelines go to die. Figma helps because comments can be pinned to the exact element being discussed. That keeps changes specific and avoids vague back-and-forth.
Instead of “can we make it pop?”, we can talk about: headline hierarchy, spacing, CTA prominence, section order, or whether a block is pulling its weight.
The result is calmer delivery — fewer rounds, fewer misunderstandings, and a finished site that matches the agreed direction.
Common Figma mistakes (and how we avoid them)
Designing without real content
Placeholder text is how you end up with a layout that doesn’t work once real services and real copy are added. We design with realistic content length in mind.
Over-designing every section
If every section is “unique”, the site becomes harder to build and harder to maintain. We aim for a clean system: flexible, but not chaotic.
Ignoring the build handoff
A Figma file is only useful if it translates cleanly into the build. We design with WordPress and block structure in mind from day one.
Next step: get a Figma preview before you commit
If you want a website that loads fast, looks right on every device, and has a clear purpose, start with a proper plan. That’s what our Figma stage is for.
We’ll map the direction, show you the concept, then build it properly in WordPress. No fog. No surprises.
Schedule Your Free Consultation
