In dieser Präsentation geben wir Ihnen einen Einblick in die Möglichkeiten und Grenzen, die SharePoint als Technologie zur grafischen Gestaltung von internen oder externen Webportalen bietet. Von den Standardfunktionen über die Features zur Umsetzung mobiler Portale bis hin zu den Tools und Templates zur Generierung von komplett angepassten Webseiten – dieser Vortrag bietet sowohl für den SharePoint-erfahrenen Anwender als auch für den kompletten Neueinsteiger Wissenswertes über SharePoint 2013 zu berichten.

1. Fabian Moritz | MVP SharePoint Server
Brand My SharePoint – Gestaltung und
Anpassung von SharePoint-Webseiten

3. Die Ebenen des Branding
Standard UI Themes Design Manager
& Master Pages
UI-Customizings
Einheitliche Plattform + Standards
> Aufwand: 0
> Skills: wenig
> Aufwand: klein
> Skills: SP-Standard
> Aufwand: hoch
> Skills: HTML, CSS, SP
> Aufwand: rel. klein
> Skills: SP, JavaScript

4. Die Evolution von SharePoint
2003 2007
2010 2013
2001

5. Minimale Download Strategie
(MDS)

6. Demo
MDS in SharePoint 2013

7. Die Ebenen des Branding
Standard UI Themes Design Manager
& Master Pages
UI-Customizings
Einheitliche Plattform + Standards
> Aufwand: 0
> Skills: wenig
> Aufwand: klein
> Skills: SP-Standard
> Aufwand: hoch
> Skills: HTML, CSS, SP
> Aufwand: rel. klein
> Skills: SP, JavaScript

8. Designs (Composed Looks)

9. v

10. Farben und Schriften

11. Demo
Designs in SharePoint 2013

12. Die Ebenen des Branding
Standard UI Themes Design Manager
& Master Pages
UI-Customizings
Einheitliche Plattform + Standards
> Aufwand: 0
> Skills: wenig
> Aufwand: klein
> Skills: SP-Standard
> Aufwand: hoch
> Skills: HTML, CSS, SP
> Aufwand: rel. klein
> Skills: SP, JavaScript

13. Design Manager
• Neues UI Management Tool
• Erstellung, Bereitstellung und
Verwaltung von Design-
Elementen
• Einfache Master Page-
Generierung mit beliebigen
Tools
• Export und Import

14. Einfache HTM

17. Snippet Gallery

18. Master Pages umsetzen
• 3 Optionen:
– HTML Master Page
– Minimal Master Page
– Starter Master Pages (Codeplex)
startermasterpages.codeplex.com
• Tools
– SharePoint Designer 2013
– 3rd Party Tools
– Browser Tools
• Nicht vergessen: Daten im TFS abspeichern!

19. Device Manager
• Verschiedene “Channels” für mobile Geräte
• Definition auf Basis des User Agent Strings
• Zuordnung einer Master Page
• Spezielle Controls für Channels

20. Demo
SharePoint Master Pages

21. Branding Projekte
Ziele und
Anforderungen
Wireframes und
Scribbles
Designentwürfe
und Styleguide
HTML-Gerüste
Master Pages,
Page Layouts
(inkl. Platzhalter)
Webparts und
Controls
Optimierung,
Nachjustierung
Testing & QS
Features,
Solutions und
Deployment

22. Wireframing

23. Wireframing Tools
• Blend + Sketch Flow for Visual Studio 2012
• Balsamiq Mockups
• Microsoft Visio 2013
• …

24. Die Ebenen des Branding
Standard UI Themes Design Manager
& Master Pages
UI-Customizings
Einheitliche Plattform + Standards
> Aufwand: 0
> Skills: wenig
> Aufwand: klein
> Skills: SP-Standard
> Aufwand: hoch
> Skills: HTML, CSS, SP
> Aufwand: rel. klein
> Skills: SP, JavaScript

25. Möglichkeiten beim UI
Customizing
HTML,
CSS, XSLT,
JavaScript
.NET
Browser
SharePoint
Designer
Browser Apps
HTML5,
CSS3,
JavaScript
.NET

26. Client Side Rendering (CSR)
• Daten + .JS = HTML
• XSLT ist Vergangenheit
• Technologien:
– JavaScript
– HTML
– CSS
• Deployment via App, Solution
oder manuell

27. Demo
Client Side Rendering

28. Die Ebenen des Branding
Standard UI Themes Design Manager
& Master Pages
UI-Customizings
Einheitliche Plattform + Standards
> Aufwand: 0
> Skills: wenig
> Aufwand: klein
> Skills: SP-Standard
> Aufwand: hoch
> Skills: HTML, CSS, SP
> Aufwand: rel. klein
> Skills: SP, JavaScript

29. Und jetzt?
• Laden Sie sich die Präsentation und Beispiele
herunter
http://sharepointcommunity.de/fabianm
• Machen Sie sich mit dem Design Manager vertraut
http://msdn.microsoft.com/en-us/library/jj822363.aspx
• Nutzen Sie Wireframing Tools während der Planung
http://www.balsamiq.com
• Beschäftigen Sie sich mit Client Side Rendering
http://msdn.microsoft.com/en-us/library/jj220045.aspx
• Besuchen Sie BrandMySharePoint.de
http://www.brandmysharepoint.de

31. Fabian Moritz
ITaCS GmbH
MVP SharePoint Server
Fabian.Moritz@itacs.d
e
http://www.itacs.de
@FabianMoritz
http://sharepointcommunity.de/fabianm