Starting from a "result"
When clients first see their website, it is usually already finished.
They open the URL, the page loads, the navigation is clear, products, case studies, and contact information are all in place, and it looks fine on mobile too. The client says, “It’s good, quite nice.”
This is a clean result. But before this, it went through a process that was not so clean.
This article wants to talk about that process. Not to prove how difficult building a website is—we’ve been in this industry for ten years and are long used to it. Rather, it is because many clients don’t know how many hurdles a website has to pass through from “wanting to build one” to “going live”. Not knowing makes it easy to get anxious; being anxious makes both sides tired.
Lay the road out and take a look; perhaps next time we work together it will go a bit more smoothly.
Level One: Translating "I want a website" into requirements
When clients come to us, their first sentence is usually "I want to build a website."
This statement is true, but it is not a requirement—it is only the entry point to the requirement. What the website is for, who it is for, and what they want visitors to do after viewing it—these are still in the client's mind; some have already thought them through, and some have not.
The first thing a designer does here is translate: breaking down a vague intention into actionable items.
We will first ask a few specific questions. For example, "What do you want visitors to see first when they come in?" and "How do your main customers find you?" These kinds of questions are much more useful than "What style do you want for your website?", because the former can elicit information, while the latter can only elicit feelings.
This process requires repetition. Sometimes a question has to be rephrased three or four times before hitting the point the client truly cares about. What the designer needs to do is not record answers, but hear the part the client hasn't said out loud from their answers.
This process requires the client's cooperation, and what the designer can do is ask questions specifically enough that the client can answer without effort.
Stage Two: Defining columns—this step determines the skeleton of the website for the next five years.
Once the requirements are clear, we reach the true starting point of design: defining the section structure.
To outsiders, this step looks simple—isn’t it just deciding how many menu items go in the navigation? But in reality, it is the step in the entire project that requires the most judgment and is the hardest to rework. If the sections are defined sensibly, the later design, content filling, and SEO all flow smoothly; if the sections are defined awkwardly, every later step becomes damage control.
What the designer needs to do here is recategorize the scattered information from the client. Clients usually tell us “I have these products,” but rarely tell us “what relationships these products have with one another.” Some products are parallel, some are nested, and some are different names for the same thing—we need to sort out these relationships and turn them into the hierarchy of pages.
At this step, we usually take two actions.
One is to align with the client’s business logic, not the order in which they happen to say things. When clients speak, they often say whatever comes to mind; the designer needs to recode these fragments so that the sections form a structure that matches visitors’ cognition.
Two is to anticipate future expansion. The section structure doesn’t just serve today’s website; it also needs to accommodate the client’s new products next year and new business the year after. We deliberately leave room so that the client doesn’t have to change the entire site structure every time they launch something new.
On the client side, what they need to participate in is approving this structure. Once this step is aligned, it will save a lot of trouble later.
Stage Three: Content — The client has nothing ready-made on hand, so we build it up with them, bit by bit
Once the sections are set, the next step is to fill each section with content. This is the most time-consuming part of the entire process.
The reason is simple: the vast majority of clients have never systematically organized their own products or services. They know their business inside out, but that knowledge is "in their head," not "written down clearly on paper." Once they are asked to organize product categories, selling points, specifications, and images into a list that can be placed directly into the website, the difficulty becomes obvious.
The work the designer does here has actually gone beyond "design" and is closer to sorting things out and guiding.
We give clients some references—using the categorization logic of shopping platforms they are familiar with as an analogy, so they first establish the concept of "categories." If it is still hard to understand, we provide template files with examples, laying out the structure for clients to fill in accordingly. Going further, we suggest that the client first provide a batch of content, and we build it into the page for them to see—seeing the real thing is more effective than hearing explanations ten times.
These approaches were not pulled out of thin air; they were tested bit by bit across many projects. They have only one goal: to turn what the client cannot put into words in their mind into something they can put clearly on the page.
This stage consumes the most energy and is also the least visible. Because on the final website, visitors only see a neat content list, and cannot see how many times it was organized behind the scenes.
Level Four: Color and Visuals—Growing Out of the Client's Brand
Only after the content and structure are clear does it truly enter the “design” phase as most people understand it.
The color palette is drawn from the client’s existing brand assets, primarily based on the logo. This is not an arbitrary choice—if a website’s colors don’t match the brand identity, visitors will clearly feel a disconnect. So the starting point of visual design is not the designer’s personal preference, but carrying forward the client’s brand.
But “drawing colors” is not the same as “copying.” The logo may contain only one primary color, while a complete page needs a combination of primary, secondary, neutral, and accent colors. What the designer must do is, while maintaining a consistent brand tone, complete this color system and assign each color its own role—which color guides, which color calms, and which color appears only where it most needs to be highlighted.
In addition to color, there are layout, typography, image treatment, and motion rhythm. These details seem minor individually, but together they form a page’s “temperament.” And when it comes to temperament, clients can’t say what they want, but they can tell at a glance whether it’s “right.”
So at this step, designers often need to provide more than one proposal, letting clients find the feeling through comparison. This is not probing; it is using concrete things to align with abstract descriptions.
Level Five: Revision—True mastery lies in the unseen.
Once the design draft is ready, it’s time for revisions.
Revisions are the part of a designer’s work that tests patience the most and is also the most easily misunderstood.
Client feedback often comes as a single line: “It doesn’t feel quite right.” There is no specific information in that sentence, but designers cannot ask the client to explain clearly—the client’s job is to express feelings; translating those feelings into revision actions is the designer’s job.
When this happens, what we need to do is go back over our own proposal and look for clues in the client’s words: Is the color too heavy? Is the information too dense? Is the order of some section making the visual flow uncomfortable? Then take a few possible directions for adjustment and show them to the client again, using round after round of comparison to close in on that “right” position.
Sometimes the client gives specific instructions—“Make this font size bigger,” “Move this to the top.” These are actually easier to handle. What truly drains people are always those back-and-forths at the level of feeling.
This stage is also the hardest to understand. To outsiders, revising a design looks like just moving a mouse around. In reality, one “doesn’t feel right” can mean reworking the entire page’s visual logic from scratch and then overturning your own judgment from yesterday.A large part of a designer’s professionalism is embodied in this calm willingness to overturn themselves.
Level Six: Multi-Platform — A solution on one screen must hold true on every screen.
A visual sign-off is not the finish line. Next comes multi-device adaptation.
A website may be built on a large screen during the design stage, but not every visitor arrives from a large screen. Some use laptops, some use phones, some use tablets. The same set of content has to stay readable, viewable, and usable across screens of wildly different sizes.
This isn't a simple matter of proportional scaling. Once the screen narrows, horizontally arranged sections have to become vertical, side-by-side elements have to stack, navigation has to collapse, images have to be re-cropped, and font sizes and spacing have to be recalculated.Many times, a layout that looks beautiful on a computer has to be redesigned from scratch for a phone.
What the designer has to do at this step is tear apart the solution they just finished and rebuild it within constraints. This rebuilding process is often more mentally taxing than the original design, because there is no large space to squander — every element has to compete for a limited position.
When a visitor scrolls smoothly through a page on their phone, they probably never think that behind it, a designer has told the same story twice on two completely different canvases.
The final hurdle: after launch
The website goes live, and the process looks finished.
But for people in this line of work, the real test begins only at this point. How well the pages load in a real environment, whether the client can smoothly update the content themselves after receiving the backend, and when follow-up adjustment requests will come—these are all things that happen after launch.
We broke the birth of a website into the six stages above. Once written down, you'll find that most of these steps are invisible to the client in the final product. What they can see is that clean result; what they cannot see is the process of layer after layer being pressed solid beneath that result.
There's nothing to complain about in this.The value of a piece of work was never about how much it is seen, but about how well it is done.
We only hope that the next time you look at your website, you can know a little more about where it came from—know that it was made carefully, step by step.