If you would like to talk about your project call (02) 4474 5861

Website Wireframe

What is a Website Wireframe?

A website wireframe is a drawing that shows what content/functionality is required to go on a particular web page and will also influence the visual design of the page. A wireframe helps to start to visually map out how you wish to direct people around on the website as well as inform the web designer important key elements to the sites layout/ hierarchy  and functionality.

The wireframe drawing can be done by pencil and paper or by using a computer program such as Photoshop (or by using a free wireframing software), it does not really matter as long as the information is conveyed clearly. There can be one or several wireframe sketches for a single website depending upon the website complexity.

The wireframe outlines the layout that can then be used to guide the visual design process of the website. It is also useful to highlight particular blocks of information (eg News section) and functionality (Eg Form when submitted redirects users to a new page with the website) too.

Even though the wireframe is a simple drawing, thoughtful strategies on how the website will be used/perform (UX User Experience) are fundamental to create the wireframe.

Examples of wireframe sketches

Pencil Wireframe sketch

The below wireframe was done with pencil and paper. Numbering was then added and further information was supplied to explain each area within the wireframe sketch.

wireframe sketch

Wireframe created with pencil and paper

Wireframes created with Illustrator

Simplified block layout showcasing specific areas of the website.

Wirefame sketch illustrator

Wireframe created with Illustrator

Wireframe created with Photoshop

Simple drawing showing the layout with short explanations of each section.

wireframe example

Wireframe created with Photoshop.

Instinctively creative & thoughtful strategies with result orientated outcomes

Visually communicating effectively with your potential & current customers adds to the good business experience.

BJ2DESIGN combines a wealth of design knowledge with creative business strategies to create result oriented work.

Read More About BJ2DESIGN

creative hand and tools