What are Wireframes ?

A wireframe is a diagram that is used by the scrum team to analyse and communicate the structure of the software that is being built.

But why do we use wireframes ?

There are numerous ways of designing a user interface but the right option has to be chosen in order to ensure that the system is easy to use and understand. So it is vital that the right user interface (UI) design is chosen.

When should the wireframes be created ?

The wireframes should be created before the software development is started to minimize rework and waste resources. Wasted resources include the scrum team’s time and organizational resources.

It is important that the wireframe designer i.e. the UI/UX designer, understands the information that has to be displayed on the screen.

The designer has to really understand how the user would interact with the system in order to properly design the interface, so it is important that the requirements are gathered before the wireframes are created.

The requirements can be gathered via user stories or use cases and this information would be used to design the wireframes.

How do you create a wireframe ?

Wireframes can be as low tech as being drawn with a paper and pencil, a whiteboard, or as high tech as using a specialized software.

Using a paper, pencil or whiteboards to draft the wireframes is a cheap and easy way to understand what is needed in the interface such as the look and feel of various buttons and fields.

So the wireframe designer might use a mix of both the options such as using a whiteboard to clear up the requirements and then switching to a software application for the final wireframe design.

But using a software also has numerous advantages such as data storage, data retrieval and wireframe reusability.

To properly create the wireframes minute details such as button placements, tooltips comments and field dimensions have to be understood.

These activities and many more have to be created to ensure that they users have the right use and feel of the software.

Some of the advantages of using wireframes include the following :

  1. Wireframes are used by the scrum team to have a share understanding of the same information.
  2. Wireframes are used to help design the user interface.
  3. Wireframes are easy to use and understand.
  4. Wireframes can prevent rework and save resources.