DoGo Maps: Reading Them, and What to Do With Them

Node.js 101 - An introduction to Node.js

The DoGo map allows designers to quickly share the information architecture (IA) of a website.

DoGoMapping

This example of Dogo Mapping is courtesy of UX Mag . Each page of the website is represented by an index card, and the lines connecting the cards are potential paths through the website. These index cards represent “Nodes”.

More on Nodes

Each node typically carries five important pieces of information:

  • Name / Description
  • Reference Number
  • Fields
  • Actions (Do)
  • Links (Go)

Actions on the node are meant to be concise statements, such as: “Enter Coordinates” or “Expand Text”.

If each page of your website has a banner with the same set of links, you don’t have to write the same set links on every single card. Instead, you set up a common node.

In this common node, courtesy of UX Mag, we can see the elements that will be part of the upper banner of each page in the website.

By looking at the “Go” section of the node we can infer that we are looking at a weather site.

The next step in DoGo Map construction would be to draw a line connecting each of the links under “Go” to their specific index card.

Did you notice that there isn’t a reference or a link to index 1 on the common node? That’s because index 1 is the homepage, and the user presumably begins at the homepage.

Remember that the common node (index 0) does not pertain to a stand-alone web page but rather describes a web banner that is part of every page on the site.

Because of this, the common node and the home page node are typically near the physical center of a DoGo Map.

Contrary to the go-links of the common node, which are accessed by each page, the go-links on the homepage are unique to the home page individually.

DoGo mapping allows both the development team and the quality assurance team to communicate the needs of a website without ever having to power-up a computer.

If the quality assurance team wants to add a homepage link to (for example) Product Reviews, which has an index card referenced at 4, they can briefly mention to the developers “Link node 4 to node 1”.

Reading a DoGo Map

Here we have a DoGo Map, but we can’t read the index nodes.

We can quickly gather that the node without any arrows connected to it is the common node referenced at 0. In this example, we placed a blue arrow above it.
The node just below the common node is likely the home page referenced at 1.

On the right edge of the DoGo Map, we can see a column of nodes that are streamlined into direct travel. In other words, once the user enters this path, the only “Go” links are ones that take the user further down this path.

We can infer that this streamlined path is for a secure purchase or for some sort of registration. Not only that, but we can see that in order to access this streamlined path via the homepage (not using the banner/common node), the user must travel through three links.

If a member of the design team wanted to express the opinion that you cannot expect a user to travel across three pages en route to a secure purchase or registration, they could non-verbally express this by drawing an arrow connecting the homepage to the first index card of the streamlined path.

Without being able to read the index cards, we were able to identify the common node, the home page, and even offer improvements on the site structure.

This type of communication between the design team and the development team is what makes DoGo Mapping such an effective tool. During the earliest stages of web development, DoGo Mapping can be used as a tool to brainstorm the structure of the site.

Through the software development lifecycle, just by moving around the index cards and drawing new lines, both teams can discuss alternative structures to the current model. The same index cards could potentially live through multiple builds of the same site.