Utilisateur:Mondher
9 octobre / workshop : un réseau
1ère étape : mise en place du réseau
2ème étape : investir le réseau et les lieux qu'il contient, utiliser les avatars, déposer ça et là des fichiers, créer des liens
3ème étape : cartographier le réseau en fonction de ce qui interpelle, relever des activités, comportements ou informations. pour cette étape, je me suis intéressé à la représentation statistique ; quantité de fichiers déposés et créés, formats représentés, temporalité, ce que j'ai fait à l'aide d'un outil infographique online (piktochart) ; mais il fallait trouver des outils plus pertinents. suite à une discussion avec un ami géographe-urbaniste, j'ai découvert tulip-perspective, un software de cartographie-statistique. avec ce software, je me suis concentré sur des représentations quantitatives et sur la nature des fichiers. plusieurs graphiques ont été générés, deux on été retenus.
après quelques expérimentations
et finalement
--
Un site composé de plusieurs pages organisées par "niveaux". La page d'accueil est le niveau 1. Sur chaque page il y a des phrases en mouvement. Ces phrases représentent des pensées, des sensations, des idées. Les pensées vont et viennent, sortent par moments de la page. Pour se balader entre les pages, il faut cliquer sur les phrases.
Cette idée vient d'une lecture récente pour l'examen du cours de littérature : L'Innommable de Samuel Beckett. Ce livre présente un narrateur dont la forme reste abstraite, et dont on ne peut cerner la nature. La seule caractéristique qu'il partage avec un être humain est une forme de conscience, remplie de pensées tantôt éparses, tantôt absurdes, tantôt insensées. Il ne sait pas ce qu'il est, si il est.
schéma de construction des pages et des déplacements
Pour chaque niveau il y a un fichier HTML, un fichier CSS et un fichier JavaScript.
Les fichiers HTML contiennent une vingtaine de phrases, chacune contenue dans un paragraphe, lui-même contenu dans un div. Elles sont écrites à l'intérieur d'une balise a, ce qui en fait des liens cliquables.
CSS :
Dimensions et couleur de fond des pages. Position, typographie, taille de la typographie, désactivation de l'aspect hyperlien, transparence de la typographie pour utiliser seulement son ombre de manière floue afin de symboliser les pensées. Lorsque le curseur rencontre une phrase, celle-ci se précise. Autrement, les phrases sont floues.
JavaScript :
Un script js permet de placer les phrases "aléatoirement" dans l'espace de la fenêtre au moment de l'ouverture de la page, puis de les déplacer, "aléatoirement" aussi.
J'aimerais par la suite créer plus de niveaux et incorporer d'autres types de contenus (images, vidéos, sons, documents..)
J'aimerais également développer les aspects visuels et les comportements des éléments.