Hello

Pour cette matinée, je vous propose un documentaire signé PBS Arts sur l’art de la visualisation de données ! Les humains ont une forte capacité à comprendre l’information de façon visuelle. Depuis l’avènement de notre monde de sciences, nous avons utilisé des stratégies visuelles complexes pour communiquer les données, en utilisant souvent des principes de conception qui font appel à ces compétences cognitives de base (rapport d’échelle, couleurs, etc.).

Vous le savez, nous avons de plus en plus de données que nous ne pouvons traiter facilement. La pratique de la visualisation de données prend chaque année de plus en plus d’importance et, de la dataviz scientifique à l’infographie pop-art, les designers sont maintenant en charge de l’intégration des données dans l’expérience des médias.

Ce court documentaire reflète l’état des lieux et nous offre un aperçu des perspectives offertes par la visualisation de données.

Le documentaire

Cliquer ici pour voir la vidéo.

Sources

Par ailleurs, si vous voulez toutes les sources citées dans ce documentaire :

• Facebook World Map .http://gigaom.com/2010/12/14/facebook…
• Paris Subway Activity – Eric Fisher -http://www.flickr.com/photos/walkingsf/
• Rich Blocks, Poor Blocks - http://www.richblockspoorblocks.com/
• « Hurricanes since 1851″ – by John Nelson,http://uxblog.idvsolutions.com/
• « Flight Patterns » by Aaron Koblin -http://www.aaronkoblin.com/work/fligh…
• « We Feel Fine Project » by Jonathan Harris and Sep Kamvar -http://wefeelfine.org/
• « Every McDonald’s in the US -http://www.datapointed.net/2009/09/di…
• « Colours in Culture » -http://www.informationisbeautiful.net…

La visualisation de données indispensable à notre société ? En tous les cas, cela semble difficile de faire sans.

sourceCes articles peuvent aussi vous intéresser:

• Ooops, Facebook n’efface pas vos données !
• Flickr vu du ciel c’est bien, mais de l’espace c’est mieux !
• Visualisation de données sur iPad par Joel Lazano
• L’application « I am rich » sur iPhone… pour (nous) les pauvres !
• DATAVISION de David McCandless, un ouvrage sur la visualisation de données !
• « The Joy of Stats » le documentaire sur la visualisation de données !

[documentaire] L’art de la visualisation de données par… PBS Arts ! est publié originellement sur le blog de graphisme : Graphisme et interactivité blog par Geoffrey Dorne

Si vous dormez seul, à deux, si vous êtes bloggueur, prêtre ou névrosé, vous ne dormez pas de la même façon ! C’est pour cette raison que le site Poorly Drawnlines, et plus précisément son auteur Reza Farazmand (dessinateur de bandes dessinées et écrivain) s’est penché sur la question afin d’illustrer par l’exemple ces différentes façons, avec humour et talent.

Voici donc le guide illustré des positions du sommeil !

Et vous… vous dormez comment ?

sourceCes articles peuvent aussi vous intéresser:

• [Infographie] Comment un bébé va vous traumatiser la nuit.
• Lettrines cyrilliques ornementées
• Et vous à votre designer, vous lui offrez quoi pour Noël ?
• Le guide pratique pour dominer le monde.
• Visualisation de données pour mieux comprendre vos cheveux au réveil
• Absurde mais dessiné ?!

Le petit guide illustré des positions pour dormir ! est publié originellement sur le blog de graphisme : Graphisme et interactivité blog par Geoffrey Dorne

Hello et bon début de semaine !

J’espère que vous vous êtes bien reposé ce week-end et que vous êtes prêts pour une semaine de folie ! D’ailleurs, si vous êtes juste en train de commencer la réalisation d’un tout nouveau site Internet, il est normal que vous vous sentiez submergé par toutes les choses dont vous avez besoin pour comprendre et planifier tout le travail à faire avant même de l’avoir commencé. En effet, dans la création de site Internet, il y a des détails qui valent la peine d’être préparés et autant faire une liste afin que vous n’oubliez aucun d’entre eux.

Pour vous aider à faire votre propre liste, voici une élégante infographie présentant les 26 choses importantes lorsque vous vous mettez en tête de créer un site Internet.

[voir l'infographie en grand]

Dans cette liste je rajouterai :

• trouver qui sera votre lecteur / votre utilisateur
• réaliser un benchmark des sites similaires / concurrentiels
• faire des tests utilisateurs
• …

et vous, vous y rajouteriez quoi ?  

Merci TaniaCes articles peuvent aussi vous intéresser:

• [à garder] Liste des sites pour télécharger des packaging
• [infographie] 12 points pour promouvoir votre blog !
• [infographie] Est-ce qu’il faut VRAIMENT vous faire un site internet ?
• Tout savoir sur l’Internet des objets.
• Créez de belles infographies & datavisualisations gratuitement et en ligne grâce à Infogr.am !
• /!\ Le mème et le hacking de l’attention /!\

26 choses à ne pas oublier avant de créer un site Internet. est publié originellement sur le blog de graphisme : Graphisme et interactivité blog par Geoffrey Dorne

Hello !

Avez-vous déjà eu des difficultés à vous décider dans le choix d’une typo ? La réponse est très certainement oui. Mais comment commencer par choisir une typo ? Pour ma part, je m’intéresse à son époque, sa culture et évidemment sa forme, mais le choix des empattements est également à faire.

Pour faire simple : une typo avec empattements est une typo serif, une typo sans empattements est une typo sans serif

Dans cette longue infographie, vous allez pouvoir découvrir la lutte sans merci entre ces deux héroïnes La conclusion est archi-simple, voir simpliste et donc erronée (dire qu’une typo serif est faite pour l’imprimé et une typo sans serif pour le web est, à mon sens, une bêtise), mais le reste de l’infographie vous permet, pourquoi pas, d’avoir certaines clefs pour appréhender ces deux grandes familles et, par conséquent, faire votre choix

[edit] et pour une analyse bien plus sérieuse c’est par ici

sourceCes articles peuvent aussi vous intéresser:

• Toutes vos typos sur iPhone
• Téléchargez le Kelmscott, une typographie signée Nick’s Fonts !
• Microsoft ? Voilà ce que pourrait être votre nouvelle identité visuelle !
• Jeudi c’est typographie avec le Podkova !
• Comment bien choisir une typographie ?
• [infographie] La psychologie de la musique !

SERIF versus SANS SERIF : la bataille ultime. est publié originellement sur le blog de graphisme : Graphisme et interactivité blog par Geoffrey Dorne

Bonjour bonjour

Nicholas Felton, notre data-serial-visualiser est l’auteur de plusieurs rapports annuels personnels qui présentent de nombreuses mesures de sa vie sous forme de datavisualisation. Mosaïques typographiques, cartes, statistiques, chacun de ses « rapports » tient compte des activités de l’année. Il est également le co-fondateur de Daytum.com, et travaille actuellement dans l’équipe design de Facebook (overclasse).

Voici donc son dernier « rapport annuel », celui de 2012 donc !

Feltron Report

Loin d’être passionnants, je trouve surtout que les rapports de Nicholas Felton sont un bon indice de ce qui se fait, d’un certain nombre de façons de représenter des données… tout simplement

sourceCes articles peuvent aussi vous intéresser:

• Facebook vous permet de visualiser graphiquement vos données.
• Ooops, Facebook n’efface pas vos données !
• Retour sur l’Expoviz, exposition sur la visualisation de données !
• La France, le 17e pays du design ?
• Quel outil de visualisation de données choisir ? Un schéma pour vous expliquer.
• [conférence] Visual Complexity & Manuel Lima !

Le dernier rapport datavisualisé de Nicholas Felton, rien que pour vous ;-) est publié originellement sur le blog de graphisme : Graphisme et interactivité blog par Geoffrey Dorne

Hey

Alors que la curiosité autour de la représentation d’Internet existe depuis sa création, nous sommes de plus en plus capables d’expliquer ce à quoi Internet ressemble physiquement ou tout du moins, schématiquement. Aujourd’hui, je suis ravi de vous partager une application qui joue ce rôle et qui permet une visualisation 3D assez époustouflante. On y découvre l’ensemble d’Internet et ses systèmes autonomes à travers le monde, ainsi que la façon dont tous les réseaux sont connectés.

Bien qu’elle soit très agréable à utiliser et très amusante à manipuler, cette application se veut  aussi être un outil éducatif qui représente l’évolution d’Internet de 1994 à nos jours, mettant en évidence les moments clés, comme le lancement de Facebook ou Google, par exemple.

Les utilisateurs peuvent consulter les fournisseurs de services Internet (FSI), les points d’échange sur Internet, les réseaux des universités sur deux options d’affichage – Globe et réseau. L’application permet également aux utilisateurs de générer une trace route entre l’endroit où ils se trouvent et un noeud, une destination. C’est assez impressionnant !

Le fonctionnement

Cliquer ici pour voir la vidéo.

L’application utilise des données réelles sous forme de visualisation chronologique afin d’afficher 22.961 nœuds autonomes reliés par plus de 50 000 connexions. L’application est aussi en mesure de projeter ce à quoi ressemblera Internet en 2020 en utilisant un algorithme basé sur les données actuelles, ainsi que des prévisions pour mesurer la croissance de l’industrie de l’hébergement, etc.

En images

Enfin, les systèmes de représentations sont au nombre de deux mais j’espère que l’application permettra à l’avenir une ouverture plus grande, pourquoi pas sous forme d’API afin de manipuler tout ceci et, je l’espère, de créer ses propres systèmes de représentation pour voir Internet comme jamais vous n’auriez pu l’imaginer

sur iPhone | sur AndroidCes articles peuvent aussi vous intéresser:

• Tout savoir sur l’Internet des objets.
• Application typographique : « abcdefghijklmnopqrstuvwxyz »
• À quoi ressemble visuellement votre Wifi ?
• FileDrop, la simplicité du transfert de données entre différents appareils !
• Transformez vos photos en légo avec votre iPhone
• Quel outil de visualisation de données choisir ? Un schéma pour vous expliquer.

Visualisez (vraiment) Internet sur votre mobile. est publié originellement sur le blog de graphisme : Graphisme et interactivité blog par Geoffrey Dorne

On continue notre journée avec Pierre qui est à l’origine d’un projet assez formidable et qui s’appelle « Dis-moi où tu me plais » !

Ce jeune homme à eu l’idée de rassembler les 6000 petites annonces qui ont été publiées sur le site croisedanslemetro.com afin de les analyser sous forme de mots clefs et de carte de Paris interactive. Ainsi, il dresse un bilan amoureux des rencontres ratées sur le réseau RATP Vous allez le découvrir par vous-même amis chaque station est indiquée par une zone de couleur et plus la zone est foncée, plus il y a d’annonces postées.

Les gares, haut lieu du coup de foudre

Une façon originale et intéressante de manipuler des données. Personnellement, j’invite tous les sites qui souhaitent se faire connaitre à ouvrir leurs données afin de pouvoir, par le plus grand des hasards, se retrouver embarqué dans un autre projet, dans une autre vision de ses données, dans une forme nouvelle et innovante du contenu d’un site.

En attendant, je vous invite à lire les petits messages d’amour, de regards croisés sur un strapontin.. c’est très touchant

sourceCes articles peuvent aussi vous intéresser:

• Comment (bien) ouvrir un livre ?
• Partagez votre « ressenti » sur le temps qu’il fait et visualisez la « vraie » météo du monde
• Téléchargez des images tombées dans le domaine public avec : « The Public Domain Review »
• Votre bibliothèque sera votre dernière demeure !
• Do@, un navigateur mobile qui invite à découvrir toutes les web-apps !
• Interview de Philippe Starck sur France Info!

« Dis-moi où tu me plais »… Data-visualisez vos amours du métro ! est publié originellement sur le blog de graphisme : Graphisme et interactivité blog par Geoffrey Dorne

Hey hey

Il y a quelques jours, Célia d’Istock (que je remercie!) me proposait de vous offrir des fichiers de mon choix à télécharger gratuitement. J’ai donc eu l’idée de vous sélectionner des fichiers orientés « visualisation graphique » et « infographie » Fichiers qui vous serviront, je l’espère, pour vos créations graphiques, vos présentations, vos sites web, etc.

Les fichiers sources à télécharger

Dans l’idée, si vous voulez télécharger ces trois fichiers, il faut :

• cliquer sur le lien ci-dessous
• vous logger sur le site
• télécharger gratuitement les fichiers

Profitez-bien ! 

> Pour télécharger gratuitement ces fichiers, ça se passe par ici !Ces articles peuvent aussi vous intéresser:

• Graphism.fr vous offre 100€ d’illustrations vectorielles !
• Graphism.fr vous offre 100€ de pixel art !
• Télécharger gratuitement des audio-guides
• Quand les gens laissent traîner leurs sources flash…
• Téléchargez dix exemples de chartes graphiques en PDF !
• Télécharger gratuitement la Creative Suite ADOBE CS2 ! (Photoshop, Illustrator, Premiere, InDesign, GoLive, Dreamweaver et Bridge)

Pour vous, 100€ d’éléments graphiques pour faire des infographies ! est publié originellement sur le blog de graphisme : Graphisme et interactivité blog par Geoffrey Dorne

Bonjour et… bon lundi !

Bon, ici c’est la grande forme, week-end de folie et la découverte du matin est signée Google, rien que ça « How seach works » est le nom de cette passionnante page web qui nous décrit le parcours réalisé pour chaque recherche réalisée sur Google, la quantité de recherches réalisées, la façon dont sont triés les résultats ou encore la manière dont spams sont évités.

C’est évidemment en HTML5, css3, animé, tout en scrollant

How search works

C’est une belle façon d’expliquer des choses complexes de façon didactique, simple et ludique. Ainsi, je recommande de plus en plus cette façon de faire lors de projets dans lesquels il faut décrire un déroulé, une histoire, des étapes de travail, un workflow ou un processus en entreprise, etc. Le public accroche plutôt bien, l’impact, pour ce genre de données et de représentation est donc très efficace

sourceCes articles peuvent aussi vous intéresser:

• Quel outil de visualisation de données choisir ? Un schéma pour vous expliquer.
• Cartographie du langage gestuel tactile.
• Google propose des chaussures en attendant les Google Glasses !
• L’aéroport d’Oslo s’agrandit…Et le fait savoir!
• Et si l’on redesignait Google ?
• La cartographie du film Inception

Le design des algorithmes selon Google ! est publié originellement sur le blog de graphisme : Graphisme et interactivité blog par Geoffrey Dorne

Hello

Comme souvent, les services web qui atteignent la maturité se retrouvent à avoir besoin de « montrer » leur succès, leur évolution, leur réussite. Ce fut le cas avec Kickstarter récemment et c’est un cas intéressant avec Foursquare. Foursquare est certainement l’une des entreprises qui possède un produit qui s’intègrent le plus dans le lieu des autres entreprises tout en fonctionnant en réseaux et en recommandations. Hier, la société publiait donc une analyse détaillée, interactive et sous la forme d’une carte topographique retraçant les 500 000 000 check-in executés lors de ces trois derniers mois.

On y découvre des choses plutôt intéressantes comme

• le fait que Foursquare n’est pas un service populaire uniquement à San Francisco ou à New York
• des millions de personnes à travers le monde utilisent Foursquare chaque jour
• la cartographie par l’humain est très intéressante à superposer sur les cartographies que nous connaissons (densité de personnes, richesse des pays, carte de la pollution lumineuse, etc.)
• on y découvre des formes spécifiques comme celles des aéroports, des routes, du périphérique, etc.
• on peut y voir des sentiers, Moscou (qui ressemble à une araignée!, des  îles comme Oahu, la mince ligne du Golden Gate Bridge, les parcours de Central Park et même les lignes de ferry à Istanbul.
• …

En image

Ce qui rend Foursquare si puissant, c’est que tous check-ins que vous voyez ne sont pas seulement des points, ils sont les liens entre tous les autres endroits dans lesquels des personnes se sont rendues aussi. Par exemple, quand on voit qu’énormément de gens d’un pays X ont tendance à se rendre dans le même cinéma dans un pays Y, on peut donc imaginer et essayer de comprendre la relation entre ces deux endroits. Et si l’on ajoute les check-in de vos amis ou des gens avec qui vous avez des goûts similaires, les suggestions deviennent encore plus personnalisées.

Une boussole vivante, visuelle et connectée donc, dont la mise en image nous donne le vertige…

source | sourceCes articles peuvent aussi vous intéresser:

• « The Maker Map » : LA carte du mouvement maker !
• LiquiData, ou comment j’ai transformé mon smartphone en Kirby urbain
• Découvrez et participez à « The Internet mapping project » !
• Des villes et des typos !
• Tous vos plans, au creux de votre main !
• Envoyez le fil de votre voyage !

Le jour où Foursquare dévoile ses dessous d’au dessus. est publié originellement sur le blog de graphisme : Graphisme et interactivité blog par Geoffrey Dorne