Why Design Should Always Come Before Development
It made sense at the time. The developer said design was included. The price was reasonable. The timeline was fast. You had seen their portfolio — the sites looked clean and professional. You said yes.
Weeks later, the site went live. It worked. All the pages were there. The buttons clicked. The forms submitted.
But something was wrong. It didn't look like you. The fonts didn't match your brand. The layout felt like a template someone else had chosen. The images were placed where they fit, not where they made sense. And when you compared it to the vision in your head — the gap was significant.
This is one of the most common situations founders encounter when building a website. And it is almost always the result of the same thing: development started before design.
The Difference Between Design and Development
These two words are often used interchangeably — but they describe completely different disciplines.
Development is the process of building a website — writing the code, setting up the database, making the forms work, connecting the integrations.
Design is the process of deciding what the website should look like, how it should feel, and how a visitor should move through it — before a single line of code is written.
When a developer says design is included, they usually mean they will choose a theme, select some fonts, and place your logo at the top. That is not UI/UX design. That is template customisation.
Real UI/UX design happens in a tool like Figma — where every page is designed as a complete visual and strategic document before anything is built.
What a Proper Website Design Process Looks Like
Before development begins, a proper UI/UX design process covers:
Brand application Your brand strategy, visual identity, color palette, typography, and tone of voice are applied to every page — so the site feels like an extension of your brand, not a separate thing.
Audience persona The design is built around how your specific audience thinks, feels, and behaves — not around what the designer prefers or what the theme allows.
User journey mapping Every page has a clear purpose. Every section leads the visitor toward a specific next step. Nothing is placed randomly.
Component design Buttons, cards, navigation, forms, and every repeating element are designed consistently — so the site feels intentional throughout.
Responsive design Every page is designed for desktop, tablet, and mobile — before development begins, not as an afterthought.
The result is a Figma file that functions as a complete blueprint. The developer builds from that blueprint — and the site that goes live looks exactly like the site that was designed.
What Changes When Design Comes First
When a website is designed properly before it is built, several things happen that would not have happened otherwise.
The site feels like the brand — because every decision was made with the brand in mind from the beginning.
Development is faster — because the developer has a clear reference instead of making design decisions on the fly.
Revisions are minimal — because the design was reviewed and approved before a single line of code was written.
The founder feels confident — because what went live is what was agreed, not a surprise.
Is This Where You Are?
If your website went live and doesn't feel like your brand — or if you are about to build a new site and want to make sure the design is done properly first — this is exactly what a Figma-first web design process solves.
Did you like this article? Spread the word!
Turn Strategy Into Creative Advantage
Principles and stories from years of helping brands find their voice — and their people.
