The process to create a layout

Layout is one of the most important aspects of the web and applications. We need to consider
a number of different things from the target audience to the brand and the content. Get it wrong and your users will get confused and leave to find the information elsewhere. Here we take you though every aspect of the process, from the initial inception of the project through to building and structuring the code, and touch on which display properties you should use.

THE PROCESS

The design phase of a project usually begins with a scoping document of some description. This document will contain a specification of what you’re designing.

The starting point for designing layouts really depends on the complexity of the project:

Brochure websites — for example — will usually use a fairly simple design phase and usually include the following processes: content gathering -> site map creation -> wireframing -> high-fidelity concept design.

Whereas a more complex web app design phase might include a few extra processes: gathering content -> sitemapcreation-> wireframing -> low-fidelity prototype -> high-fidelity concept design -> high- fidelity prototype.

There’s no right or wrong way to do this and different designers use different processes. It’s up to you — as the designer — to find the right process for the project at hand. This may also be dictated by the project’s budget, when this is the case you need to decide which of these processes are the most important for the project you’re working on.