Boxes And Arrows : The Design Behind the Design

It will depend on what the aspect ratio of the images are and how you want to represent them. If you want the images to be legible then you will need a large printable surface area and it could be quite problematic structuring the diagram.

If I were following your intended process I would recommend doing an over all text sitemap/flow diagram first (as a plan), and then either adding keypaths with page references to the screenshots, or if appropriate doing the larger diagram with screenshots included afterward.

But the best solution is to use something like Axure, and building the actual sitemap structure with accompanying images into a prototype.

Some good flow diagram tools are:
*Visio
*Freemind – opensource mind-mapping software
*Adobe Fireworks
*Axure

Hope this helps!

Can I ask, what do you want to achieve by laying out a screenshot of every page? If you’re looking to review the site architecture, layout symbols of the different types of pages, rather than screen shots (eg: a symbol for a content page, a form page).

If you want to review user flows through the site, try doing a linear walkthrough of key user goals—take screen shots, throw them in powerpoint, and write a commentary.

Thanks a lot for the comments, Ezra and Ross!

To Ross:
Our company’s product manager, the design team, and the engineering team would like to review the design of the new website together. There are quite a lot of pages and subpages in our site. We have visual mockups of all the pages, but there maybe differences between the proposed specs and the actual website. That’s why we’d like to capture screenshots of all the pages that were built, and look at every one of them. Do you have any suggestion for us no how this can be accomplished, or what we can do to make this design review easier?

At Plaudit Design (www.plauditdesign.com) we start the planning process with a site map and wireframes which are almost like rough blue prints for every page.

This helps us go through and make sure we hit every feature, all the pages link together, etc.

If you need to capture the pages, you can just print screen, and paste it form the clipboard into Adobe Acrobat Pro. It’s an easy solution.

The biggest thing is to catalog the features and make sure the design company hit them all.

Best of luck!