Le livre du design et de l'ergonomie pour le développeur
•Télécharger en tant que PPTX, PDF•
1 j'aime•936 vues
Présentation donnée en février 2012 pendant les Techdays par Christopher Maneu et moi-même. La vidéo : https://vimeo.com/88650145. Développeurs, échappez-vous quelques instants de la grisaille quotidienne. Le chef vous propose de vous asseoir à ses côtés pour apprendre ses techniques. Au menu, concentré de techniques ergonomiques, émulsion de couleurs avec sa touche de typographie, et son rizotto de conseils prêt à l'emploi pour les développeurs. Vous pourrez même emporter tous ses conseils chez vous.
Recommandé
Recommandé
Contenu connexe
Similaire à Le livre du design et de l'ergonomie pour le développeur
Similaire à Le livre du design et de l'ergonomie pour le développeur (20)
Le livre du design et de l'ergonomie pour le développeur
- 1. palais des congrès Paris 7, 8 et 9 février 2012
- 2. 07 février 2012 Bewise Le livre de recette du design et de l'ergonomie pour le développeur
- 3. @ocourtois ocourtois.fr Olivier Courtois Responsable BewiseDesign Consultant, Spécialiste UX Toulouse Stand 47
- 4. @cmaneu maneu.net Christopher Maneu Directeur Projet Consultant, MVP Toulouse Stand 47
- 5. Ouverture d’une agence sur Paris ! Retrouvez nous sur le stand 47 Diffuse une expertise novatrice Contribue à l’émergence de logiciels performants et ergonomiques Pure Player Microsoft depuis 1999
- 7. CONSTAT Du webdesign au quotidien
- 8. 2 CAS DE FIGURE Aucun designer Aucun ergonome Equipe avec designer Et ergonome
- 9. Ce n’est pas votre faute !
- 10. PLAN EN 2 ETAPES 1 FONDAMENTAUX Avoir une culture design et ergo 2 VERIFICATIONS Tester votre travail avant de le livrer
- 11. Fondamentaux
- 13. TYPOGRAPHIE 1 Familles Une famille c’est pour la vie, utilisez en moins de trois, respectez les guidelines (typefaces) 2 Serif / Sans Serif Choisissez Sans Serif pour un look résolument moderne 3 Grasse Le contraste d’un simple clic
- 14. TYPOGRAPHIE 4 L’espacement Ajustez vos textes par rapport à la mise en page avec les différents espacements 5 Glyphs et alphabets Toutes les polices ne naissent pas égales.
- 15. COULEURS 1 Ne les choisissez pas vous même Vous risquez une fracture de l’œil 2 Créez des teintes Ne multipliez pas le nombre de couleurs, utilisez des teintes
- 16. DEMO : Typographie et couleurs
- 17. LAYOUT 1 Contraste Si des éléments sont différents, différenciez les 2 Répétition Créez une unité en répétant une caractéristique visuelle 3 Alignement Guidez l’œil de l’utilisateur en alignant les éléments 4 Proximité Regroupez les éléments de même sens, séparez les autres
- 18. LAYOUT Une bonne organisation Cela tient en 3 étapes 1. Connaissez les règles Elles sont très simples 2. Remarquez leurs absences Il faut être en mesure de formuler le problème 3. Appliquer ces règles Vous allez être surpris du résultat ! Une bonne organisation en 3 étapes… 1 Connaissez les règles Elles sont très simples 2 Remarquez leurs absences Il faut être en mesure de formuler le problème 3 Appliquez ces principes Vous allez être surpris du résultat !
- 19. DEMO : Layout
- 20. ERGONOMIE 1 Affordance Caractère intrinsèque d’un objet à nous renseigner sur sa fonction VS
- 21. ERGONOMIE 2 Loi de Fitts Plus c’est grand et proche, plus c’est facile à cliquer
- 22. ERGONOMIE 3 Nombre de Miller 7 (+/- 2)
- 24. 1 Issu de l’expérience Bewise 2 Utilisé par des dizaines de développeurs OUTIL
- 25. ” “Vérifiez et améliorez l’ergonomie de vos applications vous-même avec nos chucklists. Bewise Team
- 27. APPLICATION WINDOWS Utilisez-vous moins de 3 couleurs ? Utilisez-vous moins de 3 polices de caractères ? Votre application se lance en plus de 200ms ? Soyez sur d’avoir un « splashscreen ». Utilisez-vous des tooltips? Parfait à condition que ce soit pour aider vos utilisateurs et non pour palier un problème de place Positionnez-vous sur le premier champ puis vérifiez qu’à chaque appui sur TAB, le focus va sur le bon champ Devez-vous demander confirmation à l’utilisateur? Pour une action fréquente offrez un undo, pour le reste faites le.
- 28. Disponible dès maintenant http://chucklists.bewise.fr/techdays 5min max Gratuit Satisfaction utilisateur
- 29. Q/A Merci
Notes de l'éditeur
- Tout d’abord nous faisons un constat simple. Avec l’avènement d’internet ces dernières années et l’amélioration des technologies web, le webdesign est devenu très populaire. Si populaire que les gens se sont habitués à un confort d’utilisation. Cette habitude est maintenant clairement renforcée par l’amélioration continue de toutes les machines de notre quotidien : que ce soit les pcs, les tablettes, les téléphones ou les consoles de jeux. L’ergonomie et le design sont en passe de devenir des activités indispensables pour la réussite de votre projet, qu’il soit grand public ou pour l’informatique interne d’une entreprise.
- Bien sur nous distinguerons 2 cas de figure : - Les équipes qui ne possèdent aucun designer et aucun ergonome. Le plus souvent les réalisations ne correspondent pas au niveau d’attente du client (l’illustration ci-dessus étant quelque peu exagérée j’en conviens). Qui n’a jamais entendu son client dire « ça ne marche pas » juste parce qu’il ne comprend pas l’écran ?? - Les équipes qui possèdent les compétences nécessaires. Dans ce cas de figure la proposition est souvent à la hauteur des attentes du client, c’est la mise en œuvre qui remet le tout en question. En effet quelque soit le cas de figure le développeur assure l’essentiel du travail et à moins d’avoir une sensibilité prononcée pour les interfaces, il y’a fort à parier qu’il y’aura des soucis d’ergonomie et de design.
- Maisrassurez-vouscen’est pas votrefaute. Vousêtesvictime du cloisonnement entre nos métiers ainsiqu’une formation initialedéficiente… n’abordantmalheureusement pas cespratiquesessentiels.
- C’est pourquoi nous vous proposons un plan en 2 étapes pour partager d’ici la fin de l’heure d’une culture commune en ergonomie et graphisme.
- Nous vous encourageons à prendre conscience qu’un écran que vous développez n’est pas juste un ensemble de fonctionnalités regroupées au hasard dans ce dernier. Il existe plusieurs couches successives à réfléchir et développer.
- Malheureusementce site n’estaujourd’hui plus disponible…