02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules

02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules

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

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

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

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

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

02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules

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

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

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

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

02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules

3.1 PROGRAMMER UN 1ER RDVAutour d’un verre

02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules

3.1 PROGRAMMER UN 1ER RDVAutour d’un verrePar téléphone

02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules

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

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

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

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

02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules

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

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

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

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

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

02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules

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

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

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

nwx.fr | arcangelegroupe.com | lejules.fr02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules