The rebuild started for a reason most people wouldn't expect
The new LKI online experience went live in April 2026. The reason I rebuilt it isn't the reason most people assume.
It wasn't that the old site was dated, though it was a few years old. It wasn't a brand refresh, though the brand had evolved past it. It wasn't even that I'd outgrown the messaging, though I had.
I rebuilt because what a Design Guidelines document needs to be has fundamentally changed in the last two years, and most of the practice hasn't caught up. I wanted to build ahead of the shift, not behind it. And I wanted to do it on my own work first, because I wasn't going to ask a client to invest in a foundation I hadn't built for myself.
So the rebuild started where every good rebuild starts. Not with the homepage. With the Guidelines underneath it.
What changed
A few things happened at the same time, and together they changed what a brand foundation has to do.
Vibe coding became real. Tools like v0, Cursor, Lovable, and Claude Code now let people describe an interface and watch it build itself. Some of these users are developers; many aren't. The output is only as coherent as the instructions the tool can be given — which means whoever's directing the tool needs design rules they can articulate, not just a sense of what looks right. "Make it feel modern" produces slop. "Use the brand's CTA pink only on the primary action, with the orange-wash ghost variant for secondary, on a soft neutral page" produces something usable.
AI landed in everyday creative tools. Custom GPTs, Claude Projects, Canva's AI, Notion AI, Google's Gemini in Docs and Slides — these are now drafting copy, generating layouts, suggesting visuals, and shaping content for teams who don't have a designer in the room. The output is on-brand only to the degree that the brand has been described in language those tools can use. Hex codes and a logo file aren't enough anymore. The voice rules, the do-and-don't lists, the documented vocabulary — all of it has to exist as text the tool can actually read and apply.
A single brand now lives across more surfaces than ever. The same identity has to hold up in a Canva social post, a Google Docs proposal, a Figma file, a Notion page, a Webflow site, a WordPress blog, a custom GPT, and a printed business card. A traditional brand guide — a PDF that lives on someone's hard drive — can't reach any of those places without somebody manually translating it each time. And manual translation is where consistency goes to die.
This is the shift, and it's already underway. Most Design Guidelines I see in the wild weren't built for any of it.
What Design Guidelines have to be now
The job has changed from "visual reference" to "instructional system." Not just a document a designer can interpret, but a foundation a team, a freelancer, an AI tool, or a vibe-coding workflow can all draw from without losing the brand's coherence in the process.
That means a few specific things:
Tokenized
Colors, type sizes, spacing, radii, shadows — all named as variables, not just listed as values. --lki-cta: #FF6B9D; works for a CSS file, a Figma library, a Tailwind config, a custom GPT system prompt, and a Canva brand kit. A hex code in a PDF only works for whoever's looking at the PDF.
Articulable
Every rule has to be writable in plain language, not just shown. AI tools don't understand "feel." They understand instructions. So the Guidelines have to name the rule out loud: pink earns the click. Italic earns its emphasis. Flat by default. Three type voices, never speaking at once. Each of those is a sentence a human, a freelancer, or an AI can read and apply.
Multi-surface
Documented at every level the brand will actually be used. Visual examples for humans who learn by seeing. Token names for developers and AI tools. Voice rules and do-and-don't language for writers and content workflows. Component logic for builders. None of these layers are optional anymore.
Portable
Built once, used everywhere. The same source of truth plugs into Canva, Google Docs, Figma, WordPress, custom GPTs, and whatever comes after.
Most Design Guidelines today are at most one of these. The brands that will hold up over the next five years are the ones whose Guidelines are all four.
What that looks like — the LKI Guidelines
The new LKI Design Guidelines run sixteen chapters. Not because longer is better — because each chapter solves a different layer of the problem.
Principles opens the document with four convictions: clarity over cleverness, pink earns the click, flat by default, italic earns its emphasis. These aren't aesthetic preferences. They're decisions a freelancer, an AI tool, or a future me can refer back to when the work is drifting. Every other chapter operates inside them.
Mood and Photography — editorial, atmospheric, never AI-generated, never staged — with documented examples of what's in and what's out. The kind of rule a custom GPT can actually apply when generating image prompts, instead of guessing.
Icons and Illustrations — Wired Outline icon set as both static SVG and Lottie JSON, with stroke weights matched to input border weights so they sit naturally inside the system. Custom illustrations as a parallel set. Both folders linked, both sources documented.
Typography — three families, each with a specific job: Inter for structure, Instrument Serif Italic for one moment of feeling per page, JetBrains Mono for technical scaffolding. The italic rule is the one I'm most proud of: the serif italic appears once per headline, never as decorative flourish. That's the kind of rule a vibe-coding tool can read and obey, and a freelancer can apply without asking.
Color — three surface roles do most of the work (pure white, soft neutral, dark navy), then a full palette with each color's role named explicitly. Mint and lime are illustration colors. Teal and apple are extras for charts and supporting graphics. Pink is the only saturated interactive color, reserved for action. A custom GPT prompted to generate a marketing graphic with this Guidelines doc loaded knows not to put pink on illustration and green on a button. That's the test.
Spacing, Radius, Elevation — an 8-point spacing scale, six border-radius steps each with a named role, five elevation states mostly flat. Cards lift only on hover. Pills carry a soft inset. These look like small decisions. They're the difference between a system that holds up across a hundred pages and one that drifts after twenty.
Buttons, Navigation, Cards, Badges, Forms — real working components, fully documented. The kind of detail a builder, a designer, or a vibe-coding tool can pull from directly.
Dark mode — works properly. Surface roles swap, hairlines hold, the focus ring stays legible. Not just inverted colors. A real second skin for the system.
The Guidelines themselves are public, lived-in, and beautiful. They're not a deliverable I made for a client — they're the working reference my own practice runs on. That's the bar.
Building the site on top
Once the Guidelines were solid, the site got built on top of them — not the other way around. Every piece of the new larakroekerinteractive.com is a direct expression of a documented rule.
The hero headline uses the italic accent exactly once: "Websites and design systems built to last." The italic earns the emphasis because the rule says it does.
The CTAs are pink. Only pink. The illustrations are mint and apple green. The page surface is the soft neutral. None of these decisions got debated during the build — they were already decided in the Guidelines.
The site is also headless. That's intentional, and worth naming. Most of my client work is on WordPress, and WordPress will probably still be around for a while. But twenty years of watching platforms come and go means I'm not going to bet my own foundation on any single one. Going headless on the LKI site means the content lives independently of the front end. If WordPress goes away — or just becomes the wrong tool for what I'm doing in five years — I move the front end without rebuilding the content. That's the foundation argument, applied to my own infrastructure.
I do the same thinking for clients, sized to fit their situation. Most don't need headless. Most need a well-built WordPress site with Guidelines that would survive a platform change if one ever became necessary. But the principle is the same: build the foundation so the platform can be swapped without starting over.
Why most clients don't know they need this yet
Here's the honest part. Most clients aren't asking for tokenized Design Guidelines or AI-readable voice rules. They're asking for a website. Or a brand refresh. Or a campaign site for next quarter.
That's fine. The Guidelines I build for them are the right shape for what they're asking for today, and they're also the right shape for what they'll be doing in eighteen months — when their team is drafting in Canva AI, when their summer intern is generating slide decks in Google Slides with a brand-trained GPT, when somebody on the team is vibe-coding a landing page in Lovable on a Friday afternoon.
I'd rather build the foundation that holds up for both. It costs the same to do it right the first time. It costs significantly more to redo it.
That's the case I make for clients now. Not "you need an AI strategy." Not "let me sell you an AI adoption package." Just: when we're building your Design Guidelines, let's build them as the kind of foundation your team can actually grow into — across people, tools, and whatever comes next.
The through-line
The work I do hasn't fundamentally changed in twenty years. Clear Design Guidelines. Sensible information architecture. Content that knows what job it's doing. Brand voice documented well enough that anyone can use it without breaking the system.
What's changed is who "anyone" includes. A new hire. A freelancer. A summer intern. A custom GPT. A vibe-coding tool. A future version of the team using software that doesn't exist yet.
The fundamentals haven't moved. The job they have to do has expanded.
Rebuilding LKI was a chance to demonstrate what that looks like when it's done well. Sixteen chapters of Guidelines. A working online experience built on top of them. A headless setup so the platform can change without the foundation having to be rebuilt. The whole thing public, the whole thing lived in.
If you're trying to figure out whether your own brand foundation will hold up to what's coming, that's a good conversation to have. It's also the conversation I'd rather be having with clients now than in two years, when the cost of fixing it has gotten meaningfully higher.
The platforms change. The fundamentals don't. The job they have to do is bigger than it's ever been — and the work I'm doing is built for that.
