1,499 articles and 10,465 comments as of Saturday, April 17th, 2010

Monday, April 12, 2010

SharePoint Themes – More than Pretty Colors – Information Architecture

Guest Author: Peter Allen
BitsOfSharePoint

There are many issues to deal with when creating the Information Architecture for a SharePoint site.  One of those challenges is making sure that users understand where they are within the SharePoint deployment.  As humans we rely on our senses to help us orient where we are.  One of those five senses is sight/visual cues.  Visual cues can be a critical aspect of how we identify where we are or what to do.  So let’s explore how we can use visual cues to help identify what type of site a user is on in SharePoint.

Within visual cues, color, is a powerful medium.  Today we use color in many ways.  For example stop lights use of color is second nature, and we all know what GREEN, YELLOW and RED mean.  We use color for fire and police.  We use color for sport teams.  Color is used a lot to help distinguish groups, actions or purpose.


Something that SharePoint provides out of the box is themes.  You get 18 different themes, color schemes, available to use right away.  Most implementations use themes to provide a different color then the standard blue for their whole deployment.  But we are going to use Themes in a whole different way.

Before we get into using themes we must setup the scenario of the SharePoint implementation we are talking about.  So, we are working with ABC Company that has a decided they need to share trusted and published information to all employees, they need areas for their departments to collaborate and they need an area where they can have projects that utilize cross functional teams.  So we have 3 major areas for this site.  We have the following:

  1. Intranet
  2. Work Groups
  3. Projects

Below is a high level diagram showing the SharePoint Information Architecture. 


Now that we have SharePoint implementation with structure let’s begin to talk about how themes can help users relate and identify where they are in this implementation.  Let’s get back to the example with the stop light. Color helps tremendously with knowing if you can go, need to slow down or stop.  When you look at a stop light you do not think if the color is on top, middle or bottom and have not memorized that a location of the light means something.  Image if color was taken out of stop light.  Difficult to know which light means what.  Does the top light mean stop or go?





vs.


So let’s translate this into a SharePoint implementation.  Most SharePoint implementations do not follow the way we implemented a stop light,  they give the same theme (color) to each major group of sites.  It all begins to look the same and users get lost as to where they are and what the content is used for. 

Below is my example of the standard implementation of SharePoint today and the classic stop light without color. When you look at each one of these three sites they all look the same.  If you look closer, you will see that one says Intranet, another Department A, and the third Projects.  All of these have very different uses, the content is different and who can access is different.  But they do not look different at all, so to a user they must be the same.


Now take look at the version below where we have applied themes to each of the three major groups.  Intranet gets a blue theme, Projects gets a red theme, and Departments gets a green theme.


Now users will begin to understand the different areas of their SharePoint deployment and understand when they are in the Intranet, in a project site or in their department area.  You will be amazed at how users will be able to find information easier when they know where they are.  They will search in the right areas and understand that they are in the wrong area to even look for the content they need. 

One thing to avoid is too much use of color. If themes not only get applied to groups, but also different themes are used within the groups it can become very confusing and get you right back to the problems you had with a single theme. 

Again this is part of your Information Architecture and governance.  Using themes to identify the group that a user is in will improve usability, help the user to association the type of information to be found to color, how to use that information, and better understanding how their SharePoint implementation is designed.

Using themes is something that can be done out of the box and is as simple as defining what theme will be applied to what groups.

Hope this helps and enjoy.
Peter

Guest Author: Peter Allen
BitsOfSharePoint

Peter Allen is President of BitsOfSharePoint Consulting LLC, based in Sacramento, CA. He has worked in the technology field for 15 years creating and deploying solutions in Healthcare, financial, construction, municipalities, telecom, and engineering firms.  He provides solutions that address site architecture, taxonomy, useability and findability.  He also speaks at SharePoint community events and blogs at his SharePoint site http://www.bitsofsharepoint.com.

 

Please Join the Discussion

6 Responses to “SharePoint Themes – More than Pretty Colors – Information Architecture”
  1. Caleb says:

    Completely agree with you. Unfortunately, marketing and branding people in an organization often require the same look throughout at the expense of usability.

    • Brandon says:

      That’s a good point, Caleb. I do recognize the value in visually-indicating what area the site user is in, but the look-and-feel is often a lot more locked down than to allow for different colors for different sites. There’s a downside to different color themes, and that is that the user may be confused as to whether they are still on the same site and can get back to the site they were just using.

      SharePoint 2010 offers an interesting opportunity here with visual indicators while keeping the branding that your marketing and communications department insists on and without throwing the user for a loop. That opportunity is the ribbon, which appears fixated at the top of each page. We can style the ribbon via the site theme or custom CSS such that the ribbon changes colors to visually indicate what type of site the user is on. In Peter’s example, an Intranet site gets a blue ribbon, a project site gets a red ribbon, and a department site gets a green ribbon. The branding of the primary part of the page remains the same.

  2. Dave says:

    Agree with both you and Caleb. Tried same with a rather large multinational client and was buried by marketing minions who felt they needed to enforce the core corporate look and feel jsut to please overseas management despite the style guide clearly providing similar alternatives to what I’d proposed. Afterall as a good consultant i did read the style guide.

  3. Seb Matthews says:

    Great article! Peter’s initial point and the points of the follow-ups are all right on the money in relation to both the usefulness of visual identifiers (such as color) to simplify the user experience and the insistence of communications/brand teams to mandate corporate styles and themes.

    As with many questions raised, such as this, I find that the clue to the answer is often in the question:

    For sure, a high percentage of “corporate” (think, “enterprise”, “multi-national”, “big” (!)) intranets will have strong mandate for maintained brand look and feel which can rarely, if ever, be circumvented to the benefit of the user community.

    The reality is that a huge percentage of intranets are within SME or mid-tier organisations and thus less likely to attract interferance from the branding folks (assuming they even have branding folks), in these scenarios, Peter’s thinking is, IMHO, spot on.

    The entire mentality of SME and mid-tier businesses tends to be more “hands-on” and “can-do” and less focused on management of a brand across their systems. The prevalence of (SharePoint) intranets that are employing basic or out-of-the-box look and feel / themes means that the application of distinct purposed colour schemes can greatly improve the user experience at a great price point providing great bang for buck and increased user adoption and understanding.

    More of the same please sir!

  4. Xene says:

    I just brought this idea to the table in IT this morning! Same discussions at the table with potential Marketing concerns. There are hundreds of examples out there to support the idea of being able to use color to enhance user navigation, but they don’t take anything away from the company branding if done well. The 2010 solution sounds perfect, my suggestion was to minimize the color, in a ribbon, but to carry right through into all documents, policies, wiki content, so that search results would not be confusing (as they currently are!) A touch of little color is all that is needed in some instances.

Trackbacks

Check out what others are saying about this post...
  1. The World Runs on Software; SharePoint Development with Visual Studio 2010; Google Docs Promises Faster Service…

    Top News Stories Sam Gazitt: SharePoint and Office Development with Visual Studio 2010 (Channel 9) Many…




Notify me of comments to this article:


Speak and you will be heard.

We check comments hourly.
If you want a pic to show with your comment, go get a gravatar!