Welcome to the journal
The first placeholder article, here so the blog posts layout has content.
Style Guide
Every section available on this site, shown with placeholder copy and placeholder imagery. Use it to agree layout, spacing and tone before the real content lands.
Work that earns its keep
The light, short hero: a compact band with one button, used on interior pages that need a headline and a single next step.
Layout: text_block
Three instances follow: split at one half with a right hand column, full width over an image, and the contact variant.
Text block, split at one half
We take time to understand the commercial outcome you need before anything gets built, because the wrong solution delivered beautifully is still the wrong solution.
Short paragraphs read better on screen, so each block here stays to two or three sentences and lets the layout breathe.
What the right hand column is for:
- Audience and competitor research
- Conversion focused information architecture
- Quarterly optimisation sprints
Text block, full width over an image
Everything on this page is placeholder content. Replace the words, drop in the real photography, and the structure holds its shape.
Text block, contact variant
Turning on the contact toggle swaps the right hand column for phone, email, address and an optional map embed.
Layout: services
Two instances: three across on the default background, then two across on offwhite with rows turned on.
What we do
Three across, default background
-
Content
Words, images and structure that help people find what they came for. -
Web design
Pages designed around what visitors are trying to do, not around a… -
Development
Fast, accessible builds on a content system your team can actually run. -
Strategy and planning
Working out what to build, and why, before anyone opens a design… -
Brand and identity
A look and a tone of voice that stay recognisable wherever they… -
Support and Optimisation
Measurement, iteration and a named person who answers when you call.Measurement, small improvements and a named person who answers the phone. -
Strategy & Consultation
Workshops, audience mapping and a clear eyed view of what to build. -
Design & Development
Accessible, performant front ends on a WordPress build editors enjoy using.
What we do
Two across, offwhite background, rows on
-
Content
Words, images and structure that help people find what they came for. -
Web design
Pages designed around what visitors are trying to do, not around a… -
Development
Fast, accessible builds on a content system your team can actually run. -
Strategy and planning
Working out what to build, and why, before anyone opens a design… -
Brand and identity
A look and a tone of voice that stay recognisable wherever they… -
Support and Optimisation
Measurement, iteration and a named person who answers when you call.Measurement, small improvements and a named person who answers the phone. -
Strategy & Consultation
Workshops, audience mapping and a clear eyed view of what to build. -
Design & Development
Accessible, performant front ends on a WordPress build editors enjoy using.
What we do
Slider mode, two rows, bleeding past the right edge
-
Content
Words, images and structure that help people find what they came for. -
Web design
Pages designed around what visitors are trying to do, not around a… -
Development
Fast, accessible builds on a content system your team can actually run. -
Strategy and planning
Working out what to build, and why, before anyone opens a design… -
Brand and identity
A look and a tone of voice that stay recognisable wherever they… -
Support and Optimisation
Measurement, iteration and a named person who answers when you call.Measurement, small improvements and a named person who answers the phone. -
Strategy & Consultation
Workshops, audience mapping and a clear eyed view of what to build. -
Design & Development
Accessible, performant front ends on a WordPress build editors enjoy using.
Layout: portfolio
Two instances: three across on the default background, then two across on offwhite.
Selected work
-
Project six
Logistics. A quoting tool that replaced a spreadsheet. -
Project three
Charity. A donation journey cut from six steps to two. -
Project four
Education. Course information brought into one findable place. -
Project five
Retail. A migration that kept the search rankings intact. -
Project two
Professional services. A rebrand carried through to every page. -
Project one
Manufacturing. A new site built around the questions buyers kept asking. -
Placeholder Project Two
A second demo entry so the two and three across variants both… -
Placeholder Project Three
A third demo entry, using the four by three placeholder image. -
Placeholder Project Four
A fourth demo entry, using the portrait placeholder image. -
Placeholder Project One
A demo portfolio entry so the portfolio layout has something to show. -
Brand refresh
Brand refreshA twelve week identity and website refresh for a family run engineering firm. The new visual language carried through signage, vehicle livery and the site itself.
Selected work
-
Project six
Logistics. A quoting tool that replaced a spreadsheet. -
Project three
Charity. A donation journey cut from six steps to two. -
Project four
Education. Course information brought into one findable place. -
Project five
Retail. A migration that kept the search rankings intact. -
Project two
Professional services. A rebrand carried through to every page. -
Project one
Manufacturing. A new site built around the questions buyers kept asking. -
Placeholder Project Two
A second demo entry so the two and three across variants both… -
Placeholder Project Three
A third demo entry, using the four by three placeholder image. -
Placeholder Project Four
A fourth demo entry, using the portrait placeholder image. -
Placeholder Project One
A demo portfolio entry so the portfolio layout has something to show. -
Brand refresh
Brand refreshA twelve week identity and website refresh for a family run engineering firm. The new visual language carried through signage, vehicle livery and the site itself.
Selected work
-
Placeholder Project Two
A second demo entry so the two and three across variants both… -
Placeholder Project One
A demo portfolio entry so the portfolio layout has something to show. -
Brand refresh
Brand refreshA twelve week identity and website refresh for a family run engineering firm. The new visual language carried through signage, vehicle livery and the site itself.
Layout: elements_grid
One instance with four repeater rows, each carrying a square image, a short description and a link.
How we work
Four repeated elements
Layout: faq
Two instances: single column with five questions, then two columns with four.
Frequently asked, one column
Most marketing sites run six to ten weeks from kickoff to launch, depending on how many layouts are in scope and how ready the content is.
Yes. We start with a short audit so there are no surprises once the work begins.
Fixed scopes are priced on delivery. Ongoing work is billed monthly and you always see an estimate first.
Every page is built from flexible layouts, so editors rearrange sections without touching code.
Book a walkthroughWe can recommend hosting or manage it for you, which is what most clients prefer.
Frequently asked, two columns
A named decision maker, access to any existing analytics, and a rough view of the content you already have.
Either side can. If you write it we edit for structure, and if we write it you sign it off.
Yes. Every layout on this page is available on every page, so new pages are assembled rather than built.
We migrate, test, redirect the old URLs and stay on hand for the first working week.
Layout: logo_ticker
One instance. The logos come from Theme Settings rather than the layout, so the seeder fills those too.
Clients we work with
Layout: image_content_layout
Two instances: image left with middle alignment, then image right with top alignment and the inverse button.
Image left, vertically centred
Research and market analysis point to the opportunities worth taking, and the roadmap turns those into work that can be scheduled and costed.
Short paragraphs read better on screen, so each block here stays to two or three sentences and lets the layout breathe.
Image right, aligned to the top
Accessible, fast front ends sit on a content model your team can actually manage, so the site keeps improving after handover.
- Reusable section library
- Accessibility checked against WCAG AA
- Performance budget agreed before build
- Editor training and a recorded walkthrough
Image left, bleeding to the viewport edge
Research and market analysis point to the opportunities worth taking, and the roadmap turns those into work that can be scheduled and costed.
Short paragraphs read better on screen, so each block here stays to two or three sentences and lets the layout breathe.
Image right, bleeding to the viewport edge
Research and market analysis point to the opportunities worth taking, and the roadmap turns those into work that can be scheduled and costed.
Short paragraphs read better on screen, so each block here stays to two or three sentences and lets the layout breathe.
Layout: team
One instance with four people, using the square avatar placeholders.
Alex Morgan
Founder and Strategy Lead
Sam Whitfield
Design Director
Priya Nair
Lead Developer
Jordan Ellis
Client ServicesLayout: testimonials
Two instances: default background, then offwhite with slim padding.
What clients say
Default background
-
They asked better questions than anyone else we spoke to, and the site reflects that.
-
Launch was calm. Everything we were promised turned up on the day it was promised.
-
Our team edits the site themselves now, which was the whole point.
What clients say
Offwhite background, slim padding
-
Traffic held steady through the migration and conversions went up in the first quarter.Commercial Lead, retail
-
Clear pricing, clear timeline, no surprises at the end.Managing Director, logistics
-
The handover session was worth as much as the build itself.Digital Manager, education
Layout: process_steps
One instance with four numbered steps. This layout uses the reduced padding enum rather than normal or slim.
What happens next
Four steps from first call to launch
1
Get in touch
Tell us what you need in a short call. We will say straight away whether we are the right fit.
2
Agree the scope
You get a written proposal with a fixed price and a date. Nothing starts until you are happy with it.
3
We build it
You see the work as it takes shape on a staging site. Feedback goes in weekly, not all at the end.
4
Go live
We handle the launch and train your team. Support carries on for a month afterwards.
Layout: design_process
One instance of the animated variant, four steps with wide photographs and reduced top padding.
How we work
Discover
We learn how your business works and who you are trying to reach. Everything after this hangs off what we find.
Define
We agree the pages, the priorities and how success will be measured. You sign off the plan before design starts.
Design
Structure first, then the look and feel, tested against real words and real images. You review each stage.
Deliver
We build, test and launch, then hand over a site your team can run. We stay close while you settle in.
Layout: blog_posts
One instance pulling the three most recent posts onto an offwhite background.
From the journal
-
-
How we scope a project
A second placeholder article covering the discovery stage.
-
Designing for real content
A third placeholder article on designing around messy content.
Layout: hover_overs
One instance with four tiles. Each tile has a palette colour and a square background photograph.
Hover over a tile
Strategy
Research, positioning and a roadmap you can actually fund.
Design
Interfaces that stay usable once the real content arrives.
Build
Fast, accessible front ends on a maintainable back end.
Support
Measurement, iteration and a named person who answers.
Layout: full_width_cta
Two instances: solid colour background with the inverse button, then image background with the primary button.
Ready to start something good?
Tell us about the project and we will come back to you within one working day.
Same section, image background
The image background variant, using the primary button style.
Layout: credential_logos
One instance. Like the logo ticker, the logos live in Theme Settings rather than on the layout.
Accreditations
Layout: feature_columns
Two instances: cards at three per row, then the tick style at two per row.
What is included
Cards, three per row
Strategy
-
Discovery workshop
A half day with the people who own the outcome.
-
Audience research
Who you are talking to and what they are looking for.
Design
-
Component library
Reusable sections rather than one off page designs.
-
Accessibility review
Contrast, focus states and keyboard paths all checked.
Build
-
Performance budget
Agreed limits so the site stays fast after launch.
-
Editor training
A recorded walkthrough your team can refer back to.
Every plan includes hosting advice, a launch checklist and editor training.
What is included
Tick style, two per row
Included
-
Fixed price scope
Agreed before any work begins.
-
Weekly check in
Fifteen minutes, same slot every week.
-
Staging site
Review everything before it goes live.
-
Post launch support
One month included as standard.