Brief and requirements
Website design doesn't start with mockups, it starts with questions: what should the site do for the business (sales, leads, information), who's the target audience, is there existing content or a brand style, and what technical constraints exist — for example, which platform it'll be built on.
Structure and user flows
Before a single visual screen exists, the site's architecture needs defining: which pages are needed, how they connect, what path a user takes from landing on the site to completing the goal — a lead, a purchase, a signup. Mistakes at this stage are the most expensive to fix later, once screens are already built out.
Wireframes — testing logic without visual noise
A wireframe shows block placement and screen sequence without color or type — this lets you discuss interface logic without getting distracted by "do I like this color." Structure is cheap and easy to change at this stage — reworking a wireframe is far faster than reworking a finished mockup.
Visual mockups
Only after the wireframe is approved does actual UI work begin: color, typography, iconography, button and field states, mobile adaptation. This is also where the details that define a sense of quality get worked out — spacing, micro-animation, hover states.
Handover to development
Final mockups get handed off with a description of interface states (hover, error, loading) and, typically, a link to a Figma file where a developer can inspect exact sizes, spacing and colors directly, without needing them listed separately.
How long it takes
For an average landing page or brochure site, the process from brief to final mockups usually takes three to six weeks, depending on the number of pages and approval rounds. For larger products with a dashboard or complex logic, timelines are quoted individually once the structure is worked out.