Web to print

Design éditorial avec les langages HTML/CSS

École Supérieure d'Arts et de Design d'Orléans, Avril 2020

Le « Web to print » est un procédé permettant de concevoir des publications papier à partir de contenus web. Il permet à partir d'une même source de créer une page web, une publication pdf imprimable.

Mené avec sept étudiant⋅es — en groupe ou individuellement — le workshop de cette semaine consiste à penser la conception de deux publications, écran et papier, avec ce procédé de conception éditorial. À partir d'un même et unique fichier source HTML ces publications se distinguent formellement ou par le contenu en fonction du contexte de lecture.

En prenant comme prétexte le guide de l'étudiant de l'école il s'agit de penser à qui s'adresse cette publication à l'écran et sur le papier. Exemple, la version web est vue et lue par un public large, elle doit transmettre un message institutionnel. La publication papier s'adresse en premier lieu aux étudiant⋅es, un contenu alternatif peut alors leur être proposé.

Guide de l'étudiant⋅e

Antoine Buon, Læetitia Cuchet, Éléonore Fines, Lucie Sahuquet

Dans l’idée de proposer un livret de l’étudiant différent selon l’usage que va en faire le lecteur, nous avons différencié la version web de l’édition. En effet, l’une étant réservée aux personnes ne connaissant pas l’ÉSAD et l’autre aux étudiants de l’école, le contenu se devait être radicalement différent. La version web étant très institutionnelle, le contenu n’a pas été modi é néanmoins le hover de tous les titrages permet d’appréhender le texte de manière interactive, jouer avec les blancs, les espaces et la respiration de chaque paragraphe. A n de pouvoir proposer un contenu subversif aux étudiants de l’ÉSAD, l’édition imprimée est, quand à elle, entièrement composée de prélèvements du texte original. Ce mots révélés forment alors de nouvelles phrases ce qui apporte au texte un aspect tantôt absurde tantôt manifeste.

Guide de l'étudiant.e avril-mai 2018

Antoine Souvent

Utilisation de la fonction aléatoire pour générer une rotation sur chaque paragraphe, donc, à chaque actualisation de la page internet, la mise en page se renouvelle. Les différentes qualités des supports permettent des résultats et des interactions différentes.
Pour l'écran l'utilisateur survol les paragraphes pour qu'ils deviennent orthogonaux, le menu sert à aller directement à la partie souhaitée, il se transforme en sommaire pour la version imprimé.
La version imprimée fige les différentes rotations et offre des résultats inattendu.

les images proposées dans la version imprimé renvoie à la mobilisation faite en 2018.

Fanzine augmenté

Romane Poupelin

Mon parti pris était de constuire un fanzine metal "augmenté" par le web2print qui permet deux niveaux de regard: la version écran permet une dimension sonore et l'ajout d'extraits vidéo et de gifs animés que l'imprimé ne permet pas, et la version imprimée est plus d'ordre éditorial, avec plus de concentration sur le texte. J'ai fait en sorte qu'il soit possible de reprendre contrôle sur le contenu, permettant une mise en page différente à chaque impression: un script permet de déplacer les images sur la version écran, mais également sur la version imprimée, ce qui permet, avant l'exportation, de choisir la disposition des images et de personnaliser son édition. Certains éléments possèdent également une taille et une position aléatoire qui diffère à chaque affichage et impression. Ainsi le positionnement des éléments n'est pas totalement déterminé par le code puisqu'il est possible d'agir directement dessus, de revenir sur sa mise en page, ce qui évoque les techniques du fanzine DIY constuit à la photocopieuse.

Progression

Les images, par défaut en noir et blanc, retrouvent leur couleur au passage de la souris. De la musique est également ajoutée à la page, pour augmenter le contenu texte.
Version écran
Version écran: les images peuvent être déplacées et replacées
Version imprimée: les images déplacées sur la version écran sont également déplaçables sur la version imprimée, permettant une disposition personnalisée et des éditions jamais identiques.
Version écran: certains éléments ont un placement et une taille aléatoire, qui changera à chaque rechargement de la page.
Double page sur la version imprimée
Version imprimée: certains éléments ont un placement et une taille aléatoire, qui changera à chaque rechargement de la page.

Workshop mené par Quentin Juhel (desginer graphique)

Étudiant⋅es : Laëtitia Cuchet (4e année DOE), Antoine Buon (4e année DOE), Eléonore Fines (4e année DVG), Lucie Sahuquet (4e année DVG), Romane Poupelin (3e année DVG), Antoine Souvent (5e année DVG)

Ce workshop a été mené en dehors des murs de l'Écoles Supérieure d'Arts et de Design d'Orléans dut au confinement imposé par la pandémie du COVID19.