Date post: | 05-Apr-2015 |
Category: |
Documents |
Upload: | schwanhild-gemmer |
View: | 104 times |
Download: | 0 times |
Formatvorlage des Untertitelmasters durch Klicken bearbeiten
Platin-Partner: Gold-Partner: Veranstaltungs-Partner: Medien-Partner:
Brand my SharePointGrafische Gestaltung von SharePoint-Webseiten
Fabian Moritz | SharePoint MVP
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
Die Evolution von SharePoint
2003 2007
2010 2013
2001
Minimale Download Strategie (MDS)
DemoMDS in SharePoint 2013
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
Designs (Composed Looks)
v
Farben und Schriften
DemoDesigns in SharePoint 2013
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
• Neues UI Management Tool• Erstellung, Bereitstellung und
Verwaltung von Design-Elementen
• Einfache Master Page-Generierung mit beliebigen Tools
• Export und Import
Design Manager
Einfache HTM
Snippet Gallery
• 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!
Master Pages umsetzen
• Verschiedene “Channels” für mobile Geräte• Definition auf Basis des User Agent Strings• Zuordnung einer Master Page• Spezielle Controls für Channels
Device Manager
DemoSharePoint Master Pages umsetzen
Branding Projekte
Ziele und Anforderunge
n
Wireframes und Scribbles
Designentwürfe und
Styleguide
HTML-Gerüste
Master Pages, Page Layouts
(inkl. Platzhalter)
Webparts und Controls
Optimierung, Nachjustierun
gTesting & QS
Features, Solutions und Deployment
Wireframing
Wireframing Tools
• Blend + Sketch Flow for Visual Studio 2012
• Balsamiq Mockups
• Microsoft Visio 2013
• …
DemoWireframes umsetzen
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
Möglichkeiten des UI Customizings
HTML, CSS, XSLT,
JavaScript
.NET
BrowserSharePoi
nt Designer
Browser Apps
HTML5, CSS3,
JavaScript
.NET
2010
2013
Client Side Rendering (CSR)
• Daten + .JS = HTML• XSLT ist Vergangenheit• Technologien:
JavaScript HTML CSS
• Deployment via App, Solution oder manuell
DemoClient Side Rendering mit SharePoint
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
Und jetzt?
• Laden Sie sich die Präsentation und Beispiele herunterhttp://sharepointcommunity.de/fabianm
• Machen Sie sich mit dem Design Manager vertrauthttp://msdn.microsoft.com/en-us/library/jj822363.aspx
• Nutzen Sie Wireframing Tools während der Planunghttp://www.balsamiq.com
• Beschäftigen Sie sich mit Client Side Renderinghttp://msdn.microsoft.com/en-us/library/jj220045.aspx
• Besuchen Sie BrandMySharePoint.dehttp://www.brandmysharepoint.de
Fabian MoritzITaCS GmbHMVP SharePoint Server
[email protected]://www.itacs.de
@FabianMoritz
http://sharepointcommunity.de/fabianm