The slogan “power to the people” was originally coined in the 1960s as a statement of rebellion against authority. In today’s communication landscape, the same phrase could be used to describe how the emphasis has shifted – it is with the user, the visitor, the individual that the power now lies – to the receiver of the message as opposed to the sender. In the field of web and app development, you ignore the people’s wants and needs at your peril!
Taking the user experience into account has now become a prime focus of any digital design. Besides having to cater for a client’s communication and business needs, we need to give a great deal of attention to what a reader’s expectations of the site (or app or newsletter) would be.
One of the most worrisome factors that we have to deal with in the digital realm is the "click-off reflex" – the urge to click away from a digital interface on the slightest whim if it is not delivering on our expectations, if the information we want is inaccessible, if download times are too long, or if the content is irrelevant, indigestible or too long-winded. The digital realm offers so much choice that a user's desires are likely to be fulfilled elsewhere at the click of a mouse if your interface isn’t doing the job adequately.
When we start considering a site or app, we have piles of puzzle pieces that need to be assembled in a way that ensures that the site makes sense. In effect we have a jigsaw puzzle without the picture of what the final puzzle will look like. To give structure to this chaos as well as accommodate the user's needs, we need to start with a wireframe.
The wireframe is in effect an imaginary structure onto which all the elements of a site can be placed and prioritised so that it serves the needs of the client, the user and the content.
A wireframe allows you to plan the site in a loose, flexible way before getting tied down with details. It is best done initially in consultation, with all role players having a say to ensure that all angles are covered. Initial wireframes are usually scribbled versions of the landing page, which is a good starting point. These sketches are a good way for everyone to visualise how content, navigation, interactivity and structure have been considered, and how the user journey will be adequately facilitated.
A wireframe is not a design; it is the structure around which a design will be built.
Once a wireframe has been agreed upon, a site map can then be developed. The site map outlines the overall structure of the site, shows where content is distributed and linked, and defines the user journey.
Pre-planning sites in this way may appear to be arduous and time consuming upfront, but in the long run it actually ends up adding to efficiency and saving time.
Having a plan well laid out, having a visual representation of the site to work to, and having the whole team on the same page streamlines the process and prevents scope creep and unpleasant surprises further down the line when the site has been designed and developed. This process will also clearly identify if there are gaps in content or unachievable expectations that need to be moderated.
The process of developing wireframes and site maps is a collaborative one that should allow everyone to bring their individual skills, expertise and instincts into the mix. What should ultimately result is a better product that not only delivers on a client’s needs but empowers the user to engage with ease and negates the dreaded click-off reflex.