Parallèles

Mot-clé - graphisme

Mon nouveau dossier d'artiste

dossier-artiste-2012.jpg

Je n'en avais jamais fait avant, mais voilà mon nouveau dossier d'artiste.

Il contient une petite sélection de certains de mes travaux, en vidéo, installations et art numérique, ainsi qu'un CV.

Vous pouvez le télécharger ici au format pdf (1,90Mo).

 

display:none;

Cela fait maintenant plus de 6 mois que je travaille sur un projet qui vient enfin de voir le jour.

Ce projet est à l'initiative d'un séminaire de recherche sur l'auto archivage comme œuvre d'art mis en place par un de mes anciens profs à l'EESAB de Lorient : Julie Morel. L'intitulé du projet était simple : devant la frénésie d'archivage dans laquelle notre société s'est engagée et la multitude d'outils existants pour y parvenir, comment un travail artistique peut-il s'en emparer et questionner cette pratique ? Je cite Julie Morel sur son blog : « [...] il ne s’agit pas ici de lister un nombre d’expérimentations ou d’espaces d’archivages d’artistes dont le contenu serait intéressant, mais bien de s’emparer de ces outils et les transformer en matière à pratiquer une recherche jusqu’à en faire œuvre, tout en y portant un regard critique. »

Ce séminaire, en plus de faire appel à des artistes, écrivains et critiques, a laissé la possibilité à plusieurs étudiants en art de s'y intéresser et de proposer une réflexion plastique, dont moi même (j'étais encore étudiant à l'époque).

J'ai donc rejoint le groupe en proposant mon projet (développé sur une idée commune avec Guillaume Lepoix) : display:none; dont voici le rendu (j'explique ma démarche et mes intentions en dessous).

Explications :

display:none; est une carte.
Une carte interactive regroupant l'ensemble des pages d'un ou plusieurs sites web et qui se reconfigure en permanence. Chaque fois qu'une nouvelle entrée (billet, page, post, etc...) apparaît sur un site, la carte se recentre sur celle-ci et se reforme de telle sorte qu'elle n'affiche que des entrées ayant des points communs avec la première.

display:none; exploite la notion de flux, notion intrinsèque au web d'aujourd'hui (web 2.0).

Aujourd'hui, encore plus qu'avant l'Internet est devenu un vaste flux d'informations en perpétuel mouvement, instable et presque infini. Toute tentative de représentation de ce qu'est Internet (en terme de contenu et de lien) ne peut être que forcément subjective et simplifiée. IBM prédisait en 2006 que la masse d’informations dans le monde doublerait toutes les 11 heures en 2010 [1]. Selon une estimation il y aurait en 2011 1.8 zetaoctets de données dans le monde (soit 1.8 milliards de Téraoctets ou 1800 milliards de Gigaoctets)[2]. Ces chiffres amènent à un simple constat : Internet est un océan de données en perpétuel croissance dont l'ampleur est devenue incompréhensible et inimaginable pour l'être humain.

display:none; part de ce constat pour tenter de le représenter en plongeant l'utilisateur directement au sein de ce flux d'informations. La radicalité du projet consiste à n'afficher qu'une image par entrée (prélevée au sein de chaque page correspondante), ce qui la décontextualise, la rendant même parfois totalement incompréhensible. Ainsi, même si chaque entrée correspond bien à une vraie page présente sur le web (il est d'ailleurs possible de s'y rendre), le visiteur ne possède aucune information (du moins textuelle) sur la nature de cette entrée tant qu'il ne l'a pas visitée.

L'utilisateur de display:none; peut naviguer au sein de ce flot d'informations en y voyageant sans véritable direction, avec pour unique repère visuel des images totalement décontextualisées. Sans repère, sans même savoir quelle est la nature des liens entre les images, le visteur se retrouve à faire un voyage au sein d'un objet graphique à part entière.

A propos du nom :

display:none; est une propriété CSS (c'est un bout de code qui permet de mettre en page un document web).
En l’occurrence display:none; permet de supprimer totalement un bloc (si j'applique cette propriété au titre de mon billet par exemple il va totalement disparaître de l'écran). C'est sans doute une des propriétés de mise en page les plus radicale. J'ai donc choisi de nommer ainsi ce projet pour le point commun qu'il partage sur le traitement qu'il fait au texte : le supprimer totalement.

display:none; est aussi un outil libre de droits

Quitte à développer et à programmer un outil tel que displaynone;, je me suis dit qu'il valait mieux en faire profiter d'autres. display:none; est donc téléchargeable gratuitement et sous licence libre de droits (GPLv2). Il est possible de l'installer sur n'importe quel serveur disposant d'une base de données MySQL. Pour plus de détails, j'ai une page réservée au projet sur mon site :

Je remercie une fois encore Julie Morel (sans qui ce projet n'aurait jamais émergé) et Guillaume Lepoix (pour ses nombreux conseils sur les directions à prendre).

[1] Wikipedia : stockage d'informations - problématiques du stockage
[2] Actualité : 1,8 zetaoctets de données dans le monde - Clubic

Mon amour du comic sans

Préambule :

Pour ceux qui ne la savent pas encore (mais j'en doute) le Comic Sans MS est une typographie réalisée par Vincent Connare en 1995 pour Microsoft (d'où le MS à la fin). Très largement contestée dans le milieu du graphisme (idéal pour se discréditer définitivement en tant que graphiste) elle est encore très populaire dans le milieu des kikoolol ou des employés de mairie, et pour cause, c'est une des rares typographies distribuées par défaut avec un ordinateur. En gros cette typo ressemble à ça :

Cette typographie est hideuse

Pourquoi est-elle aussi détestée? Pour plusieurs raisons:

  • Elle ne correspond pas aux règles de typographie de base : pas de variante de graisse, pas de variante en italique, pas de table d'approche (si, vous savez, les différences quand certains caractères se retrouvent côte à côte)
  • Elle n'a pas été conçue pour être utilisée pour des blocs de textes, mais pour simuler une écriture manuscrite dans les bulles des BD (d'où le nom "comic")
  • Elle a été beaucoup trop utilisée par le grand public avec des mariages de couleurs peu subtils (qui n'a pas utilisé cette police pour inviter ses copains à un goûter d'anniversaire quand il avait 8 ans?), ce qui l'a rendue très rapidement kitch et apparentée à un usage peu professionnel

Une petite comparaison avec d'autres typos beaucoup plus sérieuses :

polices.jpg

Déformation professionnelle...

Étant quelque peu sensibilisé à la rigueur graphique, mon œil déformé ne peut s'empêcher de se focaliser sur une erreur de mise en page, un problème de césure, une police d'écriture du plus mauvais goût, etc... Ceux qui me connaissent au quotidien savent de quoi je parle : je passe mon temps à faire la chasse au comic sans.

Prenons par exemple un site web, choisi par mes soins pour ses qualités graphiques indéniables :

site001.jpg

J'ai bien-sûr flouté le titre et l'url afin que personne ne puisse reconnaître le site en question. Si certains d'entre vous croient reconnaître ce site, c'est évidemment une pure coïncidence, tout au plus une libre inspiration de ma part.

Passons donc à une analyse approfondie de ce merveilleux design. Chez moi on appelle ça une mise en page pop-corn ou encore une mise en page carnaval. Véritable festival de couleurs et de typographies, plus disgracieuses les unes que les autres, cette page noie le regard sous un flux d'informations, à tel point que le visiteur lambda ne sait pas où se retrouver.

Analysons maintenant un peu cette page, telle que je la vois :

site002.jpg

Puisqu'il s'agit d'un site web il est facile de séparer les différents éléments en blocs contenant différentes informations. Je reconnais donc un schéma assez classique : le header (haut de page) contenant titre, menu et différentes informations de connexion, en dessous le corps du site contenant tous les blocs moches, puis le pied de page (non visible sur l'image) avec différentes informations sur la navigation et le copyright. Autant dire qu'avec une structure aussi classique je ne suis pas aussi perdu que ça. Mais en vérité, sur ce site, je ne vois pas les choses comme ça, je les vois plutôt ainsi :

site003.jpg

Et oui, même en tout petit par rapport aux autres éléments, je repère le Comic Sans à plusieurs pixels à la ronde.

Mais qu'est-ce que cela veut dire ? Et bien c'est très simple : la publicité qui contient cette affreuse typo est la seule et unique chose que j'ai repéré (du moins au premier coup d’œil), faisant d'elle l'annonce la plus percutante de cette page. Le graphiste qui a conçu ce bandeau a tout compris, puisqu'il a réussi à accrocher mon regard malgré l'importante concurrence visuelle à laquelle il a du faire face.

En conclusion :

Pour les graphistes, le Comic Sans MS est une typo d'avenir puisque c'est celle qu'ils repèrent en premier !

J'en déduis donc que le choix de cette typographie est sans doute le choix le plus judicieux si le public visé est composé en grande majorité de graphistes. Leur déformation professionnelle, à laquelle ils ne peuvent plus rien (et oui, c'est trop tard pour eux), va immédiatement les conduire à porter leur regard sur les zones contenant cette typo.

Pour terminer voilà quelques démonstrations en exemple :

adb.jpg ggl.jpg fcbk.jpg

Dotclear 2.4 et nouvelles icônes

Les utilisateurs de Dotclear (plateforme française de blog) ont pu voir récemment une notification leur précisant que la version 2.4 de leur plateforme préférée était disponible. Au menu, de nouvelle fonctionnalités, corrections de bugs et de failles de sécurité, mais aussi un nouveau jeu d'icônes.

En mai dernier, lors de la sortie de la version 2.3, l'équipe de Dotclear faisait part de son souci de licence avec les icônes précédentes. En effet les icônes n'étaient pas sous licence libre, élément un peu problématique pour une plateforme qui se veut, elle, libre. J'ai donc proposé à l'équipe de travailler sur un set d'icônes qui serait placé sous licence libre. J'ai été essentiellement en contact avec Kozlika mais le reste de l'équipe a donné son avis à plusieurs reprises sur le travail.

Pour conclure j'ai vraiment apprécié de travailler avec l'équipe et je suis content du résultat obtenu. Si vous aussi vous voulez participer au développement (plugins, corrections de bugs, propositions, etc...), n'hésitez surtout pas et allez vous faire connaitre sur le forum.

tableaudebord.jpg
graph_icodc_02L.jpg graph_icodc_03L.jpg

Les icônes sont placées sous licence libre (GPLv2) et accessibles en téléchargement ici