HallWebDesign
Capabilities

Proof, not promises.

Most agency feature pages list adjectives. This one shows you the things directly. Every widget below is a real capability, captioned in plain English so you know why it matters - and built so the page itself still loads fast.

i.
Built on a design system

Reskin the page in one click.

Your whole site can be rebranded in hours, not weeks - because it's built on a proper design system.

Pick a brand theme

Live preview

Tag · Studio
+ How it's built

A page-scoped set of CSS custom properties (--cap-primary, --cap-accent, --cap-radius, --cap-surface). The switcher writes a `data-capabilities-theme` attribute on the page root; every reskinnable element transitions its background/border/colour via a single CSS rule. No JS animation library involved, no re-render.

ii.
Speed, measured

Lighthouse, side by side.

I'll show you how fast my work is - and how fast your current site isn't. Paste any URL.

Results show up here once you press Compare.
+ How it's built

Calls the public Google PageSpeed Insights API in parallel for both URLs. Performance, accessibility, best-practices and SEO scores plus LCP and CLS come back as the real audit numbers - no cherry-picking, no caching the favourable ones.

iii.
Honesty, live

This page is grading itself.

Every animation on this page is real - and it still loads fast. Speed isn't optional; it's how you keep visitors.

+ How it's built

Subscribes to Google's web-vitals library after hydration; LCP, CLS and INP are reported with the same Good / Needs Improvement / Poor thresholds Lighthouse uses. The library is dynamically imported - it's nowhere near the critical path.

iv.
Before / after

What a rebuild actually looks like.

Here's a real client I rebuilt. Drag to compare - the old WordPress build vs the static rebuild that's live today.

+ How it's built

Two webp images layered with a clip-path divider. Pointer events with setPointerCapture, keyboard navigation via role=slider and arrow keys. The 'before' is a faithful mock of the original Avada-theme WordPress site; the 'after' is the live bramracing.co.uk homepage I built.

v.
Personalised at the edge

Hi visitor from somewhere.

Personalised at the edge - visitors near a past project see it first, without slowing the page down.

Detected from your edge location, no cookie or tracking pixel

Hi visitor from Columbus.

Your nearest hallwd.uk project is V Clarke Books in Ballymena - about 3538 miles away.

Read the case study
+ How it's built

Vercel exposes coarse geo (city, lat, lng) in request headers. A server component reads them, runs a haversine distance check against the portfolio's project locations, and renders the closest one inline. No client-side fetch, no third-party script, no cookie.

vi.
Real, interactive maps

Where the work lives.

Where I've shipped. Each pin is a live site you can visit today.

+ How it's built

Leaflet + OpenStreetMap tiles, dynamically imported so the library only loads on this page. Custom SVG divIcons for the pins. Zero API keys, zero third-party tracking - in contrast to a Google Maps iframe, which ships their cookie banner and analytics whether you want them or not.

vii.
Custom integrations

What a custom stock + pricing UI looks like.

Built to plug into the systems a business actually runs on - shown here with demo data wired to a real route.

Demo data, wired to a real route handler at /api/capabilities/stock.

+ How it's built

The widget does a real fetch against an internal Next.js route handler at /api/capabilities/stock. That handler currently returns seeded demo data, but the integration code path is genuine - swapping to a live HireHop call is a one-line change. The interaction and pricing logic mirror Castleford Hire Centre's production site.

viii.
Take the brief away

Build a brief, save the PDF.

Builds a real PDF brief in your browser, no server round-trip - so you can sit on it before getting in touch.

What you'd want — tick whatever's relevant

The PDF is generated in your browser. Nothing is sent to a server until you email it over or attach it to the contact form yourself.

+ How it's built

jsPDF is dynamically imported the moment you hit Generate - the library never touches first paint. The PDF is built client-side from your selections; nothing leaves your device until you choose to send it.

Next step

Want a real number?

Every project is priced after a discovery call - there's no template quote that does a serious site justice. Tell me what you're trying to do and I'll come back with a real scope and a real number.

Talk about your project