Analysis of Wireframe

What is a wireframe?

A wireframe is an early design to a website usually used in the development process to establish the basic structure of a page before actual content and visual design is added. It takes into account the needs of a user and their journeys (ExperienceUX, 2016)

Advantages and disadvantages of wire-framing.

When working with a client, a wireframe is a great way to get early feedback as it provides an early visual of what the website is intended to look like. They are also easy to amend and once approved by the client themselves, can give the designer confidence (ExperienceUX, 2016).

Disadvantages however could be that due to the lack of design and no technical implications, its not always easy for the client to fully understand. Nevertheless, creating a wireframe is always a great way to start the creative process of designing a website.

Examples of wireframes

To the right is one example of a wireframe. The layout is very basic how gets across the necessary information so that the client can see what will be included. Colours or images have yet to be applied, whilst actual informative text does not yet need to be included.

Image sourced from: http://www.comentum.com/images/wireframes-sample/ecommerce/home.png

The Brief

A brief was provided brief by Henry Board to design a website around his career in Freelance Camera Operating. The email sent read as follows:

Dear Nathan,

I would liked you to create a website aimed around a career for myself in camera operating. There are a few things I’d love to have implemented onto the website. A new trend at the moment is the scroll down function on a website where everything Is on one page so to speak, I’d love to have something similar!

Secondly, I’d preferably liked the website to be quite simple and easy to navigate so it can be easily accessible by a range of people. Look forward to see it!

Best wishes,

Henry Board

<via email>

Below are screenshots of the wireframe designed for Henry's brief.

References

Comentum.com. (2016). Wireframe Example. [online] Available at: http://www.comentum.com/wireframe-example.html [Accessed 9 Feb. 2016].

Experience UX. (2016). What is wireframing | Experience UX. [online] Available at: http://www.experienceux.co.uk/faqs/what-is-wireframing/ [Accessed 9 Feb. 2016].

#wireframe