IT Design Tools – Wireframes

Here is a Knowledge Organiser for Wireframes

In this lesson, we will focus on Wireframes. These can be used as a tool to design a website

For examples, this is the BBC Bitesize website

The design for this website can look something like this.

This would be a low fidelity wireframe, as it does not show any pictures or logos. We could add more exact details to make a hi-fidelity wireframe

Here is another example of a Wireframe, for a YouTube channel

Your task

1. Create a low-fidelity wireframe for the home page for the BBC website

or you can choose a business, such as Domino’s

2. Make a copy of your wireframe and convert it to a high-fidelity wireframe

A high-fidelity wireframe will include some pictures or a logo or any other graphics that may be used.

High-fidelity wireframe for Domino’s