Agencies and freelancers often face similar roadblocks while working on a web design project. A great web design process can help you tackle these worries with ease. At Niswey, we have standardized the web design process which helps us deliver better. I am writing this blog post to share the insights and help you evolve in your web design process.
On any web design project, we work in a team of two. One person sits on the driving seat, executing the design and other one plays the role of navigator. The duo discusses every small aspect of design. This makes the design holistic and well-thought-of.
We follow a 7 phase web design process to make sure that we adhere to deadlines and deliver a quality project to drive our client’s marketing efforts. And these phases are:
Phase 1: Requirement Gathering
Understanding what a project will deliver is critical to its success. Team working on the project should gather all the relevant information. This helps in driving the project to a successful closure.
A few questions which you should not forget to ask in any web design project are:
There can be more such questions. Make sure you don’t miss out any!
Phase 2: Quoting the Client
The cost per hour you bill your client is your call. But there are a few aspects which you should not miss while quoting:
Quotation = (Effort you spend on studying the structure of the website and researching) + (Effort for data analytics ) + (Effort you spend on persona building exercise) + (Wireframing Effort) + (Time taken for design conceptualization) + (Designing effort) + (Coordination effort with cross functional teams) + (Effort you spend on review and approval meetings)
Phase 3: Persona Building
Hubspot Academy defines Personas as the fictional, generalized characters that encompass the various needs, goals, and observed behavior patterns among your real and potential customers. They help you understand your customers better.
There are various methods of defining a persona and we find “War-Room” the best way to get the desired result.
We share ‘Website Persona Questionnaire’ (download Questionnaire here) with all the stakeholders in the war-room meeting. The site owners are also requested to fill in the ‘Design, Content and Website Questions’ (download Questions here) keeping the persona in mind.
Phase 4: Data Analytics
Analysis of web data helps in understanding and optimizing the web design. Google Analytics and heatmap study helps in drawing meaningful information. This study helps in knowing what works on the website and what does not!
Phase 5: Wireframing
Information gathered in the previous phases will give you a launchpad to kickoff wireframing. Below approach to wireframing will help you get quicker and quality results:
Step 1: Begin with wireframing of homepage and complete the menu structure first. Strive to get quick approvals on page layouts, menu structure, footer layout, placements of social icons, logo placement, sign ups forms placements and CTA elements.
Step 2: Work on the wireframe of one of the content heavy pages.
Step 3: Get the review on these wireframes and incorporate the changes.
Step 4: Finish all other wireframes and schedule a review meeting with stakeholders.
Phase 6: Web Design Conceptualization
How much time do you give to your design before starting the design? It is important, it is very important!
Don’t jump into designing straight away after wireframes. Soak-in all the information and wireframes before you actually start designing the website. This gives a direction to your designs. This is what we do:
Phase 7: Designing (Finally)
And now you are all set to design!
We follow the approach below for designing:
Step 1: An ideal website should be content driven and hence it is important that the design and the content teams are on the same page. Meet the content team to understand the content calendar. Content calendar helps in planning your design calendar. Having a look at the content helps in visualizing the design. The content team also needs to have an idea of design so that they know their limitations.
Step 2: In every website there are pages that have a similar design structure but varying content. It is advised that the design team figure this out and inform the content team. Content team can thus plan to write the content of the pages with different design layouts first. This will provide constant content feeding to the design team and the work will not stop.
Step 3: Come up with a timeline for the design deliverable. Make sure that your content team knows exactly which pages are being delivered when.
Note: Include meeting time and time to incorporate design feedback while deciding the deliverable dates.
Step 4: Work on homepage design, one content heavy page and one media heavy page first.
Step 5: Have a design review meeting with the client
Step 6: Work on 3-4 pages in the next set
Step 7: And have a design review meeting with the client again.
Step 8: Close all pages remaining pages with standard designs formats in the last Set.
Step 9: Meet the client with the last design set.
Step 10: Send all pages together in the end with the feedback changes incorporated.
Step 11: Feed in all the real content in the pages and keep it ready for development.
The phases and approach of design may vary from project to project. But if you can standardize your web design process, it will help you deliver projects in right quality and time, much to the delight of the customer!
Checkout my video on how to work on your design process:
Submitted your design to the client? Check out the design feedback process that works for you as well as your client!
