Visio template and stencil for designing SharePoint (MOSS) 2007 portals and sites

Ever since I published a Visio template for SharePoint 2003 solutions two years ago, one question in particular kept coming back: “Do you also have a Visio template for designing SharePoint (MOSS) 2007 sites?” Truth is, I hadn’t, because (a) I stopped designing SharePoint portals and (b) I switched to Axure for prototyping. But thanks to Casey, Dan, Michelle and everyone else asking, I spent some time updating the template and stencil to accommodate SharePoint 2007. And here it is.

The conditions for use are the same as before: The template and stencil are free to use, just don’t re-sell them or distribute them under your own name. Please refer to this article.

Software Requirements

These tools were created for use with Microsoft Office Visio Professional 2003 and 2007. You can publish your wireframes in HTML (’save as web page’).

Download the Visio template and stencil for designing SharePoint (MOSS) 2007 sites (ZIP-file). Store the files in ‘My Documents\My Shapes’.

Using the template

If you open the template in Visio, you will see that there are several pages already there:

• Doc Info: Speaks for itself;
• Site Structure: Empty page to draw a site map or something similar (shapes not included, sorry);
• Home: Here you design your MOSS home page;
• Default: Default foreground page for you MOSS pages;
• BG home: Background for home page
• BG navigation: Background for most other pages.

You can build up the global navigation on the background page ‘BG navigation’. To indicate an active menu item, simply drop an extra tab on the active foreground page and set its status to “Foreground Tab”.

To create wireframes, insert a new page, and make sure the page properties (menu ‘Page Setup’) are set to:

• Type = ‘Foreground’
• Background = ‘BG SPS homepage’.

 

The result is an empty page, but with the background and some rulers that help you positioning webparts on the background.

You will notice that the drawing page size is bigger than the standard paper formats A4 or letter. I created a larger drawing space (A3 landscape) to be able to design 1024×768 wireframes and still have room for annotations on the side. Printing of the page won’t be a problem, because the page is set up to automatically scale to your printer size (landscape).

Using the stencil

The stencil offers some of the basic SharePoint webparts. Simply drag & drop them and customize the list or library. I have included an empty webpart, document library, links list, calendar and some custom list views. To customize a component, you have to ungroup it first. It will lose its connection to the master shape, but that is okay.

Good luck and enjoy!

PS. This is my last Visio template for SharePoint.