The Website Design Process in 4 Steps

Take a glimpse into the Website Design Process at Project Assistant

As a web and graphic designer, you are the one of the most valuable and influential members of a web development team, especially when you understand how to develop an effective website design. There are a lot of people who can write code or have opinions on design but few people have the talent, experience or wisdom needed to create a winning website design that helps achieve the goals of your clients.

Step 1: Client and User Research

Getting to know who the client is and what do they do is very crucial in this phase of the website design process. We try to gather as much information as possible about the client through interviews and get different perspectives through feedback and referrals from other professionals who know the client or have worked with them. We provide questionnaires for the clients answer which help us determine who they are, what they do, how they operate and more. Understanding the whole goal and purpose or what the client wants to achieve with the project is a must.

Online research about the company or product is also conducted to gather insights of their presence and how they are perceived both online and offline. Identifying the client’s target audiences is also crucial in this phase in order to know who you intend to reach out to, what the current situation of their market is or what their competitors are doing.

Understanding the company’s passion and culture helps Project Assistant express, convey, and visually interpret the client’s company or their products through the website design. Thus we can create the best possible experience to captivate the targeted audiences and convert them into customers for our client.

All of this information gathering is essential because without it, making a website design will be like “shooting in the dark”. You’d still be able to create a stunning design but you’ll miss the mark or the whole purpose of the project, hence failing to deliver to the client.

Step 2: Content / Requirements Gathering

“Content is King” as they say in content marketing. Understanding what content you’re going to work on is crucial because content dictates how you create your layout. In this phase of the website design process, Project Assistant begins to determine different aspects of the website such as its structure, an estimated number of pages, the possible navigation to be implemented, client specifications, site plan, conceptualization and many others.

This is also the phase where Project Assistant gathers content for the website from the client such as photos, text documents, PDFs, audio and video files and other media that needs to be on the website. The layout and placement of the content is then discussed with the client. Features of the website are also initially determined based on how the client wishes to manipulate the provided content and what kind of user interactions are expected to happen.

Basically, this phase is a prerequisite to the next because contents are like puzzle pieces from a designers point of view. They use them as basis for their layout and without them, it’s like trying to solve a mystery without any clues.

Step 3: Wireframes

This is phase of the website design process where the page schematic or screen blueprint of the website is drafted. Using the contents or information obtained from the previous phases of the design process, Project Assistant designers create a visual guide that represents the skeletal framework of the website.

Usually made up of basic shapes and lines, the screen blueprint is where the designers figure out the layout of specific page templates for different pages of the website based off the content obtained from the client. This phase is like putting together the pieces of the puzzle that make up the whole website. Designers move things around or change the layout without too much detailed editing until they can find the best layout that meets the requirements.

Collaborating with Web Developers, this is where UX (User Experience) designers conceptualized and plan out the user interactions that are going to happen on the website.This is when they evaluate what’s possible and what’s not. After all it’s about delivering the best functionality, usability and reading experience possible to the target audience.

Step 4: Mod Boards/Mockups

After carefully planning the layout and working with web developers to ensure the best user experience possible, it’s time for the fun part. This is where User Interface (UI) designers come in to paint the whole picture from grayscaled basic shapes and lines to detailed, awesome, complicated shapes and colors that make the entire site look beautiful.

UI designers add the detailed look and feel to the website by integrating the contents such as, images, text documents, audio and video files to the painted design. At this phase, designers can continuously tweak the look and feel of the design to the liking of the client. After changing colors, styles and even content until the design gets approved by the client, it is then handed over to the web developers to turn the mockup into life.

So there you have it, a step by step overview of the website design process at Project Assistant. Remember, web and graphic designers play a huge part in creating a site. You have to make sure that the website design process you use is efficient, displays the right content and can achieves the look and layout that will satisfy the client.

Jeremy Hibionada

For years I’ve been using Photoshop as my primary design tool for everything, from print design to web design.