Die Evolution von SharePoint




2001        2003         2007




2010        2013


                            Veranstalter
Die Ebenen des Branding



 Standard UI         Themes             Design Manager Master Pages

> Aufwand: 0      > Aufwand: wenig       > Aufwand: mittel   > Aufwand: hoch
> Skills: wenig   > Skills: SP-Standard> Skills: HTML + CSS > Skills: SP + HTML
                                                              + CSS + ASP.NET



                        Einheitliche Plattform + Standards




                                                              Veranstalter
Minimale Download Strategie
          (MDS)
Demo
MDS in SharePoint 2013
Die Ebenen des Branding



 Standard UI         Themes             Design Manager Master Pages

> Aufwand: 0      > Aufwand: wenig       > Aufwand: mittel   > Aufwand: hoch
> Skills: wenig   > Skills: SP-Standard> Skills: HTML + CSS > Skills: SP + HTML
                                                              + CSS + ASP.NET



                        Einheitliche Plattform + Standards




                                                              Veranstalter
Themes (Composed Looks)




                      Veranstalter
Veranstalter
Demo
Themes und Composed Looks
Die Ebenen des Branding



 Standard UI         Themes             Design Manager Master Pages

> Aufwand: 0      > Aufwand: wenig       > Aufwand: mittel   > Aufwand: hoch
> Skills: wenig   > Skills: SP-Standard> Skills: HTML + CSS > Skills: SP + HTML
                                                              + CSS + ASP.NET



                        Einheitliche Plattform + Standards




                                                              Veranstalter
Design Manager

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




                                     Veranstalter
Neue Design Tools

• SharePoint Designer 2013 ist
  kein Muss mehr (kann aber
  verwendet werden)
• Master Page Gallery kann via
  WebDAV geöffnet werden
• Bearbeitung mit beliebigen
  HTML Tools




                                 Veranstalter
Einfache HTM




               Veranstalter
Veranstalter
Veranstalter
Snippet Gallery




                  Veranstalter
Demo
SharePoint Design Manager
Die Ebenen des Branding



 Standard UI         Themes             Design Manager Master Pages

> Aufwand: 0      > Aufwand: wenig       > Aufwand: mittel   > Aufwand: hoch
> Skills: wenig   > Skills: SP-Standard> Skills: HTML + CSS > Skills: SP + HTML
                                                              + CSS + ASP.NET



                        Einheitliche Plattform + Standards




                                                              Veranstalter
Branding Projekte planen
   Ziele und      Wireframes und        Designentwürfe
 Anforderungen       Scribbles          und Styleguide




                    Master Pages,
  Webparts und
                    Page Layouts        HTML-Gerüste
    Controls
                  (inkl. Platzhalter)




                                          Features,
  Optimierung,
                    Testing & QS        Solutions und
 Nachjustierung
                                         Deployment




                                                Veranstalter
Wireframing




              Veranstalter
Wireframing Tools

•   Blend + Sketch Flow for Visual Studio 2012


•   Balsamiq Mockups


•   Microsoft Visio 2013

•   …

                                            Veranstalter
Demo
Wireframes umsetzen
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!

                                           Veranstalter
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




                                           Veranstalter
Demo
Mobile Ansichten umsetzen
Die Ebenen des Branding



 Standard UI         Themes             Design Manager Master Pages

> Aufwand: 0      > Aufwand: wenig       > Aufwand: mittel   > Aufwand: hoch
> Skills: wenig   > Skills: SP-Standard> Skills: HTML + CSS > Skills: SP + HTML
                                                              + CSS + ASP.NET



                        Einheitliche Plattform + Standards




                                                              Veranstalter
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

•   Besuchen Sie BrandMySharePoint.de
    http://www.brandmysharepoint.de


                                                    Veranstalter
Veranstalter
Fabian Moritz
       ITaCS GmbH
       MVP SharePoint Server

Fabian.Moritz@itacs.d
e
http://www.itacs.de
http://sharepointcommunity.de/fabianm
@FabianMoritz




                                        Veranstalter

Brand My SharePoint

  • 3.
    Die Evolution vonSharePoint 2001 2003 2007 2010 2013 Veranstalter
  • 4.
    Die Ebenen desBranding Standard UI Themes Design Manager Master Pages > Aufwand: 0 > Aufwand: wenig > Aufwand: mittel > Aufwand: hoch > Skills: wenig > Skills: SP-Standard> Skills: HTML + CSS > Skills: SP + HTML + CSS + ASP.NET Einheitliche Plattform + Standards Veranstalter
  • 5.
  • 6.
  • 7.
    Die Ebenen desBranding Standard UI Themes Design Manager Master Pages > Aufwand: 0 > Aufwand: wenig > Aufwand: mittel > Aufwand: hoch > Skills: wenig > Skills: SP-Standard> Skills: HTML + CSS > Skills: SP + HTML + CSS + ASP.NET Einheitliche Plattform + Standards Veranstalter
  • 8.
  • 9.
  • 10.
  • 11.
    Die Ebenen desBranding Standard UI Themes Design Manager Master Pages > Aufwand: 0 > Aufwand: wenig > Aufwand: mittel > Aufwand: hoch > Skills: wenig > Skills: SP-Standard> Skills: HTML + CSS > Skills: SP + HTML + CSS + ASP.NET Einheitliche Plattform + Standards Veranstalter
  • 12.
    Design Manager • NeuesUI Management Tool • Erstellung, Bereitstellung und Verwaltung von Design- Elementen • Einfache Master Page- Generierung mit beliebigen Tools • Export und Import Veranstalter
  • 13.
    Neue Design Tools •SharePoint Designer 2013 ist kein Muss mehr (kann aber verwendet werden) • Master Page Gallery kann via WebDAV geöffnet werden • Bearbeitung mit beliebigen HTML Tools Veranstalter
  • 14.
    Einfache HTM Veranstalter
  • 15.
  • 16.
  • 17.
    Snippet Gallery Veranstalter
  • 18.
  • 19.
    Die Ebenen desBranding Standard UI Themes Design Manager Master Pages > Aufwand: 0 > Aufwand: wenig > Aufwand: mittel > Aufwand: hoch > Skills: wenig > Skills: SP-Standard> Skills: HTML + CSS > Skills: SP + HTML + CSS + ASP.NET Einheitliche Plattform + Standards Veranstalter
  • 20.
    Branding Projekte planen Ziele und Wireframes und Designentwürfe Anforderungen Scribbles und Styleguide Master Pages, Webparts und Page Layouts HTML-Gerüste Controls (inkl. Platzhalter) Features, Optimierung, Testing & QS Solutions und Nachjustierung Deployment Veranstalter
  • 21.
    Wireframing Veranstalter
  • 22.
    Wireframing Tools • Blend + Sketch Flow for Visual Studio 2012 • Balsamiq Mockups • Microsoft Visio 2013 • … Veranstalter
  • 23.
  • 24.
    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! Veranstalter
  • 25.
    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 Veranstalter
  • 26.
  • 27.
    Die Ebenen desBranding Standard UI Themes Design Manager Master Pages > Aufwand: 0 > Aufwand: wenig > Aufwand: mittel > Aufwand: hoch > Skills: wenig > Skills: SP-Standard> Skills: HTML + CSS > Skills: SP + HTML + CSS + ASP.NET Einheitliche Plattform + Standards Veranstalter
  • 28.
    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 • Besuchen Sie BrandMySharePoint.de http://www.brandmysharepoint.de Veranstalter
  • 29.
  • 30.
    Fabian Moritz ITaCS GmbH MVP SharePoint Server Fabian.Moritz@itacs.d e http://www.itacs.de http://sharepointcommunity.de/fabianm @FabianMoritz Veranstalter

Hinweis der Redaktion