Comment personnaliser SharePoint à votre image

Benjamin NiaulinGeek SharePoint chez GSoft

@bniaulin

@guspquebec

Ordre du jour

Comment personnaliser SharePoint à votre image

Sponsor du

projet

Dresser une carte du site, de

son architecture et de son

contenu

Wireframe

Réaliser la

maquette

Intégration

SharePoint

Utiliser les

WebParts ou

développer?

Quoi de neuf dans SharePoint 2013?

Sponsor du ProjetSponsor

du Projet

Nécessaire pour les projets de personnalisation d’image Fait avancer le projet Prends responsabilité du projet et des décisions N’a pas besoin de connaître les détails techniques Important d’obtenir sa vision du projet et ce qu’il espère

obtenir grâce à cette personnalisation pour que ce soit mesurable à la fin

Bon d’avoir cette personne de votre côté

Architecture et contenuDresser

une carte du site, de

son architecture et de son

contenu

Carte du site

Architecture et Contenu Ne pas confondre avec l’architecture de la carte du site Définir le contenu qui va se trouver dans chacun des

sites Ex:

Page d’accueil doit contenir : Nouvelles Recherche d’employés Calendrier d’événements Etc..

Une façon de traduire les besoins en contenu dans le site

WireframeWireframe

Donne une idée Placement du contenu de l’architecture Améliorer l’expérience utilisateur sans perdre

de temps dans Photoshop

http: / /www.sp2010.com

Site Actions BreadcrumbUser Name

Image Site Title I Like I tTags & Notes

Home Sub site 1 Sub site 2 Sub site 3 S

Quick LaunchHeader

Doc Library

List

Other Link

Section also functions as ribbon

Outils disponibles Balsami

q Visio

Photoshop

Réaliser la maquetteRéaliser

la Maquett

e

Photoshop Prendre les « Wireframes » pour leur donner le look final

en PSD Donner une liste de ce que vous aimez dans d’autres

sites/design Processus peut être très long

IntégrationIntégration

SharePoint

Intégration Il faut maintenant prendre la maquette Photoshop et la

transformer en code SharePoint Utilisation possible de: Visual Studio, SharePoint

Designer, Dreamweaver Connaissance SharePoint est nécessaire (Master Page,

Page Layouts, etc) Architecture SharePoint de la maquette. Web Part? Dev?

XSLT?

Efforts

Petit Effort• Utilisation

des Thèmes SharePoint

Moyen Effort• CSS pour personnaliser

l’image mais l’HTML reste pareil

• Ex: thèmes gratuits sur http://nothingbutbranding.com

Gros Effort• Page Maitre• Page de Mise-en-

Page• CSS• XSLT• Etc.

Web Parts ou Développement

?Utiliser les Web Parts ou développ

er?

Web Parts Avant de faire du code, regarder s’il n’y a pas une

solution disponible Web Part Requête de Contenu Afficheur RSS Web Part de résultats de recherche Éditeur de contenu Web Part de vues de données

SP2013Quoi de neuf dans SharePoint 2013?

Changement et nouveauté Navigation par métadonnées gérées Modifier le « Look » un peu comme dans WordPress Faire un look par périphériques (iPad, Windows Phone,

Windows Surface, etc) Web Part de recherche de contenu (plus de XSLT

nécessaire) SharePoint Designer sans le designer (ouch) Nouvel outil « Design Manager » pour convertir HTML en

page maitre par exemple. Mise-à-jour du produit SharePoint plus fréquente

Questions?

spbreakfast.com

Visitez-nous!

Site principal – www.sharepointquebec.org Twitter - @guspquebec Facebook -

http://www.facebook.com/groups/206445679432304/