Using a Wireframe as a Starting Point for Development

A wireframe is a tool used by web designers to put basic ideas on the screen for the owner to approve and suggest modification. It is the bare skeleton of the web site. The time consuming graphic design and programming are added to the wireframe later on. In short the wireframe is the basic idea around which you develop and add on branches and interlinks for any specified purpose. There is often a misunderstanding and confusion between a wireframe and a story board, the two main tools used for web development.

Whereas in story board presentation the designer tries to impress the owner by adding visual elements, the  developer using wireframe will lay emphasis on the functional aspects as well as the structure of the web page and the contents. This is like presenting the fundamentals and abstract concepts in wireframe versus the obvious and visual in the story board. Though at first impression the tangible and visual presentation in the story board will attract the customer instantly, the wireframe approach has greater flexibility and possibility to modify the web site as per the customer’s desire.

In short the wireframe is a starting point where the customer is presented the basic idea in a concise manner. The purpose is to start the mental process and to enable the customer to generate ideas of how best he could present his product. and what can be added to enhance the presentation by way of graphics or picture and words. It is the naked page without the frills. There are no attractive figures or pictures. The story board harps on visuals while the wireframe harps on the fundamentals.

In absolute terms the fundamental difference between the wireframe approach and the story board  is that  the wireframe puts emphasis on the “what” while the story board  puts emphasis on the “how.”  Wireframes can be a very unattractive presentation when you look at it from the visual angle, and very boring to look at. Whereas the story board by its very nature will attract any person by its visual presentation. Wireframes will generate thoughts and answer questions of what is to be done next. The story board presentation will attract the customer and show him how to do things.

However the wireframe has positive advantages of flexibility, low cost and capacity to modify without loss of time. Both of these tools can be effectively used for web development.

About the author

Dav Gra is interested in the latest trends of technology and education, as well as collaborative software which allows teams to work together in real-time on projects.  This online flowchart tool, which also serves as free org chart software, enables teams to make and share flowcharts, mind maps, org charts, UML diagrams, and many other types of diagrams.

Processing your request, Please wait....