SharePoint : développeur vs designerSharePoint Saturday – MONTRÉAL8 février 2014 – February 8th 2014

Merc i à nos commandi ta i res !Thanks to our sponsors !

Il était une fois une designeuse

Sandrine Garcia Graphiste / intégratrice

Web/SharePoint Ergonome en herbe Travailleur autonome sandeedesign@gmail.com

Il était une fois un développeur

Vincent BIRET @baywet

Développeur SharePoint Négotium SharePoint Geek http://bit.ly/vincentb vbiret@outlook.com

Designer « moyen »

http://dribbble.com/shots/1337078--animated-Designer-vs-Developer

Le monde des designers et celui des développeurs

La voiture du développeurLa voiture du designer

Objectifs / Enjeux

Pourquoi avoir des Développeurs et Designers qui s’entendent?

Projets plus finis Synergie d’équipe Plus heureux au travail Plus efficaces

Agenda

Le Monde des Designers

Le Monde des Devs

Création produit

Le Monde des designersDesigner

s

Le design n’est pas que du coloriage Esthétique = Cohérence avec une image corporative Ergonomie / Optimisation de l'expérience de

l'utilisateur-> en fonction de son expérience

==> Adoption utilisateur<==

Niveau d’expertise du designer

Print(communication papier)

Web(intégration ou pas)

Rockstar Sharepoint(intégration HTML/CSS/SharePt)

Comment se faire aimer de son designer ? L'impliquer dès la phase

d'analyse Produire des wireframes

FILAIRES (sans éléments de couleurs ou graphisme)

Mettre du vrai contenu dans les Wireframes en variant les tailles de texte / positionnements d'images etc.

Indiquer tous les éléments de survols à designer

Préciser le comportement du site (largeur fixe ? variable ? responsive ? )

Le Designer pourra vous aider aussi pour :

Vos wireframes La méthode des personnas La méthode du tri de

cartes

Le Monde des développeursDéveloppe

urs

Contraintes de développement

Faut que ça marche Fiable Performant Pas de temps pour faire du

« coloriage » Changements incessants

Niveau d’expertise du développeur

Junior(je connais à peine

l’asp.net)Intermédiaire

(j’ai déjà touché à SharePoint)

Rockstar(je t’ai recodé le compilo au

passage)

Comment ne pas se faire détester par son designer? HTML: #id .classes (noms SharePoint?) Pas de style en ligne Sémantique HTML + balisage "propre" (ex: block/inline) Evolution des balises possible ? Autonomie (accès TFS, ghostable) Préparer le terrain (scripts et autres outils) Aviser si le balisage change en cours de travail Parler le même langage!!!!

Ghoster en librairie

Types de déploiements Hive Contenu

Solution : Ghoster les fichiers

Déployer les fichiers partagés

Demo – Ghosting/Code/Scripts

Résultat

Création ProduitProduit

Création d’un produit sur SharePoint Réflexion sur la logique des écrans, la disposition de

l'information

Donner identité à un produit : efficace mais pas marketé, les ventes s'en ressentent

Logos - Suite Office / Adobe

Les icones - Oceanik

Le Bandeau - Oceanik

Design alternatif

Bonnes pratiques

Fournir des captures d’écrans de mise en contexte (pour des icones par exemple)

Communiquer dans le même langage( se faire un lexique ?)

Monkey tests Tests A/B

Conclusion

Ce qu’il faut retenir

Dev’s & Designers = alliés != ennemis Communiquez!!! S’adapter au niveau d’expertise des

personnes Simplifiez vous le travail Bonnes pratiques

Remerc iements / ThanksQuest ions et réponses / Q&A

Merc i à nos commandi ta i res !Thanks to our sponsors !

Visitez-nous! – Visit Us!

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

http://www.facebook.com/groups/206445679432304/ Meetup- http://www.meetup.com/guspquebec/ LinkedIn - http://www.linkedin.com/groups?gid=149597