Le design de l’information en ligne

Le design de l’information en ligne Nouvelles pratiques multimédia, traitements innovants

I. Enjeux

A. Surcharge informationnelle  « Information overload », terme introduit dans les années 1950 par Alvin Toffler  Un accroissement rapide de l’information nouvelle  La facilité de la duplication par les moyens numériques  Un nombre croissant de canaux de diffusion  Un large historique d’information disponible  Nous entrons dans l’ère de l’économie de l’attention  Comment naviguer dans la sur-information ?

Orange.fr

B. La fragmentation des pratiques de lecture  le numérique démultiplie les pratiques  le basculement vers la lecture en ligne  un éclatement des supports (mobiles, tablettes etc.)

C. La culture de l’algorithme  Quand les algorithmes définissent les choix éditoriaux  Guardian Zeitgeist compile les articles les + lus

D. Quels modes de consultation de l’information à l’ère numérique ?  lecture et serendipité / non-linéarité  lecture « zapping » vs lecture « immersive »  lecture « sélective »  lecture « mobile » / courte  lecture participative, co-énonciation

Publicité et presse en ligne Carte d’occultation après 1 min 30 s (étude Altics oct 2009)

Publicité et presse en ligne Banner blindness – carte de chaleur après 1 min 30 s (étude Altics oct 2009)

Les informations de 1er plan sur Le Monde.fr

II. Une perspective évolutionniste « un nouveau médium ne s’ajoute jamais aux média antérieurs et ne les laisse jamais intacts. Il les bouscule sans cesse et leur trouve de nouvelles formes et de nouveaux emplois.» Marshall McLuhan, 1964

A. La mort du portail d’information  Le portail web, genre utilitaire et éditorial, s’efface peu à peu en tant que mode d’accès unifié aux contenus  Éclipsé par les agrégateurs et pages personnalisées  Un design d’interface caractéristique : forte densité éditoriale, structure en U renversé, modules

Yahoo!

B. L’avènement des modèles verticaux d’organisation de l’information  la presse en ligne adopte progressivement le format vertical et antéchronologique du blog  Un modèle à remettre en cause

+ 8 000 px

Un mode d’organisation hérité du papier

Un mode d’organisation intermédiaire

Un mode d’organisation proche du blog

Des modes d’organisation optimisés

C. La « mobilisation » des usages  Le WAP n&b  Le WAP 2.0  Smartphone  l’iPhone 256 couleurs Paris NOUVEAUTES MA SELECTION SELECTION ITINERIS COMMUNAUTES DIVERTISSEMENTS SHOPPING PROXIMITE MON ESPACE CLIENT RECHERCHER PROFIL Pour faire de cette page votre page par défaut, cliquez ici.

C. La « mobilisation » des usages  ... c’est aussi cela aujourd’hui : tablettes, livres électroniques, consoles, MID, UMPC...

D. Vers de nouveaux modes d’organisation de l’information  Gérer la densité informationnelle  L’information « mosaïquée »  Lectures horizontales

Times Skimmer

Toronto Star : choose the way you view the news

Moco Loco

Google News Timeline

Google Fast Flip

BBC 3D Explorer

RSS Voyage

D. Designer la « simplexité » de l’information en ligne  Vers la visualisation de l’information  De nouveaux « idiomes » pour les interfaces d’information  Le genre des « infographies interactives »

Washington Post TimeSpace

BBC News Globe

Wall Street Journal : infographie interactive

Culture Box

Digg Lab

MSN Spectra

Et un grand classique : Newsmap

III. Des formes hybridées « L’hybridation ou la rencontre de deux média est un moment de vérité et de découverte qui engendre des formes nouvelles. » Marshall McLuhan

C. Du point de trame au pixel  les médias électroniques dominés par la référence à l’imprimé (métaphore de la page écran)

Libération un journal mis en abyme dans une interface mobile

Application iPad du Monde

Éditions électroniques

D. Vers des formes applicatives de l’information  Content as a software  Content as a service  Applications iPad/iPhone/widgets/RDA

Times Reader

Application iPad de NPR

Application iPad d’Associated Press

IV. Nouvelles situations d’usage, nouvelles formes d'écritures

A. Une écriture démultipliée  multimédia, rich-media  Webdocumentaires  Le photojournalisme à l’ère d’internet

FLYP, magazine multimédia & interactif

NPR multimedia section

Prison Valley

Reportaje 360

New York Times Lens blog

B. L’écriture temps-réel de l’information  Twitter : une innovation ou une contribution à l’information overload ?  Pas uniquement Twitter mais aussi les multiples formes de flux comme les « news rivers », la messagerie instantanée...  Un nouveau paradigme pour la collaboration ?

CNN NewsPulse

BBC News Radar, nouveau mode d’entrée dans le contenu

Wall Street Journal + Foursquare

C. Database journalism  une pratique née dans les années 1950 comme « journalisme assisté par ordinateur »  Internet en a redéfini le concept : rassembler les données, les distribuer, les rendre navigables et interprétables  « produire du sens avec des chiffres convertis en images » (A. Joannes)  une valeur ajoutée dans l’approfondissement  le risque de l’esthétisme gratuit

The Guardian – MP expenses

Telegraph – UK General Election 2010

D. Quand l’information devient jouable  Un nouveau genre éditorial, les news games  Permettre la prise en main ludique de l’information à travers les codes du game play  Encourager le sens critique des citoyens ? Une distanciation ?  Allier pédagogie et information ?  Construire de nouveaux scénarios de consultation  Un prolongement gestuel, tactile de la lecture d’information  Un rôle important dans la satire politique

MSNBC NewsBreaker

CNN Challenge

E. Vers l’information ambiante  Calm computing, un concept inventé par Mark Weiser et John Seely Brown (Xerox Parc)  Une information qui se « dilue » dans l’environnement  Des interfaces qui informent en permanence de façon «diffuse» mais ne monopolisent pas l’attention

Chumby

Center Field

Ambient Orb

Pour conclure

New York Times R&D Group

IDEO : 14 scenarios pour le futur

http://www.drouillat.com	914
http://www.hebiflux.com	189
http://www.slideshare.net	124
http://www.levidepoches.fr	100
http://esouillat.wordpress.com	74
http://blog.mba-multimedia.com	59
http://o3vdoc.blogspot.com	54
http://blog.mba-multimedia.org	46
http://pierrechausse.tumblr.com	38
http://en-net.cpgrp.root.local	13
http://levidepoches.blogs.com	6
http://us-w1.rockmelt.com	6
http://virgile.posterous.com	4
http://www.levidepoches.blogs.com	4
http://itkg.posterous.com	4
http://www.matthieu-tranvan.fr	3
https://en-net.canal-plus.com	3
http://static.slidesharecdn.com	2
http://alain-antone.blogspot.com	2
http://blog.mba-multimedia.fr	2
http://eguilde.xwiki.softec.lu	1
http://www.yatedo.com	1
http://www.soup.io	1

Le design de l’information en ligne

by Designers Interactifs on Jun 05, 2010

Accessibility

Categories

Tags

Upload Details

Usage Rights

23 Embeds 1,650

Statistics

Le design de l’information en ligne — Presentation Transcript