What's New in Branding SharePoint 2013

1

What is New in Branding SharePoint 2013

Matthew HughesFlucidity Ltd

Who am I?• Matthew Hughes • SharePoint 2010 MCTS, MCITP, MOS

• SharePoint 2007+• Branded SharePoint 2010 Beta• Former SharePoint Trainer• Co-founder Flucidity Ltd• Founder Office 365 UK User Group• Occasional Blogger• Brander? Designer? IT Pro?• A Office 365 & SharePoint Enthusiast?

3

Session Contents

• A History of SharePoint Branding

• Low Effort Branding• Site Icon• Composed Looks

• Medium Effort Branding• Design Manager• Custom CSS

• High Effort Branding• Master Pages / Page Layouts

4

What is Branding?Courtesy of the University of East Anglia

5

SharePoint Branding Through the Ages•SharePoint 2003•SharePoint 2007• SharePoint Designer 2007•Master Pages & CSS

•SharePoint 2010• SharePoint Designer 2010•Master Pages & CSS• XSLT• Page Layouts

7

Low Effort Branding

8

Site Icon

9

Composed Looks

10

Composed Looks

11

Composed Looks

• Themes but actually useable

• Includes Master Page, Colours, Fonts, Background Image, Preview File

• Composed Looks are NOT created with PowerPoint• Defined in XML files

• Note: Create your own Preview File otherwise this will not work

12

Demo: Composed Looks

13

Medium Effort Branding

14

Design Manager

• Remember themes were the focus in SharePoint 2010? Now it’s Design Manager

• SharePoint with publishing enabled

• Create designs outside ofSharePoint

• Use existing design software

Design Manager

• Snippets• Simple Interface• Create a design

using snippetsand HTML editor• Convert design

into SharePointMaster Page• MasterPage and

HTML file joinedtogether

Dreamweaver & SharePoint

Demo: Design Manager

18

Full Effort BrandingEverything Else – Traditional Branding

19

Resources

•What's new in SharePoint 2013 Site Developmenthttp://msdn.microsoft.com/en-us/library/jj163942(v=office.15)

•User Agent Stringshttp://www.useragentstring.com/pages/useragentstring.php

•Starter Master Pageshttp://startermasterpage.codeplex.com

Thanks for attending• Matthew Hughes

• Flucidity.com• @flucidity• matt@flucidity.com• +44 7879 775 365

• Follow me on Twitter @mattmoo2