![Page 1: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/1.jpg)
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 2: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/2.jpg)
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 3: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/3.jpg)
1.1 SE PRÉSENTERNom NicolasPrénom JulienÂge 29 ansSexe Oui, s’il vous plaîtTitre Web designer
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 4: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/4.jpg)
1.2 LE TAQUINER« Hey, tu vas kiffer, je t’ai déjà tout converti en CMJN. »
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 5: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/5.jpg)
1.2 LE TAQUINER« J’ai fait toutes les maquettes dans InDesign et je t’ai exporté des PDF avec traits de coupe et fonds perdus. Au cas où. »
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 6: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/6.jpg)
1.2 LE TAQUINER« En ce qui concerne la résolution, je suis parti sur un format A4. 21 x 29,7 quoi. »
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 7: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/7.jpg)
1.3 LE RASSURER« Allez, tout va très bien se passer. Je ferai ça comme un gentleman. »
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 8: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/8.jpg)
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 9: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/9.jpg)
2 .1 AVOIR UN DOSSIER BÉTONEt bien rangé :> Arborescence logique> Préfixes numéraires> Fichiers sources> Sources nécessaires au design> Éléments du client
BONUS > infos.txt
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 10: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/10.jpg)
2 .2 AVOIR UNE MÉTHODEEt un .PSD propre et organisé :> Nommage de TOUS les calques> Dossiers logiques et structurants> Code couleur
Privilégier : > Fonts web> Formes vectorielles> Objets dynamiques
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 11: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/11.jpg)
2 .3 AVOIR SES RÈGLESDes repères bien placésUne grille de mise en page intelligente> Grid systems (960, 1200...)
Pixel perfect> S’inspirer du barbier de Ludacris (photo ci-contre)
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 12: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/12.jpg)
2 .4 AVOIR DU STYLERègles typographiques> Recenser les styles CSS
Nuancier> Lister les couleurs principales
Interactions> état de survol, état actif...
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 13: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/13.jpg)
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 14: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/14.jpg)
3.1 PROGRAMMER UN 1ER RDVAutour d’un verre
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 15: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/15.jpg)
3.1 PROGRAMMER UN 1ER RDVAutour d’un verrePar téléphone
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 16: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/16.jpg)
3.1 PROGRAMMER UN 1ER RDVAutour d’un verrePar téléphoneOu au moins par mail quoi, merde !
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 17: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/17.jpg)
3.2 ÊTRE À L’ÉCOUTEÉchanger des regards complicesÉchanger des points de vuePeut-être même revoir sa copie
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 18: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/18.jpg)
3.3 MAIS PAS TROPDésolé, mais il faut le dire, les intégrateurs sont paresseux.
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 19: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/19.jpg)
3.4 LE FAIRE BOIREL’enivrer de flatteries plus ou moins bien placéesexemple : « J’ai adoré comment t’as indenté ton CSS sur le site de sextoys là... »« T’es comme Jackie Chan, tu fais des feuilles de style en cascade toi-même. »« J’trouve que tu t’intègres vachement bien à l’équipe... »
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 20: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/20.jpg)
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 21: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/21.jpg)
4.1 DONNER TOUJOURS PLUSRessources utiles / fichiers annexes> Liens web, démos, documentations...> Fonts en kit> Patterns utilisés> Icônes vectorielles (ex : SVG)
> Penser à un favicon> JSON pour maps personnalisées (voir mapstylr.com)
LE POMPON > Générer les éléments graphiques en nommant correctement ses calques (à partir d’Adobe Photoshop CC)Fichier > Générer > Fichiers d’image
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 22: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/22.jpg)
4.2 MESSAGES SUBLIMINAUXExprimer son attirance de manière plus ou moins dissimulée> Se servir des styles de texte
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 23: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/23.jpg)
4.2 MESSAGES SUBLIMINAUXExprimer son attirance de manière plus ou moins dissimulée> Se servir des styles de texte> Nommer ses calques avec malice
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 24: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/24.jpg)
4.2 MESSAGES SUBLIMINAUXExprimer son attirance de manière plus ou moins dissimulée> Se servir des styles de texte> Nommer ses calques avec malice> Faire passer son obsession par de la négligence
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 25: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/25.jpg)
4.2 MESSAGES SUBLIMINAUXExprimer son attirance de manière plus ou moins dissimulée> Se servir des styles de texte> Nommer ses calques avec malice> Faire passer son obsession par de la négligence> Cacher des calques bonus sous prétexte d’avoir prévu un Konami code
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 26: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/26.jpg)
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 27: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/27.jpg)
5.1 PRENDRE UNE DOUCHESupprimer le superflu> Dupliquer ses .PSD et les nettoyer pour l’intégration> Fusionner certains calques pour faciliter l’export
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 28: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/28.jpg)
5.2 VÉRIFIER SON HALEINEPetit-checkup de toutes les maquettes> Vérifier que toutes les maquettes ont le même niveau de modifications pour éviter toute confusion
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 29: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/29.jpg)
5.3 SORTIR COUVERTNe passer à l’acte qu’après la validation du clientÇa vous évitera des allers-retours, à moins que ce ne soit ce que vous cherchiez...
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules
![Page 30: Comment coucher avec son intégrateur en 5 étapes](https://reader036.vdocuments.pub/reader036/viewer/2022081404/5592b6231a28ab7d0d8b477b/html5/thumbnails/30.jpg)
nwx.fr | arcangelegroupe.com | lejules.fr02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules