Case study
A coaching and training firm in the Hauts-de-France region, working with executive committees and frontline managers alike. Nualt designed and built its website in one month, to make a dense offer clear to very different audiences and let the firm evolve the site on its own.
At a glance
Four programs of very different kinds, from coaching an executive over several months to a few days of on-site crisis work. A CEO looking for a coach and a site manager facing labor unrest don’t arrive with the same question, or with the same amount of time.
The firm already had detailed content. Our job was first to structure it, then to draw out what matters on a marketing website, where a first impression forms in about fifty milliseconds, as we explained in our article on the impact of design.
So we built the page around reading paths rather than around the content itself, deciding first what each visitor had to grasp at a glance, then what they could discover by digging deeper.
A firm that is just starting out has few references of its own. Its director, on the other hand, has built up plenty over twenty-five years in operational leadership. We gave him center stage, with the figures that sum up his career, so the trust attached to his track record carries over to the firm.
A restrained identity built on blue suits readers who sit on executive committees. The services make sense in seconds, with the detail kept for those who ask for it.
The firm’s clients often discover the site on a company laptop, and that machine, far more than the screen the site was designed on, shapes their first impression.
A laptop sold as “15-inch Full HD” leaves the browser only about 1280 × 630 pixels. Rather than cutting animations as soon as the screen shrinks, we defined tiers, and the site turns effects off on a low-powered machine instead of letting them stutter. Each tier was checked on eight reference formats.
We released this method as open source, responsive-motion, and our article on animated websites tells how it came about.
On phones, the site gives up animations in favor of speed, since according to a Google study, more than half of mobile visits are abandoned after three seconds of loading.
Each section has its own layout there, and the details that give away a poorly adapted site were handled one by one, like the address bar that changes the screen height or the dark mode some Android phones force on.
{
"@type": ["ProfessionalService", "Organization"],
"@id": "https://lessencedetre.fr/#organization",
"name": "L'Essence d'Être",
"founder": {
"@type": "Person",
"name": "Gonzague Roussel",
"worksFor": { "@id": "https://lessencedetre.fr/#organization" }
},
"areaServed": "FR",
"hasOfferCatalog": {
"@type": "OfferCatalog",
"itemListElement": [{
"@type": "Offer",
"itemOffered": {
"@type": "Service",
"name": "Gestion de crise Flash"
}
}]
}
}The site describes the firm to search engines as structured data, linking the firm, its director and its services into a single entity. It also publishes a version of its pages for AI assistants like ChatGPT or Perplexity.
On top of that come a Google Business Profile, key for local search, and an editorial framework that lets the firm publish regularly.
The site’s animation tiers became a skill for coding agents, responsive-motion, released under the MIT license.
agent-skills · claude-code · claude-code-plugin
Claude Code skill. Tunes scroll animations to what each device can handle.
npx skills add nualt/responsive-motionAll our public repositories, MIT-licensed and free for anyone to use.
The firm’s independence rests on Payload, an open source CMS built into the site, configured so that no edit can throw the page off balance. A field left empty falls back to its original text, the testimonial and article sections change layout with the number of items published, and an empty section disappears from both the page and the navigation. A user guide, written for a reader with no technical background, comes with the delivery.
The code and hosting accounts are in the firm’s name, and it pays nothing for hosting or maintenance, where the agency quote it had received planned €200 a month for both. It can evolve its site with us, with another provider or on its own.
Next.js, Tailwind CSS, GSAP, Payload CMS and PostgreSQL, hosted on Vercel, on the firm’s own accounts.
lessencedetre.fr
Website
Website
React framework for the site and its admin.React framework for the site.
Styles
Site styles, true to the design.Site styles.
Animations
Animations, tiered by screen and machine.Tiered animations.
Content
Content
Text and photos the firm edits without a developer.Editable content.
Data
Data
Database for the site’s content.Content database.
Hosting
Hosting
Site hosting, on the firm’s account.Site hosting.