Utilisateur:DarkTitouan : Différence entre versions
| Ligne 58 : | Ligne 58 : | ||
Le projet [[Read me if you can!]] était un exercice d’initiation au java script autour d’extraits du texte « éloge du beug ». Il nous étais confié des extraits du texte que l’on devait mettre en scène dans des pages web proposant à chaque fois des expériences de lectures interactives/immersives grace au Language de programmation Java script. J'ai eu du mal avec le js au début, ma première expérience est un cmc cmv modifié pour coller à mon idée, elle utiliser une font de pol peyroll un ancien de l'erg je crois c'est avec cette font que j'ai entendu parler de l'erg pour la première fois. | Le projet [[Read me if you can!]] était un exercice d’initiation au java script autour d’extraits du texte « éloge du beug ». Il nous étais confié des extraits du texte que l’on devait mettre en scène dans des pages web proposant à chaque fois des expériences de lectures interactives/immersives grace au Language de programmation Java script. J'ai eu du mal avec le js au début, ma première expérience est un cmc cmv modifié pour coller à mon idée, elle utiliser une font de pol peyroll un ancien de l'erg je crois c'est avec cette font que j'ai entendu parler de l'erg pour la première fois. | ||
Ma deuxième expérience s'inspire de la scène de la chambre forte de harry potter. Je me suis dit que le concept était simple a faire sur js mais aurais un bon rendu. J'ai rajouté des effets à chaque fois que j'arrivais a faire quelque chose, je suis plutôt content du résultat. | Ma deuxième expérience s'inspire de la scène de la chambre forte de harry potter. Je me suis dit que le concept était simple a faire sur js mais aurais un bon rendu. J'ai rajouté des effets à chaque fois que j'arrivais a faire quelque chose, je suis plutôt content du résultat. | ||
| − | Ma troisième expérience utilise quelques une de mes fonts préférés que j'ai accumulés avec le temps. Elles viennent toutes de dafont. Le | + | Ma troisième expérience utilise quelques une de mes fonts préférés que j'ai accumulés avec le temps. Elles viennent toutes de dafont. Le principe d'animation est le même que ce que j'avais essayé de faire lors du workshop typotheque, je suis content d'avoir réussis à le faire marcher. |
| Ligne 64 : | Ligne 64 : | ||
Projet principal de ce quadri, j’ai eu beaucoup de mal à comprendre et m’approprier le sujet. Je documente ma galère ici —-> | Projet principal de ce quadri, j’ai eu beaucoup de mal à comprendre et m’approprier le sujet. Je documente ma galère ici —-> | ||
Mon projet: [[Parole_en_lumière]] | Mon projet: [[Parole_en_lumière]] | ||
| + | |||
| + | == BIG SCRAP == | ||
| + | Big scrap est un projet résultant de l'initiation au [[Scraping]] que nous avons eu cette année. Mon objectif avec ce projet était d'automatiser ce que je fais depuis des années : voler des images sur internet, le plus souvent a des plateformes de Stockimages. Pour le coté technique j'ai utilisé le code et le script mis à disposition par lionel sur la page wiki "scrapping", ce script est un script python utilisant la librairie [[Beautifulsoup]] qui va analyser le contenu d'une page web pour y télécharger toutes les images présentes et les ajouter a la page html associée au script. Avec ce script, j'ai réalisé une série de pages A3, mis en pages en HTML/CSS et imprimés en web2print via [[Page.js]] qui assemblées forment un gigantesque poster représentant un échantillon d'internet. J'ai basé mes recherches d'images sur des thèmes de santé publique qui me touchent et m'intéressent particulièrement: les drogues (au sens large, toute substance affectant nos corps, prescrites ou non, a usage "récréatifs" ou non etc..), et l'imaginaire qui l'accompagne avec la méfiance des gens vis à vis des industries pharmaceutiques et les marchés parallèles, allant du plus saint au plus complotiste. C'est un sujet que j'ai également abordé dans mon travail d'AP Média, avec une méthode de travail similaire (taper des mots clefs liés au sujet et écumer les premières pages de Google image à la recherche d'images intéressantes) à la différence qu'elle était 100% manuelle. Je trouve très intéressante l'idée de mettre en opposition (en tout cas en rencontre) ces deux travaux car cela met en lumière la différence entre l'humain et la machine. En parlant d'opposition humain/machine je me suis rendu compte que ces images de stock auxquelles je suis tant attaché sont en train de petit à petit disparaître au profit d'images générées par IA, je ne suis pas sur que ce projet serait réalisable avec un résultat de qualité l'année prochaine (qualité à mes yeux en tout cas, j'imagine que c'est subjectif). J'ai adopté le "style documentaire" pour ce projet, c'est à dire que j'ai essayé d'être le plus neutre possible tout en ayant pour objectif de créer une réflexion, un débat sur ce/ces sujet(s). Pour cela, j'ai gardé toutes les images scrapées en leur donnant les même propriétés css, mettant a un niveau égal une photo de poudre, un tableau comparatif des bénéfices des plus grands groupes pharmaceutique et un meme complotiste antivax. | ||
Version du 30 avril 2025 à 15:57
@@@@@@@@@
@@%@@%%%%%%%%%%%%%%%%@%@@@
@%@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@@
@%%%@@@ @@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@
%%%%%%%%% @%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@ @@@@
@%%%%%%%%%% @%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@ @%%%%%@
@%%%%%%%%%%%@ @%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@ @@%%%%%%%@
@%%%%%%%%%%%%%@ %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@ %%%%%%%%%%@
@%%%%%%%%%%%%%%%@ @%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@ @@%%%%%%%%%%%@@
@@%%%%%%%%%%%%%%%%%%@ @%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@ @%%%%%%%%%%%%%%%@@@
@@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@%%%%%%%%%%%%%%%%%%%%%@
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
@@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@
@@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@
@@@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@@
@@@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@@@@@
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@@@
@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@
@%%%%%%@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@%%%%%%@
@@ @ @@ @%%%%% @%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@%%%%%@ @ @ @@
@@@%@@@@ @@@%@@@ @@%%@@@@ @@@@ @%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@ @@@ @@@%%@@@ @@@%@@@ @@@@%@@@
@%%%%@ @%%%@ @%%%@@ @@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@@ @%%%@ @%%%@ @@%%%@
@@ @@@ @@ @@ @@ @@@ @@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@% @@@ @@ %@ %@ @@@ @@
@%%%%%@@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@@%%%%@
@%%%%%@ @@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@ @%%%%%@
@%%%%@ @%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@ @%%%%@
@%%%@ @@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@ %%%%%%@@ @@@@
@%%@@@ @@%@%%%%@ @%%%%%%%%%%%%%%%%%%%%%%%%%@@ @@%%%%%%%%%@@@@@@@@@%%%%%@@
@%%%%%%%%%%%%%%@@%@%%%%%%%%%%@ @%@%%%%%%%%%%%%%%%%%@@ %%%%%%%%%%%%%%%%%%%%%%%%%%%
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@ @@%%%%%%%%%%@% %%%%%%%%%%%%%%%%%%%%%%%%%%%@
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@ @%%%%%@@ @@%%%%%%%%%%%%%%%%%%%%%%%%%%%%@
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@@@@ @%%%%%%%%%%%%%@@ @@%@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@
@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%@%%%%%%%%%%%%%%%%%%%%%%%
@%%%%%%%%%%%%%%%%%%%%%%%%@@ @@%%%%%%%%@@%%%%%%%%%%%%% @@@%%%%%%%%%%%%%@@@@%%%%%%@@ @@%%%%%%%%%%%%%%%%%%@
%%%%%%%%%%%%%%%%%%%%%%%@ @%%%%%%%%%%@ @@ @@%%%%%%%%%%@ @@%%%%%%%%%%%%%%%%@
@%%%%%%%%%%%%%%%%%%@@ %%%%%%%%%%%@ @%%@ @%%%%%%%%%%@ @@%%%%%%%%%%%%%%@
@%%%%%%%%%%%%%%%%@@ @%%%%%%%%%%%@%%%@@%%%%%%%%%%%@ %%%%%%%%%%%%%%%
@%%%%%%%%%%%%%@@ @%%%%%%%%%%%%%%%%%%%%%%%%@ @%%%%%%%%%%%@
%%%%%%%%%%%@@ @@%%%%%%%%%%%%%%%%%%%@ %@%%%%%%%@
@%%%%%%%%@@ @@@%%%%%%%%%@@ @@
@%@@@@ @@@@@@
Sommaire
Présentation
Je m’appel Titouan, dark Titouan ici car Titouan était déjà prit. Si vous voulez en apprendre un peu plus sur moi et ma pratique numérique c’est ici —-> http://work.designnumerique.be/titouan/
Projets design numérique b2
Work
Premier projet de l’année, une page web pour se présenter. Je suis pas très à l’aise à l’idée de parler de moi donc j’y avais pas mit beaucoup de texte, surtout des memes (certains trop edgys, ils sont mieux supprimés). C’était un retour au html ces j’étais totalement rouillé ma page ressemblait pas à grand chose. Je suis repassé dessus en fin de quadri, j’aime bien ce qu’elle dégage mtn : c’est un peu moche mais juste ce qu’il faut pour une bonne page web imo. Je trouve qu’elle incarne bien ma relation avec internet et avec le numérique.
html2print-moi cet article
Atelier autour du « web2print » terme désignant le fait d’imprimer des pages web. On a apprit à utiliser une libraire javascript: page.js pour automatiser nos mises en pages et faciliter leur impression. J’avais déjà fait un projet web2print l’année dernière mais sans utiliser cette librairie, c’était un peu plus galère mais j’avais bien aimé découvrir une nouvelle façon de voir l’édition. Ici on a chacun eu un article, le mien était court et ne m’inspirait pas trop. J’ai fait une mise en page simple reposant sur le contraste entre le violet et le blanc qui sont quasi équivalents sur les pages . Le web2print de l’année dernière était un projet éditorial très précis donc pour changer j’ai changer des paramètres à tâtons en conservant certaines de mes erreurs pour créer un effet bizarre. #élogedubeug Mon article est ici : http://work.designnumerique.be/titouan/article/module.html bien que la véritable mise en page n'apparaisse que quand on lance les paramètres d’impression.
Read me if you can
Le projet Read me if you can! était un exercice d’initiation au java script autour d’extraits du texte « éloge du beug ». Il nous étais confié des extraits du texte que l’on devait mettre en scène dans des pages web proposant à chaque fois des expériences de lectures interactives/immersives grace au Language de programmation Java script. J'ai eu du mal avec le js au début, ma première expérience est un cmc cmv modifié pour coller à mon idée, elle utiliser une font de pol peyroll un ancien de l'erg je crois c'est avec cette font que j'ai entendu parler de l'erg pour la première fois. Ma deuxième expérience s'inspire de la scène de la chambre forte de harry potter. Je me suis dit que le concept était simple a faire sur js mais aurais un bon rendu. J'ai rajouté des effets à chaque fois que j'arrivais a faire quelque chose, je suis plutôt content du résultat. Ma troisième expérience utilise quelques une de mes fonts préférés que j'ai accumulés avec le temps. Elles viennent toutes de dafont. Le principe d'animation est le même que ce que j'avais essayé de faire lors du workshop typotheque, je suis content d'avoir réussis à le faire marcher.
Publier la parole
Projet principal de ce quadri, j’ai eu beaucoup de mal à comprendre et m’approprier le sujet. Je documente ma galère ici —-> Mon projet: Parole_en_lumière
BIG SCRAP
Big scrap est un projet résultant de l'initiation au Scraping que nous avons eu cette année. Mon objectif avec ce projet était d'automatiser ce que je fais depuis des années : voler des images sur internet, le plus souvent a des plateformes de Stockimages. Pour le coté technique j'ai utilisé le code et le script mis à disposition par lionel sur la page wiki "scrapping", ce script est un script python utilisant la librairie Beautifulsoup qui va analyser le contenu d'une page web pour y télécharger toutes les images présentes et les ajouter a la page html associée au script. Avec ce script, j'ai réalisé une série de pages A3, mis en pages en HTML/CSS et imprimés en web2print via Page.js qui assemblées forment un gigantesque poster représentant un échantillon d'internet. J'ai basé mes recherches d'images sur des thèmes de santé publique qui me touchent et m'intéressent particulièrement: les drogues (au sens large, toute substance affectant nos corps, prescrites ou non, a usage "récréatifs" ou non etc..), et l'imaginaire qui l'accompagne avec la méfiance des gens vis à vis des industries pharmaceutiques et les marchés parallèles, allant du plus saint au plus complotiste. C'est un sujet que j'ai également abordé dans mon travail d'AP Média, avec une méthode de travail similaire (taper des mots clefs liés au sujet et écumer les premières pages de Google image à la recherche d'images intéressantes) à la différence qu'elle était 100% manuelle. Je trouve très intéressante l'idée de mettre en opposition (en tout cas en rencontre) ces deux travaux car cela met en lumière la différence entre l'humain et la machine. En parlant d'opposition humain/machine je me suis rendu compte que ces images de stock auxquelles je suis tant attaché sont en train de petit à petit disparaître au profit d'images générées par IA, je ne suis pas sur que ce projet serait réalisable avec un résultat de qualité l'année prochaine (qualité à mes yeux en tout cas, j'imagine que c'est subjectif). J'ai adopté le "style documentaire" pour ce projet, c'est à dire que j'ai essayé d'être le plus neutre possible tout en ayant pour objectif de créer une réflexion, un débat sur ce/ces sujet(s). Pour cela, j'ai gardé toutes les images scrapées en leur donnant les même propriétés css, mettant a un niveau égal une photo de poudre, un tableau comparatif des bénéfices des plus grands groupes pharmaceutique et un meme complotiste antivax.
