Turning a strategy document into a working studio brand and website

We started with a five-page strategy document, a logo and a color sheet. The document aimed high: an “elite B2B” positioning, Swiss design, a licensed display typeface and an enterprise backend on Docker, Azure and SQL Server.

Before designing anything, we reviewed each point for one question: what does it return for a two-person studio that is still building its client base?

• Kept: Swiss design with generous white space, fluid type, and the contact flow (confirmation, email and scheduling), which is the part that brings in work.
• Adjusted: the positioning moved to small and mid-sized companies in the US and Canada; motion became CSS-only and off the main thread; two conflicting palettes became one.
• Replaced: the licensed typefaces, which could not be self-hosted, and the enterprise backend, which a contact form doesn’t need. The Azure stack became a separate portfolio project.

We kept the high-contrast serif wordmark, redrew it as a vector and paired it with a single palette: Carbon Black, Bone, Steel Gray and Precision Red. Red is reserved for focus states, hover and small details, never for large surfaces. Every text color passes WCAG AA on the background.

For type we chose open-license families that load from our own domain: Geist for headings and text, Geist Mono for labels and data, and Instrument Serif in italics as an occasional accent that echoes the wordmark.

The site is written for a busy owner deciding in a few minutes: what we do, what it costs, how we work and how to start. Packages show starting prices in US dollars, because clients abroad want a number before they book a call.

• English first, Spanish equal: every page exists in both languages with its own URL and hreflang tags.
• A contact flow that ends in a call: the form is validated on both ends, protected by Cloudflare Turnstile, sends the inquiry and an automatic reply through Resend, and offers a 20-minute slot on Calendly.
• Static and light: pages are pre-rendered; only the menu and the form ship JavaScript. Entrance motion uses CSS scroll-driven animations and respects “reduce motion”.
• Analytics without cookies: Cloudflare Web Analytics, so there is no cookie banner.

A brand that says what we do in four words, and a site we maintain ourselves at near-zero running cost. It loads fast, works in two languages and turns a contact form into a scheduled conversation. The whole process, from the first analysis to launch, is documented so we can repeat it for clients.