6 février 2001

 

1) Arborescence
2) Entrée
3) Salles
4) Structure des fichiers
5) Premiere

1) Idée générale du projet.

Plutôt que d'aligner simplement des tableaux et d'y adjoindre d'une manière ou d'une autre un commentaire forcement inintéressant (je ne me sens aucune qualité pour commenter un tableau autrement que subjectivement), j'ai suivi mon penchant pour l'image poétique. Je me suis laissé emporter par l'esprit de ce que Jung appelait la sychronicité, et ai associé aux tableaux qui m'ont paru les plus propres à représenter ce qui me touchait alors encore confusément, des poèmes de Kenneth White qui m'ont littéralement sauté sous les yeux. Ces poèmes ouvrent un espace dans lequel ces tableaux vivent bien. Ce travail n'est plus un exercice, mais une "oeuvre" en tant que telle, un hommage, une rêverie virtualisée. J'ai donc développé ce projet en m'écartant un peu de certaines consignes, d'entente avec Samir Fitouri.

Chaque tableau devant être associé à un poème, il n'était pas possible d'imaginer plusieurs images affichées simultanément. J'ai donc opté pour l'affichage simultané de deux écrans, l'un pour le texte, l'autre pour l'image, dont le contenu changerait en cliquant sur un bouton (trois ou quatre tableaux par poème, qui composeraient une "salle", qui devient alors plutôt un espace de sens.) Mais j'ignorais si cela était possible dans Mediator. J'avais alors aussi l'idée d'imposer un "tour" complet, dans l'ordre des textes et des poèmes afin d'en percevoir la substantifique moelle, et de laisser ensuite l'utilisateur aller où bon lui semble. Il me semble maintenant que l'accès libre, avec toutefois la possibilité de "visiter" les "salles" dans l'ordre, permet une lecture anarchique ou aléatoire très poétique en elle-même, qui va bien avec ce projet, et qui donne un piment supplémentaire quand on cherche à reconstituer un sens que rien ne nous permet de deviner. Une barre de navigation permet cette navigation libre: elle sera présente dans toutes les salles.

 

1b) Arborescence

 

| Haut |

 

2) Description.

 

a) Entrée.

a1) Synopsis
Mise en place des éléments, barre de navigation, boutons une fois que le "générique" est terminé, affiche, présentation des artistes, possibilité d'afficher le contenu des salles ("description" du contenu et titre du poème qui y sera lu).

La barre d'outil contient 4 images représentant les différentes salles, images sans texte: toute indiquation supplémentaire est inutile. En passant le curseur sur l'image, un écran se déroule au dessous, et un texte s'affiche qui décrit le contenu de la salle. Dans l'entrée, au moment de l'affichage de ces éléments, une fois que l'affiche et la barre de navigation sont en place, l'écran se déploie automatiquement et on y voit la présentation de Christine Egger et de Kenneth White, et pourquoi pas, la vidéo de présentation. Puis l'écran se replie, et la barre de navigation sort du champ et les boutons apparaissent, ainsi qu'un texte d'orientation. Le bouton "où suis-je" affiche "Entrée" dans un écran de messages quand on clique dessus, le bouton "où vais-je" appelle la barre de navigation, le bouton "salle suivante" affiche la salle 1, et le bouton "quitter" mène à la sortie.

a2) Technique: construction des objets
a2a) Boutons

J'ai voulu des boutons de navigation simples, clairs, d'une symbolique unique. Des flèches 3D droites et des flèches courbées m'ont paru efficaces dans ce contexte.
- Boutons-images sur la barre de navigation : boutoncri.jpg, boutondebut.jpg, boutondefaite.jpg, boutonhomme.jpg: hauteur = 50 pxls, effet: lueur externe dans Photoshop.
- anipla.jpg: h & l = 50 pxls. Calque, effet: lueur externe, superposition, opacité=100, atténuation=8, intensité=600. Objet 3D importé dans Photoshop depuzis Rayflect Phototracer. Réglages, orientation, couleurs, effets: dans Phototracer sans informations disponibles.
- ousuis.jpg:  l = 75 pxls, h = 115pxls. Calque, effet: biseau interne, angle=120, profondeur=3, atténuation=2. Objet 3D importé dans Photoshop depuis Rayflect Phototracer. Réglages, orientation, couleurs, effets: dans Phototracer sans informations disponibles. Texte: calque, effet: ombre portée, mode: produit, angle: 120, distance=5, atténuation=4, intensité=0, position: x=190, y=680.
- ouvais.jpg: h&l = 75 pxls. Calque, effet: biseau interne, angle=120, profondeur=3, atténuation=2. Objet 3D importé dans Photoshop depuis Rayflect Phototracer. Réglages, orientation, couleurs, effets: dans Phototracer sans informations disponibles. Texte: calque, effet: ombre portée, mode: produit, angle: 120, distance=5, atténuation=4, intensité=0, position: x=190, y=680.
- suivant.jpg: h&l = 75 pxls. Calque, effet: biseau interne, angle=120, profondeur=3, atténuation=2. Objet 3D importé dans Photoshop depuis Rayflect Phototracer. Réglages, orientation, couleurs, effets: dans Phototracer sans informations disponibles. Texte: calque, effet: ombre portée, mode: produit, angle: 120, distance=5, atténuation=4, intensité=0, position: x=765, y=680.
- quitter.jpg: h&l = 75 pxls. Calque, effet: biseau interne, angle=120, profondeur=3, atténuation=2. Objet 3D importé dans Photoshop depuis Rayflect Phototracer. Réglages, orientation, couleurs, effets: dans Phototracer sans informations disponibles. Texte: calque, effet: ombre portée, mode: produit, angle: 120, distance=5, atténuation=4, intensité=0, position: x=928, y=680.
 

a2b) Ecrans
- fentxt.jpg. Fenêtre pour afficher les poèmes. Sélection rectangulaire inversée, calque: effet biseau etc...DEVELOPPER
- fentabl.jpg. Fenêtre pour exposer les tableaux. H = 450pxls, l = 350pxls. Sélection ovale inversée, calque, effet: biseau, 2ème calque idem sans biseau, ombre interne.

a2c) Objets
- barre de navigation: 
- affiche: montage de plusieurs parties de tableaux, avec effet sur le deux premiers plans: effet lueur externe, plus ou moins accentué. Titre: lettres =  , effet=estampage.

a2d) Sons
- musique: bricolage personnel avec Acid remixé dans Cooledit. Très imparfait car fait dans l'urgence. Le violoniste est L. Subramanian, le reste est fait de samplings. J'ai voulu quelque chose qui ne soit pas harmonique, quelque chose de basique, qui ait à voir avec un autre espace.
- voix: c' est celle du poète écossais Macdarmid. J'ai tenté de varier la présence de cette voix, pour que parfois elle nous saisisse, d'autre fois elle nous berce.

 

a3) Technique: comportements (Page ready, animations,etc...)
a3a) Ouverture de page:
Une timeline permet de faire apparaître chaque élément au moment voulu. Différentes animations y sont placées: la barre de navigation et l'écran. (vue de la timeline de l'événement PageReady de l'Entrée):

 

a3b) Détails.
- arrivée de la barre de navigation: départ hors champ, y=29. Arrivée: x=28, y=29.
- ouverture et fermeture de l'écran de la barre de navigation:
constitué de deux images, ecranbas01.jpg et ecranhaut01.jpg.
ecranbas01.jpg: départ: x=44, y=31; arrivée:x=44, y=242. Time=1000ms.
ecranhaut01.jpg: départ: x=44, y=64; arrivée:x=44, y=145, Time=600ms.
text01: départ: x=73, y=33; arrivée: x=73, y=156. Time = 800.

Les valeurs dont inversées pour le repli, x secondes plus tard..

Puis apparition de Christineoktxt01 3,5 secondes plus tard.

Pendant le déploiement et la présentation, les boutons sont inactivés (recouvert d'un cache transparent placé in front).. 

 

 

| Haut |

b) Salles

b1) Synopsis
Les éléments ont été mis en place ou visualisés dans l'Entrée, trois boutons supplémentaires s'affichent dans les salles: un bouton "Entrée" qui permet de retourner au début, dans l'entrée, un bouton "image suivante" pour afficher le tableau et le texte suivants, et un bouton "recommencer" pour retourner au premier tableau et premier texte de cette salle. S'affichent aussi les deux cadres dans lesquels apparaîtront textes et tableaux. D'entrée le texte 1 et le tableau 1 sont affichés.

Le bouton "où suis-je" affiche p.ex "Salle 1. Avant" dans un écran de messages quand on clique dessus, le bouton "où vais-je" appelle la barre de navigation, le bouton "salle suivante" affiche la salle suivante. L'écran de messages zoom in et zoom out. Enfin le bouton "quitter" mène à la sortie.

Ainsi il est possible d'aller partout depuis partout, ce qui ressort de l'arborescence. Comme tout est imaginable, je vois mal comment décrire dans le détail chaque possibilité. J'y renonce donc.

Immédiatement on entend le poète Macdiarmid  lire un long poème (poète écossais comme lui que Kenneth White apprécie beaucoup et qu'il a beaucoup étudié par exemple dans L'esprit nomade, Paris, Grasset, 1987), extraits différents pour chaque salle.. J'aime cet assemblage de texte, d'image et de son. Un extrait différent est associé à chaque tableau. Dans la salle 1, salle du silence des pierres, du silence d'avant la parole, il n'y a pas de poème lu.

 

b2) Technique: construction des objets

b2a) Boutons supplémentaires
- douviens.jpg: h&l = 75 pxls. Calque, effet: biseau interne, angle=120, profondeur=3, atténuation=2. Objet 3D importé dans Photoshop depuis Rayflect Phototracer. Réglages, orientation, couleurs, effets: dans Phototracer sans informations disponibles. Texte: calque, effet: ombre portée, mode: produit, angle: 120, distance=5, atténuation=4, intensité=0, position: x=23, y=680.
- recommencer.jpg: h&l = 75 pxls. Calque, effet: biseau interne, angle=120, profondeur=3, atténuation=2. Objet 3D importé dans Photoshop depuis Rayflect Phototracer. Réglages, orientation, couleurs, effets: dans Phototracer sans informations disponibles. Texte: calque, effet: ombre portée, mode: produit, angle: 120, distance=5, atténuation=4, intensité=0, position: x=848, y=680.
- anipla01.jpg: Pour afficher les poèmes et les images les unes après les autres. Objet 3D importé dans Photoshop depuis Rayflect Phototracer. Réglages, orientation, couleurs, effets: dans Phototracer sans informations disponibles. Texte: calque, effet: estampage.

b2b) Autres objets
- fentxt01.jpg. Pour afficher les poèmes. Sélection rectangulaire inversée. Effet biseau ds calque. Tons clairs:mode superposition. Tons foncés:mode produit. h&l = 448 pxls. Position: x=27, y=172.

Les fonds d'écran.
Chaque fonds est un peu différent, une autre couleur donne une tonalité particulière à chaque salle.

b3) Technique: comportements (Page ready, animations,etc...)

La barre de navigation se comporte dans les pages comme dans l'entrée, seul le contenu diffère. Ici on accède, en passant le curseur sur le bouton représentant la page, à un écran contenant une "description" de la page. En cliquant, on arrive à la page. Il faudrait empêcher que la conséquence d'un passage rapide sur les images soit un embrouillamini de lettres, puisque tous les textes s'affichent en même temps. Le meilleur moyen serait le curseur-sablier qui interdit toute autre opération avant que l'affichage ne soit achevé, mais aucun curseur ne s'affiche correctement dans Mediator, ce que je ne m'explique pas. En attendant mieux, il faut passer lentement d'une image à l'autre.

Le bouton "image suivante" (anipla01.jpg) est fait d'une superposition d'images transparente auxquelles j'ai associé des comportements différents: ils font apparaître une image et un texte, tout en faisant disparaître l'image et le texte précédents. La subtilité est qu'elles se font disparaître elles-même et font apparaître (= rendent actifs) la couche suivante.

Ex: la couche "suivant2" se cache alors qu'elle fait apparaître "suivant3"

Le bouton "recommencer" est un peu compliqué, il doit pouvoir effacer tout ce qui se trouve affiché au moment où il est cliqué, qu'importe l'image qui est alors affichée. Le son doit recommencer au début:


Le bouton "où vais-je" appelle la barre de navigation: un texte s'affiche dans l'écran de "communication" fenetrou01.jpg indiquant qu'il suffit de cliquer avec la touche droite de la souris sur la barre de navigation pour qu'elle se retire.

Cet écran disparaît après 3 secondes.

Le bouton "où suis-je" utilise le même écran de communication pour afficher la salle:

Le nom de ce fichier texte, chaosalle, est exotique, il vient de la première version de ce projet.

 

 

| Haut |

 

4) Structure des fichiers

4a) Entrée

 

4b) Salles

 

 

 

5) Travaux avec Adobe Premiere.

Montage du clip vidéo, avec suppression du son et inclusion de deux transitions. Basique, peu spectaculaire.

 

---

 

| Haut |