2. About Me
• SharePoint Consultant
• Developer
• Branding
• Focused on the UI side of things
• Community Involvement
• Speaker
• NJ SharePoint User Group
• SharePoint Saturday NYC organizer
• SharePoint Saturday NJ Organizer
• My SharePoint Blog
• MSDN forums
3. Some New Branding Features
• Composed Looks
• New Theming Engine
• Design Manager
• Support for 3rd party web design tools
• Snippet Gallery
• Device Channels
• Meta Data Navigation
• Image Renditions
4. Composed Looks
• 17 Different Variations
• Incorporates
Master Page * Font Scheme
Theme * Background Image
* required
9. Font Schemes
• Component of Composed Looks
• XML document
• .spfont File
• 8 Font Schemes OOTB
• 7 Font Slots – Title, Navigation, Small-Header, Heading,
Large-Heading, Body, Large-Body
• Can use web fonts
13. Design Manager
• Publishing Feature
• Interface and central hub for managing all aspects of branding
• Allows standard HTML/CSS coders & designers the ability to
produce Master Pages without knowing all the SharePoint
Controls
14. Working with Master Pages
• Using Design Manager
• Upload Assets to _catalogs
• Convert HTML files to master page
• Create a minimal master
15. Snippet Gallery
• Contains ready-to-use components that you can add to pages
(such as web parts and controls)
• Automatically generates HTML for copy / paste into HTML
design files
• HTML can be used by any web design tool
17. Device Channels
• Provides method to specify master page based on device
• Uses user agent string of the device to determine the channel
• Optional can use cookie based
• Max 10 on-premise, 2 SP Online
18. Device Channels
• Provides method to
specify master page
based on device
• Uses user agent
string of the device
to determine the
channel
• Optional can use
cookie based
• Max 10 on-premise,
2 SP Online
20. Device Inclusion Rules
• Generic
• Specific
Device User agent substring(s)
iPhone iPhone
iPad iPad
Android Android
Windows Phone Windows Phone OS
FireFox Firefox
Device User agent substring(s)
iPhone 5.0 iPhone OS 5_0
Windows Surface RT Mozilla/5.0 (compatible; MSIE 10.0; Windows
NT 6.2; ARM; Trident/6.0)
Windows Phone OS 7.5 Windows Phone OS 7.5
FireFox 11.0 Firefox/11.0
21. Device Channel Panel
• Specify content on master page or page layout targeted to a
device channel
23. Managed Meta Data Navigation
• Create totally custom navigation
• Manage Terms in the Site Collection
• Create friendly URLs
24. Image Renditions
• BlobCache must be enabled
• Enable you to render a single image in multiple ways
• Display different sized versions of an image on different pages
in publishing site based on 1 source image
28. Questions?
• Contact Info
• Thomas M Daly
• Company – http://www.bandrsolutions.com
• Website – http://thomasdaly.net
• Twitter - _tomdaly_
• Email
• TDaly@BandRSolutions.com [work]
• Tom.M.Daly@gmail.com [personal]
• LinkedIn
29. Additional Information
• What’s new with SharePoint 2013 site development - MSDN
• See All the new 2013 Looks
• Design Manager – mapping network folder
• User Agent Strings Complete List
• What’s My User Agent detector
• Practical Example of 2013 Branding Exercise
• Intro to the Minimal Download Strategy
• Deploying Composed Looks
30. References
• Overview of the SharePoint 2013 page model
• Changes from SharePoint 2010 to SharePoint 2013
• Plan device channels in SharePoint Server 2013
• Overview of design packages in SharePoint Server 2013