August 28, 2020
charts and Navigation flows of a Website-diagrams-Resources for building Wire frames-Website Designing No Comments

Resources for building Wire frames,diagrams,charts and Navigation flows of a Website

Resources for building Wire frames,diagrams,charts and Navigation flows of a Website

Resources for building Wireframes, diagrams, charts, and Navigation flows of a Website

– Do you have to draw the mockup or wireframe of a website?


– Do you need to represent a navigation flow?


You already know that before starting any project, the most useful thing you can do is draw what you have in mind . In this way you will have a reference to order the work, to assess the real scope, and to detect the problems that you may encounter. In addition, these schemes will allow you to share the information with the client and with the rest of the team.


These tips and tools can help you:


  1. What type of graph should I make?

Do you have to choose a form of presentation for your data and you don’t know where to start? This compilation of chart types can serve as inspiration.


  1. I prefer to work with pencil and paper

There are people who prefer to work in the traditional way, with pencil and paper. Many times, especially in the start-up phase, it can be faster and more intuitive, and it also does not limit our creativity and imagination: we can draw and write down anything, like in a notebook.


The advantage is that now we do not have to start from a blank paper. Here are some printable templates for you to later complete your wireframes or mockups by hand .



  1. Create online wireframes

– Hotgloo is a very simple and intuitive application that allows you to create wireframes online by dragging the basic elements to the work area: text boxes, combos, form elements, images, etc. You can share the diagrams with your clients and collaborators, and they can comment and edit them. It has a free beta version although, yes, to approve it you have to register.


– Gliffy also allows you to make diagrams online. It goes a little beyond the typical wireframes to design a website. To begin, you select the type of diagram: flow, network, business, user interface, blueprints, etc. Then you can share your work with clients and collaborators. It is a free application.


  1. Question of method

Sometimes, what you need is not a tool, but some basic instructions to organize your work and establish what the connections are between the different elements. Here is a really useful and simple method to design the interface of your website.


  1. Much more

It is clear that there are many other applications on the market – Axure and Visio are perhaps the best known – specialized in creating diagrams.

  1. A little inspiration

And since we are talking about schematic and simplified representations, we can take note of some designs that do a lot with very little: they are single page websites, in which all the content and the entire navigation structure is condensed on one screen.