les icônes : qui sont-elles ? quelles sont leurs pictos ?

Les icônesQui sont-elles ? Quels sont leurs pictos ?

Sébastien Desbenoit

« Bon jour ! »

Sunrise designed by Adam Whitecro! from The Noun Project

Réagissez sur Twi!er Desbenoit

Il était une fois

Les horribles Cerne!es designed by Tim Berners-Lee

Et ils furent heureux toutau 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

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

pictogramme+ style+ contexte= icône

Les pictogrammesmais qu’est-ce que c’est ?

Des formes

qui transme!ent 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é

Sècheresse designed by United Nation OCHA

Équilibre graphique

Femme enceinte, Famille designed by United Nation OCHA

Cohérence

Identi"able

Energie renouvelable designed by Luis Prado from The Noun Project

Lisibilité

Avalanche designed by United Nation OCHA

Death Star designed by Andrew Forrester from The Noun Project

(Contexte)

Light bulb designed by Jean-Philippe Cabaroc + Person designed by Antonis Makriyannis from The Noun Project + adaptation

pictogramme+ style+ contexte= icône

Retourvers 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 »

Angel designed by Luis Prado from The Noun Project

Norman (celui qui ne fait pas de vidéos), 1990

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

Quelqu’un, quelque part, un jour, mais ce n’est pas la peine qu’il se dénonce.

« Trop bien, me!onsplein d’icônes ! »

Les icônes, c’est mal

Devil designed by Luis Prado from The Noun Project

Devil designed by Luis Prado from The Noun Project

« Me"ons encoreplus de contenu ! »

A"ention 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

Les étique"es, 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

Cupcake Cookies Meringue Pain d’épices

Placer les étique"es

étique"e

étique"e

étique"e

Rythmer : oui !Illustrer : non !

Paycheck from Icon"nder & 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

Paycheck from Icon"nder & Angel & Devil designed by Luis Prado from The Noun Project

Di#érencier les icônesdes illustrations

Cookbooks.com & Angel & Devil designed by Luis Prado from The Noun Project

Di#érencier les icônesdes illustrations

Ce n’est pas le visuel quifait 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

« - Je t’aime. - Ce n’est pas réciproque. »

Partager

Share designed by Thomas Le Bas from The Noun Project & Devil designed by Luis Prado from The Noun Project

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

1. Signi"cation2. Choix 3. Test 4. Go / No Go

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 Icon"nder & Devil designed by Luis Prado from The Noun Project

Travaillez en taille réelle !

Paycheck from Icon"nder & 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 Merri"eld, 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 justi$é ?

Montrer la navigation ?

Cheeseburger ?

Montrer la navigation ?

Géolocalisation

Télécharger ?

Download designed by Unknown designer, Pedro Lalli, Cody Lawson, Adam Whitecro# from The Noun Project

Enregistrer ?

Floppy disk designed by Venkatesh Aiyulu & Download designed by Pedro Lalli, Cody Lawson, Adam Whitecro# from The Noun Project

Ce qui compte, ce sont les utilisateurs

Nous avons besoinde standards.

ISO : 65+ / 10-

ANSI : 80+ / 10-

W3C : Ø

« Merci ! »

Sébastien Desbenoit

Quelques sources> Cognitive artifacts. DA Norman - 1991

> The design, understanding and usage of pictograms, Tijus, Barcenilla, Cambon de Lavale#e 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 subtlepa#erns.com

> Police : Rooney par Jan Fromm

> Marie-Cécile Paccard, Nathalie Rosenberg pour la relecture & Thomas Zilliox pour le test dans le TGV

« Des questions ? »

Sébastien Desbenoit

Les icônesQui sont-elles ? Quels sont leurs pictos ?

Sébastien Desbenoit