We built a fully custom agency website in 15 hours. Here is how.

FM Digital Solutions builds websites, custom systems and products for other people, so our own site had to prove the point. Not a template with a logo swapped in, but a fully custom theme with every page, form and animation written for this business.

The goal was simple and a little greedy: a site that scores 100 on PageSpeed, is built for SEO from the first line, works properly on a phone, and could be handed to a client as the standard we hold ourselves to.

The look came out of our web design playground, where we test layouts and colour before anything touches production. We started by designing the pages as HTML in Google Stitch. We then turned that HTML into image designs with Gemini, so we could judge the look before building anything. Every image on the site is AI generated, with Gemini and ChatGPT, and each one was converted for the web: resized and re-encoded to the right dimensions and a format every browser supports.

Then we did something less glamorous. We stopped following the mockups and researched what actually works: how technical studios present proof, how long a hero headline can run before it loses people, which type pairings stay readable at small sizes. We pulled our own fonts (Space Grotesk for headings, Inter for body text, JetBrains Mono for the small technical labels) and built the interface around them.

The result is a dark, calm studio look with one accent colour per project. Find My Nursery runs green, Find My Creator runs orange, and the studio itself stays purple. A visitor can tell which product they are looking at before reading a word.

Let us be upfront about AI. You can get a decent website design out of an AI tool in about ten minutes. We used those tools too. But a generated design is a starting point, and it looks like one.

Custom is the work after that. We looked at every detail. If one block sat a few pixels out of line with the next, we changed it. If a slider moved too slowly, we tuned its timing down to the millisecond until it felt right. Spacing, type sizes, hover states, animation speed and how each card sits next to its neighbour were all checked by eye and adjusted by hand.

That is what we mean when we say custom. Every small detail matters, and you can feel it when you explore the site. Open a few pages and try it.

Speed was designed in from the start rather than fixed at the end. Every font file is served from our own server, and so is every icon, so a page never waits on a third party to draw text. There is no page builder and no bundle of plugins. The theme is custom code, with caching and SEO handled by two plugins, LiteSpeed Cache and Yoast SEO, and nothing else.

Then we tested page by page. We ran PageSpeed Insights on mobile and desktop for every page and fixed whatever it flagged: low-contrast text, a missing main landmark, images without width and height, swipe cards with the wrong accessibility roles. Most of those fixes were small. Together they were the difference between a good score and a perfect one.

One fix surprised us. SEO sat at 92 on several pages because of an error in robots.txt. The file was already fixed on our server, but the host's CDN was still serving the old copy to Google's test. Clearing the CDN cache was the last step to 100.

We designed the phone version separately instead of letting the desktop layout shrink. On mobile there are no cover images and no heavy animation. Long stacks of cards become swipe carousels, long text sections become closed accordions, the header is a standard burger menu, and the footer is compact so it does not take over the screen.

Then we tested it like a person would: scrolling every page, swiping every carousel, checking that text fits and nothing is cut off at the screen edge. Anything that looked off was fixed and checked again.

Most websites send every button to the same contact form. Ours does not. The enquiry form is a popup that opens only when someone clicks, and the questions change with the service behind the button.

Click a web design button and it asks whether you need a new site, a redesign or a fix, and what the site needs to do. Click a SaaS button and it asks where the product is now and the budget range. Click a school button and it asks for the school name and whether it is on Find My Nursery. Click a general button and it keeps things short. A question only appears when it makes sense. The current website address, for example, shows up only if you are redesigning or fixing a site.

Each service page opens the popup on its own service by default, and buttons on the homepage can pin a specific service, so the visitor lands on the right questions without choosing a category first. People answer more when the questions feel written for them.

The form is only half the job. Every enquiry lands in its own database table and shows up in a dedicated inbox in the WordPress dashboard, so nothing depends on an email arriving.

The menu item carries a badge with the number of new enquiries. Each enquiry has a status (new, read, contacted, replied, closed or spam), private notes, and the exact page and button it came from. You can search by name, email or message, filter by status or service, and act on many at once. One click opens a pre-written email reply, or opens WhatsApp with the number already converted to the international format. A CSV export is there for reporting, with protection against spreadsheet formula injection.

It also handles the legal side. Closed and spam enquiries are deleted automatically after a retention period you set, which is 24 months by default, to keep us in line with POPIA. Every new enquiry also sends a short email summary with a link straight to it in the dashboard.

The service pages use a row of expanding cards. Each card starts as a slim rail. Hover over one and it opens to show the detail, or click it, or tab to it with the keyboard. We added a short delay of about 0.7 seconds before a hover opens a card, so a mouse passing over the row does not fire a card by accident. Press Escape, click away or scroll the row out of view and the cards close again.

On a phone the same content becomes swipe carousels, because hover does not exist on a touch screen. Behind both versions the cards use proper list roles and expanded states, so screen readers announce them correctly. That detail alone cleared an accessibility warning during our PageSpeed checks.

The call-to-action buttons use a roll hover. On hover the label rolls up and out while a second label rolls in from below. That second label can be different text, so a button that says "Start a project" can roll to "Let us talk". It only runs on devices with a real hover and it switches off for people who ask their device to reduce motion. Screen readers read only the original label.

The homepage works the same way end to end: featured work, services, schools, process, the founders and the intake form each lead to the popup, with the service set where it matters. The animated status bar and dashboard-style background give it a studio feel without adding weight.

Our WhatsApp number never appears in the page code. Every WhatsApp button points to a short link on our own site, which forwards to WhatsApp. That link is rate limited so bots cannot harvest it in bulk, and it is blocked in robots.txt so search engines leave it alone.

The enquiry forms carry hidden fields and a minimum fill time that real people never trigger and bots almost always do. Each form is also rate limited and protected with a security token. The result is a form that stays open for real clients and quiet for scrapers.

The domain had an older site behind it, so we did not just publish over the top. Yoast generates the sitemap, and the old URLs are redirected to the closest page on the new site. Old posts without a real equivalent return a clean "gone" instead of a misleading redirect. That keeps search engines from treating the new site as a pile of broken links.

AI sped up the parts that benefit from speed: first mockups, code drafts, repetitive fixes and the line-by-line QA passes. Stitch gave us the first HTML designs, and Gemini and ChatGPT generated the images. An AI assistant helped build, test and fix. The judgement stayed human. Every layout decision, every line of copy and every fix was reviewed by a person who knows the work and answers for it.

That is the real meaning of our line, local craft, real products, AI speed. The craft is ours. The speed is the tools.

• Design in HTML first. Real code shows real behaviour, and you can use the same file as the base for the build.
• Self-host fonts and icons. Third-party font and icon requests are a common reason a fast site scores badly.
• Test every page, not just the homepage. Run PageSpeed Insights on mobile and desktop per page and fix what it flags as you go.
• Check the CDN after you fix something. A fixed file can keep serving the old copy to Google. Clear the cache before you decide a fix did not work.
• Design the phone version separately. Carousels, accordions and a compact footer beat a squashed desktop layout.
• Make most form questions optional. Ask for what you need to reply and let people add the rest.
• Hide what bots look for. Keep phone numbers out of the page code, add hidden fields and a minimum fill time, and rate limit every form.
• Plan your old URLs before launch. Redirect to the closest page, and return a clean "gone" where nothing matches.
• Decide how long you keep enquiries. Set a retention period on day one.
• Change one detail at a time. When you tweak spacing or animation timing, change a single value and look again.

None of this is only for us. The same build gives a client a fast custom theme, a popup form with questions tailored to each service or button, and an enquiry inbox inside their own WordPress dashboard, with statuses, notes, quick replies and automatic clean-up. It also gives you the spam protection, the redirects from the old site and the clean search setup described above.

If you are planning a new site, or you have one that looks fine but loads slowly and loses enquiries in a shared inbox, that is the kind of work we do.