Le document présente une conférence sur le design web par Julien Nicolas, mettant en avant des conseils sur l'organisation des fichiers, la communication avec les clients et des astuces pour une meilleure collaboration. Il aborde l'importance d'une bonne méthodologie de travail, d'une approche créative et de l'attention portée aux détails techniques, tout en ajoutant une touche d'humour. Des recommandations pratiques pour la gestion de projets de design sont également fournies, soulignant l'importance de l'écoute et de l'interaction positive avec les clients.

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

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

3. 1.1 SE PRÉSENTER
Nom Nicolas
Prénom Julien
Âge 29 ans
Sexe Oui, s’il vous plaît
Titre Web designer
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules

4. 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

5. 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

6. 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

7. 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

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

9. 2 .1 AVOIR UN DOSSIER BÉTON
Et 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

10. 2 .2 AVOIR UNE MÉTHODE
Et 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

11. 2 .3 AVOIR SES RÈGLES
Des repères bien placés
Une 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

12. 2 .4 AVOIR DU STYLE
Rè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

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

14. 3.1 PROGRAMMER UN 1ER RDV
Autour d’un verre
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules

15. 3.1 PROGRAMMER UN 1ER RDV
Autour d’un verre
Par téléphone
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules

16. 3.1 PROGRAMMER UN 1ER RDV
Autour d’un verre
Par téléphone
Ou au moins
par mail quoi, merde !
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules

17. 3.2 ÊTRE À L’ÉCOUTE
Échanger
des regards complices
Échanger
des points de vue
Peut-être même
revoir sa copie
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules

18. 3.3 MAIS PAS TROP
Désolé,
mais il faut le dire,
les intégrateurs
sont paresseux.
02/10/2014 - Conférences Web Design #1 Julien Nicolas @lejuuules

19. 3.4 LE FAIRE BOIRE
L’enivrer de flatteries plus
ou moins bien placées
exemple :
« 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

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

21. 4.1 DONNER TOUJOURS PLUS
Ressources 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

22. 4.2 MESSAGES SUBLIMINAUX
Exprimer 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

23. 4.2 MESSAGES SUBLIMINAUX
Exprimer 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

24. 4.2 MESSAGES SUBLIMINAUX
Exprimer 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

25. 4.2 MESSAGES SUBLIMINAUX
Exprimer 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

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

27. 5.1 PRENDRE UNE DOUCHE
Supprimer 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

28. 5.2 VÉRIFIER SON HALEINE
Petit-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

29. 5.3 SORTIR COUVERT
Ne 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

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