I'm putting together a document for our Art Directors and Creatives for what works best and what might not work best when designing for a sharepoint site.
Sharepoint obviously lets you customize CSS and use custom master pages, but is there anything in particular that art directors should avoid when designing templates in their PSD?
The biggest problem area I've experienced is the ribbon. It is SharePoint, it can't be removed without removing it's functionality. It can be hidden for anonymous users, but the ribbon itself shouldn't be manipulated. It may end up giving you more headaches than its worth.
Otherwise, go to town!
I think you are taking the wrong approach here. If you can write such a document, it would be extremely valuable to the whole community but havn't you wondered why such a document doesn't exist already?? It's because it will take you forever to formulate. Unless you designers have designed for SharePoint many times before, they're likely to design something that will be hard to build.
Ideally you would hire a specialist supplier (like who I work for) to do the designs for you and yo simply implement them...
Or you sit with your designer and show them what is or isn't possible in SharePoint UI. This will be an iterative process but you will learn something. Perhaps you start playing will the out of the box CSS and see what each style changes.
Either way, SharePoint UI design should be dictated by someone with SharePoint experience and this is what's most likely to save you pain.
There are some points which would be useful.
While designing sites in SharePoint, consider about the master and content page concept for .Net. ie, there should be a common layout, like for a master page, with header, footer and navigation bars. If these things change per sub sites or pages, then additional master pages should be made, which would increase the complexity. So, simply maintain the site with mostly a common look and feel.
As David suggested, Ribbon controls should be taken care of separately. Whether this comes below the company logo strip or below it, permissions on the ribbon. Many things are to be decided.
Also, Art directors can think about having different views for the same page for different users. ie, page design based on user rights.
Try not to mess too much with Ribbon, the Site Actions menu and the Personal Action menu (the link that displays the user name). For instance, drastic changes of positioning of the Site Actions Menu can screw up the display of it's dropdown. Of course, that might be possible to fix with some additional css, but it would take some time.
Regarding Site Designs, Branding, Master Pages, CSS, etc., there are two blogs worthy of mention with posts that are very helpful -
Heather Solomon also has the SharePoint 2010 CSS Reference Chart which is most useful when working with site designs.
One of the biggest issues I've had working with design houses that aren't experienced with SharePoint is the little understanding of what belongs in a masterpage, vs. a page layout, vs. a user control or webpart. More than a few times we've been handed a design with elements that would need to span part of the masterpage and a page layout. Understanding the overall structure of SharePoint as a platform is probably the single biggest area I end up dealing with when working with an outside firm. Often times designs will come back with custom icons for each web part, and the designer doesn't understand the level of manual effort needed to maintain that. Sure you can deliver it that way, but every time the customer goes back and adds a web part they have to manually set those options to maintain that level of look and feel.
The second piece, as others have said before me, is the ribbon. I take the road that color changes are acceptable (ie: the ribbon container bar), and I'll typically set the top bar to a color that matches the rest of the brand, but if you try to set the colors for all of the tab groups you're going too far. Font changes, including size, and structure modifications to the ribbon should be avoided at all costs. Microsoft spent a lot of time and effort in making the ribbon cross browser compatible, and you can easily destroy that capability with some simple structure or CSS modifications.
Aligning with number 1, understanding the budget is also important. We get a lot of elaborate designs back that would be two or three times the branding budget on a project. While SharePoint is largely a clean slate, few companies are going to invest six figures on an internal branding effort. When you start adding the nice design subtleties many of us expect in modern design (like those soft 1px shadows on every element), you introduce A LOT of complexity into SharePoint.
Test, test, test some more. SharePoint is cross browser compatible, and whatever you deliver should be compatible with every browser that vanilla SharePoint is compatible with. Even if the organization is 100% IE, don't rely on that from a branding perspective. It's only a matter of time before folks up on the C-level floor want to use their iPad. I've seen several implementations get bit by the lack of a long term strategy where they brand everything to IE, don't bother to test it, and then learn that nothing renders correctly in Safari (or other standards browsers).
