Once you have hired a designer, they will begin with their design process. This may vary slightly depending on the designer, but the main idea is usually the same: create a “mockup” design for the customer to review before building it. And your mission, should you choose to accept it, is to provide feedback as early on as possible.
This post will describe some of the different feedback stages that may be included during this process as well as what is expected from you, as the customer. Although you do not have to do much aside from give feedback, it is good to understand this process so you know what type of feedback is most helpful for each phase.
Depending on the designer, the project size, and the budget, you may receive 1 or 2 different types of mockups. If you only get one, it should be the design mockup, and this wireframe concept will not come into play. However, in a more complex or detailed project, you may first see a wireframe.
A wireframe is black and white; it offers no color, images or design elements. It helps to map out the layout of the site, using various placeholders for the different elements. For example, images are usually either represented by grey boxes or white boxes with X’s through them. The font used is typically a common, basic one (such as Arial) and not representative of the font that will actually be used on the site.
So, then what is the purpose of reviewing a wireframe?
When you are assigned one of these to review, do not overthink it. Try not to visualize in your head what you think it will look like with actual colors and images. In fact, the whole purpose of doing this before introducing those elements is so that you can focus on things outside of the site’s actual aesthetics.
When reviewing a wireframe, you should be focused on 2 things – layout and user process:
- Does the page contain the expected elements on it (with the most important ones toward the top)?
- Is it easy for the user to find the things they want to see?
- Does the layout help to push your users toward the things you want them to see?
When you sign off on a wireframe, you are basically signing off on the structure of the page(s) and their ability to provide what your visitors will need (and what you want them to find).
The next step in approval for a website is the actual design mockup. Depending on the size and budget of the project, you might receive multiple pages. In most instances, you will receive a mockup of the home page design as well as one internal page / subpage.
A mockup is practically a full look at the design of a page. Of course, you won’t be able to see any interactive elements, videos, or anything like that. Imagine that someone came to your finished site and took a picture – the resulting image would not demonstrate those effects. However, it would show you the color scheme, fonts, images, layout, and everything else.
You cannot “test” a mockup. Typically, clicking on elements in a mockup will not do anything (although sometimes designers will link page navigation in their mockups to easily navigate to other page designs for your review). However, you can envision the finished site, determine if you like the look and feel, and provide feedback to adjust the final design.
Why do I review a mockup instead of the actual built-out site?
There are many good reasons why designers create mockups:
- It is important to make sure that the designer and the customer are on the same page with the design before actual development begins. This is your chance to make any major revisions to things of which you are not a fan. Once the design approval is done and development begins, changes from that design will cost much more time and money.
- It is so much easier to adjust the design on a mockup than to change code or alter visual elements or interactive components on the actual website. Doing this makes the design phase more flexible and a lot faster than it would be otherwise.
- Also, in some instances, the designer and developer are two different people (or teams of people). This mockup provides the developer with a “map” of what to create.
If your website also includes brand new content, you will likely have a review process for that piece separately. It can be given to you in one of many formats (Word document, Google Doc, on the site, etc.), but no matter what method is used, the goal is the same: read through the content and make sure it properly represents your brand.
Content writers are professionals who know a lot about which words convert leads to paying customers and which will help your site’s SEO. They also know the best way to word things for readability. A good content writer will do their research, which includes interviewing you to collect the necessary information for the site; however, nobody knows your business like you do. You should always review the content to make sure it is 100% accurate and meets your needs.
Talk to your content writer about the best way to provide feedback to them. In most cases, tracking your changes in a document is the easiest for the writer to see all your comments and requested changes.
Once the design and content are both approved, the website will be built. At this time, you will have one final wave of feedback. Since you have already approved the mockup (and probably the content), this feedback should be minor. Work with the web design company’s development lead or project manager to determine how you will provide feedback and how much time you have to do so. Once this window closes per the project timeline, further changes typically start to incur additional hourly fees.
All projects are different
Just keep in mind that all web design companies have slightly different processes. Even projects within the same agency may be different from one another. The process described above is the sequence of the 4 most common feedback steps when building a website. Once you have provided all the necessary feedback to make your website sparkle, you can sit back and put your feet up while your developers work their magic.
Join us next time to learn a little bit more about the different elements that go into a website. Colors, and fonts, and images – oh my!