A better information architecture tool

I have never managed to find a tool I like for creating site hierarchies and getting them signed off. However, recently I found something that is definitely getting there.

You wouldn’t think it is much to ask for all. All I want is a simple tool for creating site maps that I can show to the client and get him to sign off on the site hierarchy. Okay so I am actually a bit more demanding than that. I guess my actual list of requirements would be as follows…

  • It has to be easy to use and not have too many unnecessary options that just get in the way
  • It needs to look nice so I can show it to the client and it looks professional
  • I need to be able to print it
  • I need to be to save it in a format that I can easily send to the client
  • In an ideal world I would like to be able to work on it collaboratively but I accept that might be asking for too much.

Sure there are a lot of site tools around but they all seem to fall down on one of above criteria. For example something like Visio or Omnigraffle are great but are overly complicated. There are simpler products out there but to be honest most of the ones I have used just produce damn ugly site maps. There are a few online tools which are pretty simple and produce nice site maps but they always seem to mess up when it comes to printing.

A while back I received an email from a guy who had developed a site map tool called writemaps which he wanted me to mention on the show. I took a look hopeful it would meet my criteria but unfortunately it did not. I wrote a polite email back explaining that I felt there was more work to be done on it before I was willing to endorse it and that was the last I heard from him until recently.

The site has now had a complete overhaul and I have to say I think it is superb. If you share similar requirements to me when it comes to creating a site hierarchy then this tool is for you.

Easy to use

It has a clean simple interface that requires minimum effort to create a site map.

Screen capture of writemap showing the clean user interface

Visually attractive

It has an attractive design which I would be more than happy to show to any of my clients. The only downside is that currently you cannot differentiate between different page types (all pages look the same). However other than that it looks great.

Screen capture of writemap showing the version of the interface without the edit controls

Great printing

Although the printing isn’t perfect yet it is still extremely good. I did encounter some small rendering issues (which I also encountered when zooming) however overall the result is very satisfactory.

Screen capture of writemap print view

Lots of saving options

It allows you to save online, create a backup or even save as XML. Unfortunately it doesn’t save as an image but I guess you can always do a screen capture.

Screen capture of writemap export options


Best of all you can share a site map with somebody else. You can even choose if that the person can edit it or not. Great for showing the client.

Screen capture of writemap's sharing preference window

This is a huge step forward from the version I originally saw and so I suspect things will continue to improve over the coming weeks and months. Also I have only touched on a few of my personal highlights. You can also do many other things like..

  • Add notes to individual pages
  • Associate a page with a live webpage
  • Show or hide branches on complex site maps
  • View the site map as a hierarchical list instead of a tree

If you find yourself having to produce site hierarchies and if you need to get clients feedback on them then this is definitely the tool for you. Best of all it’s free so sign up for an account at writemaps.com

  • Hi Paul,
    Thanks for a great review of WriteMaps. You mentioned some features that you’d like to see implemented in the future so I have a couple of questions/comments related to those.
    You mentioned that all of the pages look the same. If we were to add multiple page types, do you have ideas on what types you’d like to see? I’d imagine the ability to distinguish between a static and dynamic page would be nice, or possibly even file types. Or maybe it could be higher level categories such as blog, ecommerce checkout, etc. Maybe you would add your own image icons per sitemap?
    As for exporting an image, you are right in that there is currently no export option for that. However, many users have an option to save as a PDF from their print menu. I know that at least on Mac, this is natively available, and for PCs there are some plugin options. However, it’s good feedback and we are looking into ways to support this from within the application.
    Thanks again

  • Hi Scott,
    I think you are way ahead of me. Basically all the stuff you listed is the kind of stuff i want. To be honest I am not fussed about adding my own icons. They wouldn’t match what you have done and so would just make things look messy.
    I agree about the exporting too. But not everybody is fortunate enough to have a mac … poor souls ;)

  • This looks really nice.
    Up until now I’ve been using another online tool, Gliffy (http://www.gliffy.com/) a flash based image tool, that also allows you to publish your ‘maps’ online (so useful for distant clients). But it’s more based around UML and flowcharts, so is a little awkward for site maps.

  • @Scott
    It’s great for creating page-hierarchies, but what about when items of content are categorised, perhaps using several parallel category systems?
    For example: an online store might sell sweaters, which you can browse to by either type, price-range, size or colour.
    I think it’s too vague to just say ‘Dynamic page: sweaters’.
    Is there a very simple way to represent this sort of thing on a site map?

  • Jonni,
    Good question. My initial thought is that the details of a page could be in that page’s notes text which is toggled through the blue “i” icons on each page. Of course, that can be limiting depending on the complexity of the page.
    If it is a highly complex page, it could be given a whole section of sub-pages to represent its bits of functionality, in which case some icons for page sub-sections would be handy. Or you could possibly use the URL field to link to a resource that describes the page in more detail if necessary.
    I’d be interested in hearing other users’ thoughts on this too.

  • Scott, different page icons that would be useful to me include:
    – Basic page (like you already have), useful for the typical static HTML page
    – Dynamic page, useful for “generic” non-static pages
    – Feed page, for feeds of any type
    – Text page, useful for news and blogs
    – “Splash” page, useful for tunnel and landing pages
    – Multi-media page, useful for galleries, videos displays, audio files, etc.
    – Community page, useful for pages that rely on user-generated, like a message board or wiki
    – E-commerce page, useful for any page that invites someone to spend money (store, donation, etc.)
    – External link icon, useful when indicating where users are directed to a specific external page/site.

  • Thanks Keith,
    That’s great feedback!

  • Something else occurred to me: I’d like to be able to changed the order of things. For example, perhaps I have both ARCHIVES and ABOUT THIS SITE branching off the home page in that order, but I realized that I’d rather display ABOUT THIS SITE first, to match the way the site navigation will be displayed on the live site.

  • Keith,
    Thanks again. Reordering pages by drag/drop or some other method has been requested by many members. I agree that it would be very handy and hope to implement it in the near future.
    Thanks so much!

  • Hi
    This sounds good – I will have to give it a try. We have been drawing them in illustrator up until now because we haven’t found anything that was any good. Thanks :)

  • Jacki

    This is a great tool but unfortunately I don’t think it’s ready for use at my company. The fact that you can’t reorder pages or easily move pages to a new parent is a big problem, as our clients always have revisions and things often change order. Also the page titles don’t wrap, so longer titles are cut off. The great thing about Visio is the flexibility – and this isn’t there yet. Which makes me sad, because it would save so much time.

  • WriteMaps is pretty good so far, and seems to have lots of potential.
    Personally, I much prefer MindMeister: http://www.mindmeister.com/
    It is directed at building “mind maps” rather than specifically website maps, but it has the features I want, including drag & drop revising. Also, as far as I can tell, it saves the map automatically with every click.

  • @Scott
    From my own perspective, I wouldn’t like to see the different types of pages pre-defined. What I’d like it to have some visual way of distinguishing pages (perhaps with a ket).
    So, for example, I’d like to be able to have “red” pages, “blue” pages and “green” pages. It’d be up to me to define what red, green and blue stood for.
    In some cases, red would stand for a “static page”, but on another site, it might be “photo gallery”.
    If you tie the page types down to “static pages”, “dynamic pages”, “feeds” etc, it wouldn’t give me the flexibility I’d need.
    Also, I’ll add my vote for drag/drop to reorder pages.

  • Thanks so much for all the ideas everyone – I’ve got them on the list to consider implementing.

  • Hi All,
    I’ve just come across WriteMaps thanks to Paul’s excellent podcast.
    I eagerly tried it out this morning on a project that I am working on. First impressions are good, though i would agree with all the points above about reordering. One other thing I noticed was that as I built my sitemap and it therefore got progressively more complex, the tool did appear to dramatically slow down.
    Of course i then did the classic mistake of not saving as i went along so tried to save when it had reached a substantial size (but not huge – about 40 pages). This seemed to take ages and eventually Firefox decided to give up and it crashed. Luckily after a session restore it turned out that the map had actually saved.
    I suspect that you may be guilty of your own success (and Paul’s support) and it is possible that I am not alone in getting in first thing on Monday morning and trying out a new toy. I like the idea of the map saving itself at every click. but similarly, I don’t want it to become incredibly sluggish when the size of the map gets over a handful of pages.
    Scott – I hope this is useful feedback and I look forward to using this excellent tool and its future incarnations.
    Paul – thanks for a great podcast. I just wish you’d get the audio levels between you and Marcus to match ;-)

  • In regards to the audio problem we have made a big decision. From now on both myself and Marcus are going to record the show together in our southampton office. This will really make a difference not only to the audio quality but also to the dynamism of the show.

  • Hi Robin,
    Thanks for your detailed feedback, it is very helpful. I have noticed a lag in Firefox as well, particularly when I have a lot of tabs open. Though I think Firefox has become a bit sluggish lately overall, I am sure there are steps we can take to make WriteMaps a bit more efficient with its resources and I’ll be looking into the issue.
    As for the saving, I’m glad to hear your sitemap was recovered. I wanted to point out that WriteMaps does not save automatically as you work. It did do that in the beta version, but due partly to some users getting confused about it and the large amount of AJAX requests needed, I decided to change to a more standard application menu model. Saving is now done through File>Save/Save As and if you have an unsaved sitemap, WriteMaps will ask you to save before attempting to leave or close your browser window.
    Lastly, Page Reordering: I hear you loud and clear:)
    Thanks again.

  • Sez

    Thanks Paul for this bit in the podcast (I’m a new listener so switch between older casts and newer ones so a little behind). As a producer/project manager I’m currently teaching myself Visio but agree with Marcus that it’s too complex for its own good!
    I look forward to giving Writemaps a go, and thank you Scott for being progressive and willing to listen to, and implement feedback!

  • After trying several online collaboration tools for page hierarchy, from thinkature.com to bubbl.us and conceptshare, I have to say writemaps.com is definitely visually and usabilitywise the most appealing.
    Even though I haven’t got into depth with I have discovered what appears to be an error: If you have to items on level 1 an both have children on level 2 the black line between the two (by two) level 2 items is connected. Thus suggesting all for elements belong to one group.
    Viewed in Opera on Vista.

  • Hi Andrej,
    Thanks for your feedback. I will look into your issue and get back to you.

  • Flemming

    Thanks for the article – that is helpfull