Web design and development: Designing a process that works | MO Agency

Web design and development: Designing a process that works

Posted by Adam Meikle
November 8, 2017

Web design and development can be a tricky business. We know from personal experience that developing and designing a web design process that works can seem like a real challenge.

So, let us help you to identify a web design process that can assist you in delivering quality website builds quickly and effectively.

A good web design and development process keeps the project owner informed and makes it transparent what happens during the course of development. It also favours ongoing feedback and input from the project owner and the development team involved. With these qualities in mind, this is our process.

Wireframing is the first step

Website wireframes (and site mapping) are essentially a visual guide that is representative of the skeletal framework of a website. The wireframe provides the scaffolding for the structure that is going to be your website.

In the world of design, there is a common saying that content is king, and it is something we stand by when it comes to everything digital. Understanding this is especially important when planning and designing your website.

Creating a wireframe will help you when deciding on what content you will add to your website and what content is extremely important to showcase. The wireframe is the base level architecture in which you create the structural hierarchy for your website and provides you with an overall visual representation of your future website.

New Call-to-action

Layout of the website

Following the wireframing process, you can start putting together the layout of your website. This is where you begin fleshing out your website. Typically, the layout of the website is done by the designer, in conjunction with collaboration from a web developer. The designer will use programs like Sketch and Adobe Illustrator to put together this layout.

Designing the website

Based on the brief, after both the wireframe and layout have been approved, you will receive feedback and reverts. Once all of this is finalised, then you can move on to the actual development of your website.  When it comes to feedback, reverts and site reviews, it’s important that your process facilitates growth driven design.

Growth driven design (or GDD) is a response to the traditional website design process. GDD is an agile approach which focuses on an iterative web design and development process whereby all stakeholders are involved in the process, which is ongoing.

Traditional website design focuses on a website as one large project that results in a finished project. Growth driven design views a website as a constantly changing and evolving mechanism that requires consistent review, redesign and redevelopment. This makes the process agile as ongoing input is required from all people involved.

The Scrum approach to running projects is agile and iterative, much in the same way as growth driven design is. Therefore, they pair quite well together.

Scrum is classified an agile framework for completing complex projects, such as website design and development projects.  With scrum, the focus is on sprints or short iterations of work that are fixed in length. In the case of our agency, we run our sprints for a week at a time during the design phase.

At the end of the sprint, comes the milestone or review of the sprint where you discuss the goals you have achieved and what were your challenges. Scrum is structured to make an overall project digestible and all the tasks in your backlog are made much easier to deal with by using this approach.

At the beginning of a sprint, the scrum master (facilitator) sets all the goals or tasks that need to be completed. Within the sprint, every day a daily stand-up is held to determine what each team member has achieved and what they were challenged by. A task is moved from the backlog, into an “in process” phase and finally a completed phase. At the retrospective and review, feedback is given and a review of the completed work for the sprint happens.

Web design and development is collaborative

Scrum suits the needs of the collaborative nature of the web design and development process. Throughout the process, there is communication between the designer and developer. The developer will express what works when presented with a design and the designer will try to match the design to functionality.

No longer should web design and development be caught in the waterfall process where designers and developers work in silos and a website is seen as one big project that needs to be completed.

Today, website development is a collaborative and iterative process driven by audience data insights and consistent feedback from designers and developers.

New Call-to-action