Process Diagrams – How useful are they?

I hate process diagrams. Not because of the purpose they serve, but rather the fact that most of the time, they are out of date and rarely accurate. The worst part is, when you are using one and you see a flaw or update that needs to be made, the process required to update the process details is itself wrong!


So when I was asked to set up a site so somebody could upload some process diagrams, I started twitching. What the Hell??? I was NOT going to facilitate the creation of yet another process repository to store a million Visio diagrams in just so someone else could tick a “delivery” box on a project plan… which got me thinking “How could I set up these processes so that they would be relatively useful?”

My Requirements:

  1. Leverage existing Effort (Visio Diagrams)
  2. Allow updates to happen intuitively
  3. Ensure Updates could be validated by process Owner prior to process change being implemented
  4. Retain Sanity, Avoid visiting priest for an Exorcism (Begone foul Demons!)

Luckily, the client here is licenced for SharePoint 2010 Enterprise (all 10,000 staff)… so I knew that by leveraging Visio Services I could have the diagrams presented in a browser, and I remember reading somewhere that you could connect a Visio Diagram in some way to a list… so if I could tie those 2 pieces of functionality together I could have the following setup:

  • Wiki Pages with Web Part Placeholders, allowing for introductory text to be displayed describing the process (1 or 2 lines)
  • The Visio Diagrams, rendered in the Browser as interactive diagrams
  • When a process step was selected, more details would appear about the step, including
    • Tasks to complete the step
    • Who to contact
    • What system to use (and a link to the system if possible)
    • What Information was required
    • Dependencies, etc
  • The relevant documents or e-forms would appear for the user to fill out
  • Any user would be able to update the
    • Process Steps
    • Process Details
  • Any user could provide feedback on the process (e.g. “The form is incorrect and needs to have another field” etc.)
  • Changes submitted by users would be subject to a review and approval process
  • Other users would only see the changes once approved

Other things that would be good to implement would be “Targeted Individual Approvals” rather than an “Approval Group”, “Auto Escalation” based on Approval timeframes, Anyone having the ability to create a Process, Enterprise Metadata (Folksonomy) tagging of processes etc.

So, first things first –

Preparing the Visio Diagram for use

The way connectivity works between the Visio Diagrams and SharePoint is through the Value of Properties associated with a Shape – Each shape has properties linked to it (called “Shape Data”) – We need to add another data field to the shapes. Selecting all of the shapes,right-clicking one of them and selecting Data –> Define Shape Data brings up a dialog where a new field can be added to the existing fields. Click New, and give the column a name like “LinkedFieldTitle” or something. Leave the rest of the parameters as they are and click OK.


Now open the Shape Data Panel and you will see your new column name appear for each “shape” you select on the original page, like so:


Give the LinkedFieldTitle Property a value that is unique – This is the same value we’ll pass through to the List which will be displayed (filtered to the Title corresponding to the selected Shape) on the same page. Save and publish the Visio diagram as a “VDW” file to the SharePoint library you want.

Back in SharePoint, open up the page you want to assemble and add in the “Visio Viewer” web part to the page. Attach the Visio Diagram you just uploaded to the web part, and get the Zoom and View right. Put the name of your Visio field you want to make available as part of a connection into the field with the second arrow below…


Set up a list called “Process Diagram Details”, containing a “Process Detail Lookup” field (single line freetext, use the Title Field), a “Process Step Detail” field (multiline), a “Process Name” field (so you can filter by all “details” of a specific process in one view) and any other fields that might be useful (we also have a “Contact Group” field, for example).

Add the list view to the page, showing the “Process Step Detail” field, the edit icon and your other fields. So what you have now is something like this…


Now we connect the 2 web parts (in our screenshot, the web parts are called “Event and Alert Monitoring” and “Process Step Details”). This step’s been around since 2007 – Switch to page edit mode, and pass the value from your Visio Shape property to your list row


Now when you click on the items in the Visio diagram, the process step details appear on the right of the page (from the details list). I’ve used this trick to “hide” the “There are no items to display” message from the list, to try and prompt the user to do something with the diagram.


  • Get the positioning, size, zoom, web part width and “Visio tab” of the diagram set up before trying to do anything else. This stuff can be fiddly, but once it’s configured and saved, it’ll “stick”.
  • When you “send” shape data from the Visio web part to another web part, it pushes the data over by refreshing / reloading the page… and every time you click on a shape, it sends the data to the list… so if you have a “drill – through” Visio diagram, you’ll never see the second page because it reloads the page before it’s rendered. It’s a poor design, because using drill-through Visio diagrams in your browser is a cool idea… unless you are linking the diagrams to something else!!
  • You cannot link the same shape data to 2 other web parts (say the list and a filtered document library view)… so the only way is to have 2 separate custom shape data fields, say with the same “lookup string” in both fields. Extra maintenance, effort, etc – eventually we gave up on it.

So what we have is a high-level diagram for people familiar with the process / company… and a way for someone to get more details if they are unfamiliar with the step, or do not have a link or access to the relevant system. That’s half the battle – getting the process published.

So… How do we keep it up to date? What if it’s wrong or some of the dependent systems have changed? Short answer: you don’t! The person who is trying to follow the process is the one most motivated to update it if it’s wrong… so the system we set up for the client allows ANYONE to update the step details!
The updates then get submitted for review and approval by the owner of the process. This is valuable, because the person who updated the list item gets immediate gratification by seeing their changes applied, but the rest of the world sees the old details until it’s approved by the process owner.
Essentially, you are distributing the task of updating the process to the users of the process and “engaging the community” at the same time.



About Brad Saide

I'm a SharePoint consultant. I'm also slowly going bald, seem to have a permanent spare tyre around my waist and enjoy socialising with friends over a beer or 10. The last 2 may possibly be related. Started working with SharePoint when the first version was in limited beta release (participated in the Technology Adoption Program while at Woolworths) and have been committed to the adoption of the technology as a business enabler ever since.
This entry was posted in Uncategorized. Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s