Like any other creative project, web design is best done in stages.
There are a lot of components that make up an effective site design, and designers and project managers alike can make their jobs easier — and their clients happier — by breaking down projects into manageable sections.
But the work doesn't stop there. In addition to divvying up the various stages of website development, designers and project managers can also achieve better and faster results by gathering client feedback at key stages in the design process.
So when should this feedback happen? While the web design process might vary a bit from project to project, most designs tend to follow a basic flow. No matter what you call the various stages of website development, it's important to hit the pause button at certain points. Here's an example of what it looks like.
1. Info gathering
A new website design project is a blank slate, which can be both exciting and nerve wracking.
In many cases, clients have a lot of great ideas about what they want but aren't quite sure how to express them. In these situations, it's up to the designer or project manager to figure out the client's needs and goals.
This typically involves asking a load of questions about purpose, branding, content, and the target audience. Many designers and project managers use an onboarding or design questionnaire to help clients pinpoint what they want.
In this stage, most designers and project managers create a wireframe of a website, which is a diagram of all the pages on the website and what each will contain. This is a critical tool for making sure the site design delivers.
In other words, it doesn't make much sense to delve into a website development project without first knowing if all the pages fit the client's needs and desires. A wireframe takes all the abstract concepts from the info gathering phase and puts them into visual format.
The wireframe gives an idea of how everything will come together, including logos, headers, images, content, and buttons. It’s the very first client deliverable. It should also be your first stop for gathering all-important feedback.
Marker.io makes gathering feedback at this stage easy by giving clients a way to make feedback visually.
Once the client has approved the wireframe, you can move to designing the website. This is the meat and potatoes step in the stages of website development. It's where all the ideas and pages gel, giving the client their first look at what they'll see when their site is live on the web.
Some designers and project managers ask clients to give feedback in writing. For example, they might have a client go through each page and make a list of likes, dislikes, and changes.
The downside of this approach is that it forces the designer to go through the list — sometimes struggling to decipher the client's notes — and then match them to a particular page or element within a page. It's tedious, time-consuming, and not very effective. That includes for people giving feedback as well as those getting it.
This is where a visual feedback tool like Marker.io makes changes easy, fast, and intuitive. People are largely visual creatures. Instead of handing a designer a list of edits, clients can simply mark up areas that need attention and automatically generate notes explaining exactly what they want done.
4. Site development
Once the client approves the design, it's time to develop the site. This takes the design from a two-dimensional layout and turns it into a working website.
Many designers start with the home page and build out from there, creating all the interior pages and filling them with content. They then build code that powers functions like contact forms, shopping carts, forums, and whatever else the site requires.
While some designers like to completely develop the site and then show it to the client in a big reveal, there's something to be said for letting the client continue to give feedback throughout the development process.
Marker.io makes this easy. As the site is being built, clients or project managers can capture a spot on their screen, annotate it, and send the desired change or problem area directly to their workflow management tool of choice.
The website is fresh off the assembly line but that doesn't mean it's ready to drive off the lot. First, it's important to test the site's functionality to make sure everything is running smoothly.
This is where designers and testers run the site through its paces, checking links and scripts. They also view the site on various browsers as well as check out how the various pages look in mobile format.
Check out 9 bug reporting templates for your web testing process that we’ve put together.
Once the testing stage is complete and any errors have been addressed, the website is ready to launch.
Maintenance is a key stage in website development. Just because a site has gone live doesn't mean development stops. In fact, many web designers work long-term with clients to oversee updates, check for any errors, and make changes when a client requests them.
Visual feedback tools like Marker.io make maintenance a seamless process. Clients can easily tag areas that need work, giving designers a hassle-free way to knock out edits and add new content.
Marker.io's feedback status feature also makes it possible for clients to see when an issue has been resolved, eliminating the need for designers and developers to send follow up emails.
Make feedback faster and easier with Marker.io
Feedback is an integral part of all stages of the website development process. You can make it faster, easier, and more effective by going visual. Learn more about Marker.io and how visual issue spotting and bug reporting can change your website development process for the better.