Les icônes Qui sont-elles ? Quels sont leurs pictos ?
Sébastien
Desbenoit
« Bon jour ! » Réagissez sur Twitter Sunrise designed by Adam Whitecroft from The Noun Project
Desbenoit
Il était une fois
Les horribles Cernettes designed by Tim Berners-Lee
Et ils furent heureux tout au long de leur vie. Merci Denise Jacobs
Favicon Paris Web designed by Association Paris-Web
Folder designed by Sergio Calcara from The Noun Project
Floppy disk designed by Venkatesh Aiyulu
?
pictogramme + style + contexte = icône Light bulb designed by The Noun Project
pictogramme + style + contexte = icône Light bulb designed by Jean-Philippe Cabaroc
pictogramme + style + contexte = icône Light bulb designed by Jean-Philippe Cabaroc + Person designed by Antonis Makriyannis from The Noun Project + adaptation
Les pictogrammes mais qu’est-ce que c’est ?
Des formes
qui transmettent des idées Cardiology designed by Luis Prado from The Noun Project
Les pictogrammes & l’histoire
Heraldic Eagle designed by David Liuzzo
Athletitcs pictogram - Tokyo 1964 designed by Yoshiro Yamashita
Emergency exit - ISO 7001 designed by Yukio Ota
Les pictogrammes & la qualité
Équilibre graphique Sècheresse designed by United Nation OCHA
Cohérence Femme enceinte, Famille designed by United Nation OCHA
Identifiable Energie renouvelable designed by Luis Prado from The Noun Project
Lisibilité Avalanche designed by United Nation OCHA
(Contexte) Death Star designed by Andrew Forrester from The Noun Project
pictogramme + style + contexte = icône Light bulb designed by Jean-Philippe Cabaroc + Person designed by Antonis Makriyannis from The Noun Project + adaptation
Retour vers le web
Les icônes, c’est bien. Angel designed by Luis Prado from The Noun Project
Accélérer la compréhension Angel designed by Luis Prado from The Noun Project
« Reconnaître une image est plus facile que de lire un texte » Norman (celui qui ne fait pas de vidéos), 1990
Angel designed by Luis Prado from The Noun Project
Favoriser la mémorisation Memory designed by Anne-Marie Nguyen from The Noun Project & Angel designed by Luis Prado from The Noun Project
Faciliter la navigation Shopping Cart designed by Ulrich Pohl from The Noun Project - Angel designed by Luis Prado from The Noun Project
Homogénéiser l’interface designed by UN - OCHA & Angel designed by Luis Prado from The Noun Project
« Trop bien, mettons plein d’icônes ! » Quelqu’un, quelque part, un jour, mais ce n’est pas la peine qu’il se dénonce.
Les icônes, c’est mal Devil designed by Luis Prado from The Noun Project
« Mettons encore plus de contenu ! »
Devil designed by Luis Prado from The Noun Project
Attention aux raccourcis (conceptuels) Meringue designed by Allesandro Suraci from The Noun Project & Devil designed by Luis Prado from The Noun Project
Ceci n’est pas une licorne Meringue designed by Allesandro Suraci from The Noun Project & Devil designed by Luis Prado from The Noun Project
Le contexte, ce parachute Meringue, Cupcake, Gingerbread, Cookie designed by Allesandro Suraci from The Noun Project & Angel & Devil designed by Luis Prado from The Noun Project
Cupcake
Cookies
Meringue
Pain d’épices
Les étiquettes, ces parachutes (bis) Meringue, Cupcake, Gingerbread, Cookie designed by Allesandro Suraci from The Noun Project & Angel & Devil designed by Luis Prado from The Noun Project
Placer les étiquettes
étiquette
étiquette
étiquette
Rythmer : oui ! Illustrer : non ! Paycheck from Iconfinder & Devil designed by Luis Prado from The Noun Project
« Il y a quelqu’un ? quelqu’un ? quelqu’un ? quelqu’un ? »
Devil designed by Luis Prado from The Noun Project
Différencier les icônes des illustrations Paycheck from Iconfinder & Angel & Devil designed by Luis Prado from The Noun Project
Différencier les icônes des illustrations Cookbooks.com & Angel & Devil designed by Luis Prado from The Noun Project
Ce n’est pas le visuel qui fait l’icône, c’est l’usage Cookbooks.com & Angel & Devil designed by Luis Prado from The Noun Project
Incohérence : acte I Devil designed by Luis Prado from The Noun Project
Partager « - Je t’aime. - Ce n’est pas réciproque. » Share designed by Thomas Le Bas from The Noun Project & Devil designed by Luis Prado from The Noun Project
1. Signification 2. Choix 3. Test 4. Go / No Go
L’art de choisir ses icônes Share designed by Thomas Le Bas from The Noun Project & Devil designed by Luis Prado from The Noun Project
Les « packs » d’icônes
IT’S A TRAP
Les « packs » d’icônes
Incohérence : acte II Devil designed by Luis Prado from The Noun Project
« Un hipster dans mon peplum ? mais pourquoi ?» Meringue, Cupcake, Gingerbread, Cookie designed by Allesandro Suraci & Angel & Devil designed by Luis Prado
Pensez au style global ! Meringue, Cupcake, Gingerbread, Cookie designed by Allesandro Suraci & Angel & Devil designed by Luis Prado
Des icônes illisibles Paycheck from Iconfinder & Devil designed by Luis Prado from The Noun Project
Travaillez en taille réelle ! Paycheck from Iconfinder & Angel & Devil designed by Luis Prado from The Noun Project
Les polices d’icônes
Le SVG
Et pour les petits ? Share designed by Thomas Le Bas from The Noun Project
Universalité
Angel designed by Luis Prado from The Noun Project
Barrière de la langue Translation designed by Jeremy Good from The Noun Project
Contexte socio-culturel Gangnam style designed by Arjun Mahanti from The Noun Project
Contexte psychique Mental health designed by Jack Biesek, Gladys Brenner, Margaret Faye, Healther Merrifield, Kate Keating, Wendy Olmstead, Todd Pierce, Jamie Cowgill & Jim Bolek
Une icône “forever alone” ? pensez alternatives
Angel designed by Luis Prado from The Noun Project
Après l’orage Éclair designed by Riyalazi from The Noun Project
Home - page d’accueil
Rechercher
Research designed by John Caserta from The Noun Project
Zoom ?
Research designed by John Caserta from The Noun Project
+ Zoom ?
Research designed by John Caserta from The Noun Project
Listes ?
Paragraphe justifié ?
Montrer la navigation ?
Cheeseburger ?
Montrer la navigation ?
Géolocalisation
Télécharger ?
Download designed by Unknown designer, Pedro Lalli, Cody Lawson, Adam Whitecroft from The Noun Project
Enregistrer ?
Floppy disk designed by Venkatesh Aiyulu & Download designed by Pedro Lalli, Cody Lawson, Adam Whitecroft from The Noun Project
Ce qui compte, ce sont les utilisateurs
Nous avons besoin de standards.
ISO : 65+ / 10-
ANSI : 80+ / 10-
W3C : Ø
« Merci ! » Quelques sources > Cognitive artifacts. DA Norman - 1991 > The design, understanding and usage of pictograms, Tijus, Barcenilla, Cambon de Lavalette and Meunier - 2007 > Pictograms – The New Sliced Bread in Icon Design, Jenny Gemmell - 2012 > We need a standard show navigation icon for responsive web design, Andy Clarke - 2012
Crédits > Texture de fond : Subtle Dark Vertical par Cody L. disponible sur subtlepatterns.com > Police : Rooney par Jan Fromm > Marie-Cécile Paccard, Nathalie Rosenberg pour la relecture & Thomas Zilliox pour le test dans le TGV
Sébastien
Desbenoit
« Des questions ? » Sébastien
Desbenoit
Les icônes Qui sont-elles ? Quels sont leurs pictos ?
Sébastien
Desbenoit