0
Your SharePoint Branding                          ExpertsSharePoint Branding: Change Your Look         Eric Overfield Shar...
Agenda• Introduction and Session Overview• What is Branding?• Branding Options in SharePoint• How Can We Apply Branding to...
Introduction – Eric Overfield, PixelMill• Founder and SharePoint Branding Lead, PixelMill• Working with SharePoint since 2...
What Do We Mean By Branding?• Historically the practice of burning your mark (or brand) ontoyour products• One’s “Brand” b...
Branding and the Web• Act of Applying one’s brand to the web, i.e. Corporate DesignGuidelines• Provide unified experience ...
Why do we Brand SharePoint?
Does this Reflect Your Identity?
How About Now?
What Can Branding Accomplish?• Identifies your site• Consistent experience with other web presence• Drive end user Adoptio...
Branding and SharePoint• SharePoint provides specific ways to apply a Brand• Logo• Themes• Custom CSS• Master Pages• Page ...
Elements of a SharePoint Page• Master Page   • General Site Elements• Content   • Page layouts vs Wiki layout• Theme• Cust...
How Do We Get Started?• Determine your goals and Expectations• Build your team   • Make a plan: More features = More time ...
Gather Your Site Requirements• Talk to End Users – What do they need to do with this site?• What kind of Site Template(s) ...
Multiple Ways to Brand SharePoint• How you are going to Brand depends on   • Foundation or Server?   • Site Template(s) yo...
Minimal Effort• Many useful OOTB options• No coding or SharePoint Designer required• Change the Logo• Apply a Theme• Build...
Minimal Effort Demo
Intermediate Effort• Semi-custom site with some web experience required• Requires some understanding of html and css• Use ...
Intermediate Effort Demo
Maximum Effort• For site that require unique layout• Other options will not cut it• Must have experience in html, css, Sha...
Maximum Effort Demo
Limits?• SharePoint can look like, and do, anything• Really• www.topsharepoint.com
www.ataturkairport.com
www.volvocars.com
www.lutron.com
Tips and Tricks• Use a starter Master Page   • startermasterpage.codeplex.com (by Randy Drisgill)   • blog.sharepointexper...
Tips and Tricks• Books, get them, reference them    • Professional SharePoint Branding and User Interface Design    Wrox P...
The Must Have Tool for Branding            Demo
Summary• Branding SharePoint can be done• Branding SharePoint should be done• Level of customization based on requirements...
What We Didn’t Discuss• Requirements gathering process• Building a mockup of design first• Prototyping design in html with...
Your SharePoint Branding                         Experts      Thank You        Eric Overfieldblog.pixelmill.com/ericoverfi...
SharePoint Branding - Change Your Look
Upcoming SlideShare
Loading in...5
×

SharePoint Branding - Change Your Look

699

Published on

A SharePoint Branding 101 session originally presented at SharePoint Saturday Silicon Valley, June 2012

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
699
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
33
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • Site example 3
  • Transcript of "SharePoint Branding - Change Your Look"

    1. 1. Your SharePoint Branding ExpertsSharePoint Branding: Change Your Look Eric Overfield SharePoint Branding Evangelist PixelMill
    2. 2. Agenda• Introduction and Session Overview• What is Branding?• Branding Options in SharePoint• How Can We Apply Branding to SharePoint?
    3. 3. Introduction – Eric Overfield, PixelMill• Founder and SharePoint Branding Lead, PixelMill• Working with SharePoint since 2004• Web Designer since 1998• Located in Davis, CA• Blog: http://blog.pixelmill.com/ericoverfield• @EricOverfield• linkedin.com/in/EricOverfield
    4. 4. What Do We Mean By Branding?• Historically the practice of burning your mark (or brand) ontoyour products• One’s “Brand” became a trust mark• Brand recognition under many conditions • As in Print, TV, Radio, and Web
    5. 5. Branding and the Web• Act of Applying one’s brand to the web, i.e. Corporate DesignGuidelines• Provide unified experience between web and non-web interaction• Fancy word for Web Design • i.e. The look and feel of the site, fonts, colors, layouts, images, etc
    6. 6. Why do we Brand SharePoint?
    7. 7. Does this Reflect Your Identity?
    8. 8. How About Now?
    9. 9. What Can Branding Accomplish?• Identifies your site• Consistent experience with other web presence• Drive end user Adoption • Improve the User Experience • Make it Personal • SharePoint can be Intimidating • Chance to Improve Features • Distinction between Indifference and Excitement
    10. 10. Branding and SharePoint• SharePoint provides specific ways to apply a Brand• Logo• Themes• Custom CSS• Master Pages• Page Layouts• Javascript (jQuery)• and more
    11. 11. Elements of a SharePoint Page• Master Page • General Site Elements• Content • Page layouts vs Wiki layout• Theme• Custom CSS, Images, JS, etc
    12. 12. How Do We Get Started?• Determine your goals and Expectations• Build your team • Make a plan: More features = More time (Normally) • Based around your goals and plan (the more experienced the team, usually faster)
    13. 13. Gather Your Site Requirements• Talk to End Users – What do they need to do with this site?• What kind of Site Template(s) will be used? • Collaboration, Publishing, Search, etc?• How much effort do you want to put into this?
    14. 14. Multiple Ways to Brand SharePoint• How you are going to Brand depends on • Foundation or Server? • Site Template(s) you plan to use • Time requirements and effort
    15. 15. Minimal Effort• Many useful OOTB options• No coding or SharePoint Designer required• Change the Logo• Apply a Theme• Build a custom Theme • Built in the Browser or in an Office product like PowerPoint
    16. 16. Minimal Effort Demo
    17. 17. Intermediate Effort• Semi-custom site with some web experience required• Requires some understanding of html and css• Use alternative css to apply custom CSS styles• Use SPD to make simple changes to a Master Page
    18. 18. Intermediate Effort Demo
    19. 19. Maximum Effort• For site that require unique layout• Other options will not cut it• Must have experience in html, css, SharePoint Designer, even JavaScript • Experience with Asp.NET a plus as well• Will include custom Master Page(s), custom CSS and custom Page Layouts• Good for: • Public facing sites • Heavily styled Intranet / Extranet sites
    20. 20. Maximum Effort Demo
    21. 21. Limits?• SharePoint can look like, and do, anything• Really• www.topsharepoint.com
    22. 22. www.ataturkairport.com
    23. 23. www.volvocars.com
    24. 24. www.lutron.com
    25. 25. Tips and Tricks• Use a starter Master Page • startermasterpage.codeplex.com (by Randy Drisgill) • blog.sharepointexperience.com/2011/09/09/just-the-essentials- sharepoint-master-pages/ (by Heather Solomon) • jumpstartbranding.codeplex.com (by Eric Overfield)• CSS Reference Chart (by Heather Solomon) • sharepointexperience.com/csschart/csschart.html
    26. 26. Tips and Tricks• Books, get them, reference them • Professional SharePoint Branding and User Interface Design Wrox Programmer to Programmer by Randy Drisgill et al • Practical SharePoint 2010 Branding and Customization aPress by Erik Swenson • Pro SharePoint Designer 2010 aPress by Steve Wright• Make Your Own Versions of Files! Do not Overwrite Hive Files• IE Developer Toolbar and Firebug for Firefox
    27. 27. The Must Have Tool for Branding Demo
    28. 28. Summary• Branding SharePoint can be done• Branding SharePoint should be done• Level of customization based on requirements, time and experience • More experience if helpful, but resources exist• Before you get started, have a plan
    29. 29. What We Didn’t Discuss• Requirements gathering process• Building a mockup of design first• Prototyping design in html without SharePoint• In-depth look at the difference between Site Templates• Branding My Sites or Search• Taxonomy and Governance, yes, they can effect Branding
    30. 30. Your SharePoint Branding Experts Thank You Eric Overfieldblog.pixelmill.com/ericoverfield eoverfield@pixelmill.com @EricOverfield
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.

    ×