Journal des UEL "ART NUMERIQUE"

Guykayser  Gérard Paresys 
Geneviève Guétemme  Caroline Cance


lasource

UEL1 "Art numérique": Journal

Programme  UEL1 Semestre 3 "Art numérique" ULGI023A
portée par l'ESPE (Ecole supérieure du professorat et de l'éducation)
Enseignante référente: Geneviève Guétemme (Maître de conférences Arts et sciences de l’art)
15 étudiants - 15 heures - le jeudi de 15h à 17h
Les inscriptions se feront en ligne: dès 8h le 8 septembre et jusqu'au 12 septembre inclus
Séances 3 à 8 en salle informatique 157 au LLSH (Lettres, Langues et Sciences Humaines)

      Séance
 1 22- 9-2016  1h    Introduction UEL1 avec Geneviève Guétemme au Bouillon

 2 29- 9-2016  2h    La voix numérisée: Enregistrer et Ecouter, Questionner et Répondre,
 3  6-10-2016  2h                       Transférer, Monter, Transformer

 4 13-10-2016  2h    L'image numérisée: Photographier, Cadrer, Regarder, Transférer,
 5 20-10-2016  2h                       Monter, Transformer

 6  3-11-2016  2h    Les datas: Connexion internet aux banques Hydro
                                                   aux sites d'alerte: Vigicrues
                                                   au site Corpus de la parole

 7 10-11-2016  2h    Faire interagir la voix, l'image, les datas
 8 17-11-2016  2h    Sonification, Visualisation

    8-12-2016  1h    Contrôle terminal de 15h à 16h en salle informatique 157 au LLSH

Voir: pdf Fiches descriptives semestre 3 (page 32)


Participants UEL1:
Adrien P, Aurélie M, Cécile B, Côme V, Dany B, Erika V, Guillaume M, Loïs M, Marie B, Marie F, Matthieu B, Mina F, Pénélope S, Quentin L, Tiphaine D


22 septembre 2016 15h..16h Séance 1/8
 
Introduction UEL1 par Geneviève Guétemme
                  avec Guykayser et Gérard Paresys

Au Club du Bouillon (Centre Culturel de l'Université) -> présenter les oeuvres...

encart paysage_du_larynx

Partir de là pour présenter le travail proposé dans l'UEL...



29 septembre 2016 15h..17h Séance 2/8

Matériel: 8 enregistreurs audio avec microphone et casque.
          Pieds de micro, Cartes SD pour les enregistreurs.

Au Théâtre du Bouillon

Avec des étudiants du cours de "Français langue étrangère" (FLE) de Catherine Brumelot de l'Institut de Français de l'Université d'Orléans (IDF)

Les étudiants, par groupe, s'enregistrent.
Un étudiant pose les questions.
Un étudiant répond aux questions.
Un étudiant s'occupe de l'enregistreur (écoute au casque).
A la fin les rôles changent, ça tourne.

Intention
Nous désirons enregistrer des voix qui nous parlent des lieux, du trajet entre les lieux, de la présence ou non du fleuve (la Loire à Orléans ou autre...) dans ce trajet, dans ces lieux qui concernent la vie personnelle des étudiants.
Quel est l'importance de ces trajets dans la vie quotidienne des étudiants.
Cela doit constituer un début d'autoportrait collectif sonore des étudiants.

Des questions "basiques":
Où sommes-nous?
D'où viens-tu?
Comment es-tu venu?
... improviser des questions/réponses à partir de là...

Veiller à la qualité technique de l'enregistrement.

 Les enregistrements sonores:

CarteSD1 & CarteSD6
CarteSD1-1003.MP3 56Mo
CarteSD6-1003.MP3 44Mo
La même conversation est enregistrée 2 fois sur 2 enregistreurs différents.
Matthieu, Aurélie, Tiphaine, Côme, Ayako, Satone, Miwa, Calistene ?
CarteSD2
CarteSD2-ob003.MP3 3Mo
CarteSD2-ob004.MP3 4Mo
CarteSD2-ob005.MP3 5Mo
CarteSD2-ob006.MP3 6Mo
CarteSD2-ob008.MP3 4Mo
CarteSD2-ob0011.MP3 6Mo
CarteSD2-ob0012.MP3 4Mo
CarteSD2-ob0013.MP3 3Mo
CarteSD2-ob0014.MP3 4Mo
CarteSD2-ob0015.MP3 4Mo
CarteSD2-ob0016.MP3 4Mo
CarteSD2-ob0017.MP3 5Mo
Adrien, Qianyi, Qiu ,Tamami, Li, Nana
CarteSD4
CarteSD4-1001.MP3 25Mo
CarteSD4-1002.MP3 30Mo
Loïs, Gulay, Manal, Pénélope, Dany, Cécile
CarteSD7
CarteSD7-1001.MP3 77Mo
Guillaume, Hala, Sara, Nanami, Ali, Cristian, Quentin
CarteSD8
CarteSD8-1001.MP3 76Mo
Mina, Marie, Lan, Sophie, Yimi, Yuhao


Quelques liens:
Le son, la voix -> Un peu de technique DeLaTechnique

L'image, le pixel -> sur le site OpenProcessing:

pixel_knitting Pixel Knitting  pixel_knitting2 de emoc 

Flusser Flusser's magic imaginery

sorting_1 sorting_1 Origine: Zombie Death Connections2 Connections2 

HammerField HammerField (code) de Casey Reas


Le logiciel Processing



Un projet: Time-Lapse de la Loire?

Après:
Les fichiers audio enregistrés sont transférés dans les PC (sur un serveur?).
 


6 octobre 2016 15h..17h Séance 3/8

Matériel: Enregistreur audio avec microphone et casque.
          15 ordinateurs + casque + logiciel Audacity

en salle informatique 157 au LLSH

Suite de la séance 2...
Suite des prises de son. 13 voix en solo (fichiers .wav).
Voix-6-10-2016.zip  353Mo 

Travail d'écoute.
Apprentissage du logiciel Audacity Audacity-212-Windows
"Nettoyage" des prises de son, montage.
Sélection des 1 à 2 minutes les plus intéressantes d'un point de vue du sens, de la qualité sonore, de la "musique" de la voix...

Le travail avec Audacity de:
Guillaume, Côme, Pénélope, Erika, Aurélie, Mina, Cécile, Marie et Marie:
AvecAudacity.zip 570Mo  (retiré du site 12 1 2017)



13 octobre 2016 15h..17h Séance 4/8

Matériel: Appareil photo ou smartphone personnel.

ParcFloralDeLaSource Rendez-vous à 15 heures à l'entrée du Parc Floral de la Source (Avenue du Parc Floral).
Pour réaliser des photos autour de la source du Loiret.

Amener si possible de quoi prendre des photos (appareil photo, smartphone...)
et si possible de quoi les transférer sur un PC.

C'est à environ 10 min à pied de la salle informatique 157 au LLSH.


 Lien GoogleMaps

 ../ARGOPd/wikipedia-16x16 Wikipedia Loiret (rivière)
 
 
L'image numérisée: Photographier, Cadrer, Regarder, Transférer...

Vu, entendu:

05a_fft_particle_system-modif 05a_fft_particle_system-modif avec la voix de Cécile

kandinskify-modif kandinskify-modif avec la voix de Mina

OilPainting oilpainting de Javier Gracia Carpio
...

Initiation au codage informatique avec p5.js en langage JavaScript.

Un (simple) programme qui affiche un fichier image: Ex-p5-Image1.zip Ex-p5-Image1

Editer le programme en JavaScript "sketch.js" avec un éditeur de texte (WordPad sous Windows par exemple).

// Ex-p5-Image1
// Affiche une image
// Pour p5.js
// Utilise: libraries/p5.js
// http://p5js.org/reference/#/p5/image

var img;

function preload() {
  img = loadImage("IMG_8583-1024x768.jpg");
}

function setup() {
  createCanvas(1024, 768);
}

function draw() {
  image(img, 0, 0);
}

Exécuter le programme en ouvrant "index.html" avec un navigateur.



20 octobre 2016 15h..17h Séance 5/8

L'image numérisée: Regarder, Transférer, Monter, Transformer, Coder

Transfert des images prises le 13 octobre

Vu, entendu:
FFT_Unknown_Pleasures-modif FFT_Unknown_Pleasures-modif avec la voix de Adrien

Code en langage JavaScript avec p5.js.

Ex-p5-Audio-Image2 Code: Ex-p5-Audio-Image2.zip 



3 novembre 2016 15h..17h Séance 6/8

hydrogramme_1866.zip
 
Coder avec p5
 
p5.js -> Reference
      -> p5.sound library 
      -> Tutorials

JavaScript sur mozilla.org -> Reference

JavaScript Tutorial sur w3schools

../ARGOPd/wikipedia-16x16fr Processing   ../ARGOPd/wikipedia-16x16en Processing   Site Processing
 
Le code: Ex-p5-Audio-Image7.zip -> Ex-p5-Audio-Image7

Crue-Amboise-1866 Les data:
Crue-1866.txt
des hauteurs d'eau de la Loire à Amboise pendant la crue de 1866
modulent le son de la voix (accélération / décélération).

Ces data viennent du site Hydro 
 
et Ex-p5-Audio-Image7-GK avec un son de groupe

Afficher et jouer avec des data -> wallstreetcrashnoisemaker

Après la séance...

Ex-p5-Audio-Image7-GK-Modif2 avec 6 fichiers audio de voix choisis au hasard.
Code -> Ex-p5-Audio-Image7-GK-Modif2.zip 



10 novembre 2016 15h..17h Séance 7/8

A voir:

 - Exemples de code p5 sur le site: lyceelecorbusier 

 - Les Hommes Debout Installation urbaine lumineuse, bavarde et interactive

 - Site p5.js -> Examples ->
image-alpha-mask
image-transparency
image-pointillism    -> Code: 3Codes.zip
 
 - Des ronds dans l'eau: wemakeawesomesh.it/musicviz/ripple/


Après la séance...

 - Masque Mask Code: Ex-p5-Image10-Mask.zip

 - Panoramique Ex-p5-Image11-Scroll Code: Ex-p5-Image11-Scroll.zip 

 - Comme du sable Ex-p5-Pixel7-Alea Code: Ex-p5-Pixel7-Alea.zip



17 novembre 2016 15h..17h Séance 8/8

Code: Intégrer du texte: testpanoModif2 testpanoModif2 Code: testpanoModif2.zip
 


Quelques simples sketches p5 -> p5index


Si vous rencontrez des difficultés vous pouvez nous faire parvenir votre projet en.zip, on le regarde on le retravaille avec vos instructions et on vous le renvoie ...

Rendez vous à cette adresse:
http://guykayser.autoportrait.com/telechargement-uel


8 décembre 2016 15h..16h Contrôle terminal
de 15h à 16h en salle informatique 157 au LLSH

Les 8 projets présentés:

Dany B & Loïs M: Ricochet De Mots
RicochetDeMots
 


Cécile B & Pénélope S: Projet-Cecile-Penelope
Projet-Cecile-Penelope




Aurélie M & Erika V: Projet-Erika-Aurelie
Projet-Erika-Aurelie




Côme V & Matthieu B & Tiphaine D: Projet-Matthieu-Tiphaine-Come
Projet-Matthieu-Tiphaine-Come




Quentin L: Glé
Gle




Marie B: Projet-MarieB
Projet-MarieB




Adrien P: Malaise
Malaise




Marie F & Guillaume M & Mina F: Jamais le même fleuve
jamais_le_meme_fleuve



lasource
 
Ancre UEL2 "Art numérique": Journal

Programme  UEL2 Semestre 2 ou 4 "Art numérique" ULGP023A
portée par le Département Sciences du Langage et le LLL (Laboratoire Ligérien de Linguistique)
Enseignante référente: Caroline Cance
15 étudiants - 15 heures
Les inscriptions se feront en ligne: dès 8h du 1er au 5 décembre 2016.
Le jeudi : (6 séances de 2h [15h- 17h] + 2 séances d’1h30 [15h- 16h30])
Au Théâtre du Bouillon puis en salle informatique 157 au LLSH (Lettres, Langues et Sciences Humaines)

Objectifs
Les étudiants découvriront:
- un espace et des outils d'expérimentation artistique
- la pratique d'un (groupe d') artiste(s)
- les caractéristiques de la création numérique articulées avec l'histoire des arts plastiques
Ils se mettront en posture de réfléchir et d'innover.
Ils réaliseront des objets numériques qui pourront être mises en réseau et présentées au "Grand-Bain".

      Séance
 1 19-1-2017  2h    Présentation de l’UEL avec Caroline Cance au Théâtre du Bouillon
                    La voix numérisée: Enregistrer et Ecouter, Questionner et Répondre,
 2 26-1-2017  2h                       Transférer, Monter, Transformer
 3  2-2-2017  2h                       Transcrire... Le texte numérisé

 4  9-2-2017  2h    L'image numérisée: Photographier, Cadrer, Regarder, Transférer
                            (Prises de vue sur le campus de l'université) Vidéo?
 5 16-2-2017  2h                       Monter, Transformer...  

 6  2-3-2017  2h    Les datas: Connexion internet aux banques de données...
 7  9-3-2017  1h30  Interaction: voix, image, texte, datas
 8 16-3-2017  1h30               Sonification, Visualisation
   13-4-2017  1h    à 15h Contrôle terminal: Présentation des travaux

Voir: pdf Calendrier universitaire 2016-2017
      pdf Fiches descriptives semestre 2 4 (page 9)

Participants UEL2:
Maena B, Delphine B, Solemne C, Clemence C, Coline D, Morgane F, Flavien F, Nicolas G, Marie G, Clara L, Triomphe M, Erika N, Amelie R, Anais S, Yiran Y


19 janvier 2017 15h..16h30 Séance 1/8
 
Introduction UEL2 par Jean Louis Tallon et Caroline Cance
                  avec Guykayser et Gérard Paresys

au Théâtre du Bouillon (Centre Culturel de l'Université)

Avec des étudiants du cours de "Français langue étrangère" (FLE) de Catherine Brumelot de l'Institut de Français de l'Université d'Orléans (IDF)

Présentation de quelques projets des étudiants de l'UEL1 (voir ci-dessus)

PMD661MK2 Matériel: 6 enregistreurs audio avec microphone et casque
          Cartes SD, piles pour les enregistreurs.


   ... 6 enregistrements de conversations


26 janvier 2017 15h..17h Séance 2/8

en salle informatique 157 au LLSH (Lettres, Langues et Sciences Humaines)
 
Transfert des fichiers Audio enregistrés lors de la première séance sur les PC.

Ecoute, Montage, Choix avec le logiciel Audacity Audacity-212-Windows  



2 février 2017 15h..17h Séance 3/8

en salle informatique 157 au LLSH (Lettres, Langues et Sciences Humaines)

Signature: Formulaire de consentement ESLO2

Transcription de l'enregistrement Audio choisi à la séance précédente.

Avec le logiciel Transcriber Transcriber

Les voix et les transcriptions: VoixTranscription-2-2-2017.zip (51M)



9 février 2017 15h..17h Séance 4/8

Matériel: Appareil photo ou smartphone personnel.
          et de quoi transférer les fichiers sur un PC

Photos sur le site de l'université.
Retour en salle informatique, transfert des images.

Logiciel Gimp        "Image Manipulation Program"
Détourage
   


16 février 2017 15h..17h Séance 5/8
Travail de l'image.
Gimp
Détourage, transparence -> images .png
Images de fond 800 x 600 pixels .jpg



2 mars 2017 15h..17h Séance 6/8

Méthode Voix & Texte

Parole
  -> Enregistrement Audio numérique
    -> Fichier .mp3 ou .wav
      -> Ecoute, Montage, Normalisation avec Audacity
        -> Fichier .wav   (Exemple Amelie.wav)
          -> Transcription avec Transcriber
            -> Fichier .trs   (Exemple Amelie.trs)
              -> Praat + EasyAlign
              -> ou SPPAS v1.8.1
                -> Fichier .TextGrid avec 4 interval tiers   (Exemple Amelie.TextGrid):
                       Trans / PhonAlign / TokensAlign / Syllables
                       Transcription / Phonème / Mot / Syllabe
                  -> TextGrid to XML  XMLisation de TextGrid
                    -> Fichier format XML   (Exemple Amelie.xml)
                      -> Vérification du fichier .xml: Ouverture avec Firefox, gedit
                        -> p5.XML  loadXML de p5.js
                        ou
                        -> XML to JSON converter online
                           -> Enregister le fichier avec l'encodage UTF-8
                           + JSON Formatter & Validator
                               JSON Standard RFC 4627
                               JSON Template 2 Space Tab
                          -> Fichier format JSON  (Exemple Amelie.json)
                            -> loadJSON()  saveJSON()  de p5.js

 -> Sketch p5: Ex-p5-JSONTextGrid1 Source: Ex-p5-JSONTextGrid1.zip (2.8M)

   Ouvre, affiche le fichier Amelie.json en synchro avec la lecture de Amelie.wav

ok ça enregistre
eeeeuuuhh pffffffff
comment qu'ils utilisent les petits morceaux, oui, de nos voix etc
qu'est-ce que tu penses de cette démonstration ?
...
cette idée ?
pas très difficile à apprendre ou c'eesst ?
eeeuuh ...
ou c'est compliqué
dfaçon on a on a toujours dit que c'était très dur hein
c'était comment ? ...
très bien
pfhhm haha
je pense que c'est intéressant eettt
très étrange
et toi ça te plaît ?
bah oui beaucoup hein
j'aime bien ça
proche de paris
oh a pied... moi aussi a pied
c'est bien plus simple à côté
heuhi hi hi hin
haheu héhéhé
jvous remercie, c'était très bien

   OK Firefox, Chrome en ligne
   Pb Safari, Opera


et un autre sketch p5:

Ex-p5-JSON12 Source: Ex-p5-JSON12.zip

800x600
// Touche R Retour au debut
// Touche S Sauve l'ecran (format jpg) dans le dossier du sketch
// Touche T affiche le temps

OK Firefox, Chrome, Safari, Opera sous MacOSX.11


bouillon
Soirée « Langues et numérique » au Bouillon 
LES CURIOSITÉS LABOMEDIA [concerts/perform./lectures # 02/03]

Vernissage de l’exposition
«Cabinet de curiosités des langues de France»
à partir de 18h32

Soirée performances
«Langue et numérique, le futur c’est zero»
à partir de 20h32



9 mars 2017 15h..16h30 Séance 7/8

1 nouveau sketch p5, avec possibilité d'images en transparence:
Ex-p5-JSON14 Source: Ex-p5-JSON14.zip

800x600
// Touche R Retour au debut
// Touche S Sauve l'ecran (format jpg) dans le dossier du sketch
// Touche T affiche le temps
// Touche Espace Play / Pause

Pour avoir un effet de transparence sur les images, changer la ligne 47 du sketch:
var Transparence = true;

ATTENTION, sur un PC peu puissant, la transparence ralentit considérablement l'exécution du sketch.
Laisser alors la ligne:
var Transparence = false;

Et ajouter une transparence (par exemple 50%) sur les fichiers .png avec Gimp...

OK Firefox, Chrome, Safari, Opera sous MacOSX.11



16 mars 2017 15h..16h30 Séance 8/8

1 nouveau sketch p5:
Ex-p5-JSON15 Source: Ex-p5-JSON15.zip

800x600
// Touche R Retour au debut
// Touche S Sauve l'ecran (format jpg) dans le dossier du sketch
// Touche T affiche le temps
// Touche Espace Play / Pause

// Nouveau:
//   - 5 fichiers Transparence et 5 temps
//   - Texte B en bas sur 2 lignes
//   - TailleTransparentVariable ou pas





6 avril 2017

UEL2 Contrôle terminal en salle informatique 157 au LLSH de 15h .. 16h




24 .. 27 avril 2017 Orléans - Bouillon - Restitution pendant le "Grand Bain 2017"
 
Les voix, le limnimètre et les 144 pixels.

Une installation visuelle, sonore et immersive qui met sur scène un autoportrait collectif collaboratif, composée de toutes nos rencontres pendant cette année de résidence "Arts numériques".
 
... et qui présente l'ensemble des travaux des étudiants des 2 UEL.
 
 
lasource

Thème
 
Un Autoportrait collectif des étudiant(e)s, de La Source à la vallée de la Loire

Notre projet de résidence « Arts numériques » est un autoportrait collectif collaboratif .

Il témoignera de la vie de cette communauté humaine, de la diversité des origines géographiques des étudiants et des implantations de l'université dans le bassin de la Loire.

Nous entreprendrons la création d'un dispositif visuel, sonore et immersif, à travers les relations entre la voix, le paysage et les mouvements de la Loire. Ces trois axes formeront la matière de notre résidence, propice à la sensibilisation et à la pratique des arts numériques.

La matière numérique:
    un enregistrement de la voix d'un étudiant
    une photo ou série de photos: paysage trajet: Loire - La Source
    les données d'une station hydrographique rythme lenteur/rapidité



A chaque séance, 2 exemples de réalisation seront présentées.
Un exemple tiré du travail d'un "artiste numérique" et un exemple dans le travail de Guykayser et Gérard Paresys.
Cette présentation ne doit pas dépasser 15 minutes.
Le support de ces présentations sera si possible un site internet pour faciliter l'accès des étudiants en dehors des séances.


Qu'est-ce qu'un art numérique?
Définir le terme: numérique (anglais: digital)
En opposition au terme: analogique
Définir le terme: analogique (anglais: analogic ou analog)
Qu'est-ce qu'un art non numérique, analogique?
Exemples sonores: l'échantillon.
Exemples visuels: le pixel.

lasource

Liens
 

Université d'Orléans
Unités d'Enseignement Libres (UEL)
pdf liste des UEL semestre 3      pdf Fiches descriptives semestre 3
pdf liste des UEL semestre 2 4    pdf Fiches descriptives semestre 2 4

Calendrier 2016/2017

pdf Calendrier universitaire 2016-2017

Le Bouillon

Site Guykayser  
Site Gerard Paresys

Logiciels qui seront (peut-être) utilisés:
Audacity    "multi-track audio editor and recorder"        Download
Praat       "doing phonetics by computer"                  Download
        EasyAlign    "phonetic alignment with Praat"       Download         
        VocalToolKit "Praat plugin with automated scripts" Download
Transcriber "transcription à partir de la voix"            Download
SPPAS       "automatic annotation and analysis of speech"  Download 
Gimp        "Image Manipulation Program"                   Download
Processing  "code within the context of the visual arts"   Download
Pure data   "visual programming language"                  Download
p5.js       "creating graphic and interactive experiences" Download
Movie Maker "video editing software by Microsoft"          Download
Firefox    



Toute personne dont le nom, la photographie, la voix (permettant son identification)
apparaît sur ce site peut à tout moment demander la suppression ou la modification
des informations la concernant en contactant: gerard.paresys
 
Ancre page mise à jour 4 5 2017
 
Paresys Accueil Paresys Home