aOS Aix-en-Provence6 septembre 2016

Efficacité projet sur les intranets avec design en O365Sébastien PAULET @sp_twit

aOS Aix en Provence 06 sept. 2016

Présentation du conférencier

• 10 ans d’expérience en ECM, presqu’autant en SharePoint• Support, dev, fonctionnel, Scrum Master, formateur, CdP, Dir proj’• Quelques dizaines de consultants formés, coachés, cocoonés• Quelques très beaux projets à son actifs et aussi

des échecs qui ont été l’occasion d’apprendre• Très sensibles aux questions d’agilité, efficacité, ROI

aOS Aix-en-Provence

6 septembre 2016

Posons le sujet…

aOS Aix en Provence 06 sept. 2016

Intranet

-> canal de communication top-down interne

Do not include GED, collaboratif

Includes Point d’entrée du SI, d’un service ou d’une activité, design attrayant, SSO, moteur de recherché, (multilinguisme), (RSE), (responsive)

aOS Aix en Provence 06 sept. 2016

Mécanisme CMS de SharePointMasterPage

CSSLayout

Page

aOS Aix en Provence 06 sept. 2016

Problème

Sur O365 (SAAS) Custo de la Masterpage bloque les montées de futures fonctionnalités

OnPremise MasterPage figée dans le cas d’environnement mutualisés

Risque dans tous les casProjet à forte composante graphique / artistique et à très forte visibilité

aOS Aix-en-Provence

6 septembre 2016

Conseils et méthode pour mener le projet

aOS Aix-en-Provence6 septembre 2016

Comment manger un éléphant?…Une bouchée après l’autre

aOS Aix-en-Provence6 septembre 2016

Amorcez

Que voulons nous avec cet intranet?

Que veulent en obtenir nos visiteurs?

aOS Aix-en-Provence6 septembre 2016

Etude du besoin

PERSONNES CONTENUS

FONCTIONALITES FLUX

FLUXELMT GRAPHIQUES

aOS Aix-en-Provence6 septembre 2016

There is nothing so useless as doing efficiently that which should not be done at all.Peter Drucker

aOS Aix-en-Provence6 septembre 2016

Priorisez et collez au standardImportant

Facilité

aOS Aix-en-Provence6 septembre 2016

Un Tiens vaut, ce dit-on, mieux que deux Tu l’auras ;

Investissement ($)

Temps

Projet

clas

siqueProjet Agile

La Fontaine

aOS Aix-en-Provence6 septembre 2016

Faites vos wireframes en collant au standard

aOS Aix-en-Provence6 septembre 2016

A good designer finds an elegant way to put everything you need on a page A great designer convince you half that sh*t is unnecessaryMike Monteiro

aOS Aix-en-Provence

6 septembre 2016

Outils & techniques

aOS Aix-en-Provence6 septembre 2016

Outils #1Police, couleurs, fond Composed Looks et Tiles

Si ca ne suffit pas SP Palette Color Tool

aOS Aix-en-Provence6 septembre 2016

Outils #2Contenu statique avec mise à jour ou dashboard/KPIVisio ou Excel online / Power BI

Contenus statiques ou données externesContent Editor WebPart avec source HTML ou IFrame

aOS Aix-en-Provence6 septembre 2016

Outils #3Affichage de liste de contenus simple Content Search Web Part + Display Template (HTML, CSS, voire JS)

Affichage de contenus avec sources multiples, navigation complexe Cross site publishing

Si besoin des fonctionnalités de contribution WP de liste + JS Link

Source

aOS Aix-en-Provence6 septembre 2016

Outils #4

Modification du rendu global CSS

Et besoin d’injecter du contenu Injection JavaScript

Source

aOS Aix-en-Provence

6 septembre 2016

Et si ca ne suffit pas

aOS Aix-en-Provence6 septembre 2016

Aller plus loin

Regarder l’existant en JS / Jquery présent sur internet #SharePoint #Javascript

nSPTilesCodePlex (52)Github (653) et PnP

aOS Aix-en-Provence6 septembre 2016

Coming soon

Modern team site Responsive new UX + new WebParts

aOS Aix-en-Provence6 septembre 2016

Coming soon

SharePoint Framework #SPFx (Preview) JS/TypeScript integrant Angular JS, React et autres (voir http://blog.mastykarz.nl)

Exemple : Photopile par @olivierCà retrouver au MS Experience’2016le 05/10 avec @gbouveret

aOS Aix-en-Provence6 septembre 2016

Je veux être libre de la mise en page et ai compris le risque de custo la MPNe réinventez pas la roueBusiness.O365StarterIntranet en cours d’approbation dans PnP(by @FranckCornu himself)

Navigation, recherche, responsive design et gestion du multilinguisme sous stéroïdes et exemple de WP et display templates

aOS Aix en Provence 06 sept. 2016

Conclusion

Guidez, cadrez, soyez carré

Priorisez, épurez et challengez les besoins

Itérez en collant au standard

aOS Aix en Provence 06 sept. 2016

aOS Aix-en-Provence

6 septembre 2016

Merci à nos sponsors !

aOS Aix-en-Provence6 septembre 2016

@aOSComm