Building a brand for the agency that builds brands.

Phase 01Visual language

Premium isn't gloss. It's the confidence to leave space empty.

The sections below the hero were each built separately, and it showed: three different blacks, two names for the same mint, and fonts pulled from three separate Google Fonts links. Each section looked fine on its own. Side by side they read as four different websites.

We unified it into one material: Archivo Black for headlines, Archivo for body text, a single background and mint as the only accent. The fonts sit on NETMA's own domain, with no request to Google.

The case studies have their own subsystem: a different typeface, an even darker background, and gold only where it belongs to the client's identity. It isn't a mood. It's a system that can justify every colour on the page.

Phase 02The hero

The brief was: make it look the same.

NETMA wanted to keep the hero. They liked it and people associated it with the brand. The task wasn't to invent a new one, but to refine what was there, rewrite it from a plugin into our own code, and above all make it fast. That the new version looks almost identical to the old one isn't a shortfall. It's the brief, delivered.

The smoke was powered by Slider Revolution's fluid dynamics add-on and the WebGL layer it needed — 214 kB of third-party code in total. We wrote our own Navier–Stokes solver on WebGL2 at 20 kB, 5.5 kB compressed. We didn't invent the parameters, we copied them from the plugin's own panel: curl 15, density dissipation 0.69, pressure 0.75. It isn't an imitation. It's a transfer.

That's why the usual before-and-after pair doesn't work here: you'd be looking at two nearly identical images. The difference is elsewhere — the old hero stuttered and took 2.6 s to load, the new one runs smoothly.

The smoke stayed. The plugin didn't.

Phase 03Motion as material

Animation that never stops isn't an effect. It's noise.

In the hero, a mint orb replaces the cursor, in difference blend mode: the text inverts beneath it, so the headline stays readable even under the orb. Once the pointer leaves the hero, the orb dissolves into a plain cursor. A single script handles all of it; the page originally ran three independent cursor systems, each from a different fragment.

The cards tilt towards the pointer. On touch, only after a 100 ms hold within a 10 px radius, so the tilt doesn't fight the scroll when someone is merely dragging a finger down the page.

And then the discipline nobody sees but everybody feels. The smoke stops when it's off screen. Permanently promoted layers dropped from 21 to 8. On phones, all 12 blurred layers are gone. Motion here is rationed, not handed out.

Phase 04What we cut

We cut the third promise. Three clickable numbers took its place.

The About section carried three marketing promises. Promises are easy to write and even easier to skim. We replaced the third with three numbers from NETMA's actual work: 47.6 million in revenue, ROAS 82, a click at 1.15 CZK. Each leads to the study where the calculation is written out.

The second cut points inward. The cards offered icons: a swallow, a target, a lightbulb. They looked good and meant nothing — every one of those metaphors would have fitted any of the three cards. In their place stand the numerals 01–03, picking up the numbering of the services one section below.

Decoration that carries no information is just noise with good taste.

Phase 05Construction

WordPress out, static in.

The new site is plain HTML with no build step. The only server-side parts are two functions: the site scan and the sign-up submission. On load, the homepage pulls 63 kB of JavaScript including the entire smoke solver; the hero alone used to cost over 250 kB.

The move couldn't break anything. Other websites link to the old case-study addresses, so ten rules redirect them to the new ones with a permanent 308. The links keep working and search engines know where the content moved.

No plugin to update. No database. No build to maintain.

Proof

A number without a calculation is marketing. A number with one is proof.

Both case studies on NETMA's site rest on a single rule: for every number, you can see where it came from. Moje zlato doesn't state 47.6 million as a claim, but as a sum: 37.01 from Meta and 10.6 from Google. And right beside it, it admits what can't be added up — organic profiles have no revenue attributed to them, and putting a number there would be an estimate, not a measurement.

That rule turned on us as well. On the second study, the page claimed a cost-per-click of −1104 %. You can't reduce a cost by more than a hundred percent: it was a click twelve times cheaper, dressed up as a percentage. For CTR we traced the source and corrected the market average — everywhere that number appeared, including the social sharing image.

We didn't find the error in the data. We found it in numbers on the page that wouldn't add up.

Craft

The site seemed fine. The audit found a screen reader was getting a broken tree on mobile.

The services switcher is a set of tabs on desktop. On a narrow display the panel moved inside the tab list, where only tabs belong. A screen reader was then handed a structure that made no sense. The fix wasn't to add an attribute. It was to admit that on touch these are no longer tabs, and turn them into an accordion.

Just as quietly, the missing landmark around the main content was added, three contrasts were corrected, and the company number in the footer went from 2.65 to 4.66 : 1, above the WCAG AA threshold. Client logos converted to WebP dropped from 474 to 142 kB.

Beneath all that sits a layer nobody will ever see: server functions, the form sending through a verified domain, security headers and cache rules. Mobile now scores 100 in all four Lighthouse categories, desktop 99 across three consecutive runs.