JavaScool:ProgletsProcessing : Différence entre versions

De Sciencinfolycee
Aller à : navigation, rechercher
m (Page créée avec « Catégorie:JavaScoolRes __NOTOC__ == Les «educlets» et «proglets» de [http://www-sop.inria.fr/members/Cecile.Picard Cécile Picard-Lippens] dans [http://javascool.gf... »)
 
m
 
(5 révisions intermédiaires par le même utilisateur non affichées)
Ligne 1 : Ligne 1 :
 
[[Catégorie:JavaScoolRes]] __NOTOC__  
 
[[Catégorie:JavaScoolRes]] __NOTOC__  
== Les «educlets» et «proglets» de [http://www-sop.inria.fr/members/Cecile.Picard Cécile Picard-Lippens] dans [http://javascool.gforge.inria.fr JavaScool]. ==
+
== Les «educlets» et «proglets» de [http://www-sop.inria.fr/members/Cecile.Picard Cécile Picard-Limpens] dans [http://javascool.gforge.inria.fr JavaScool]. ==
  
<div>Une «proglet» permet de manipuler et d'expérimenter des algorithmes à travers des objets numériques.</div>
+
<div>Une «proglet» permet de manipuler un objet numérique et de le faire fonctionner avec des algorithmes.</div>
 +
<div>Une «educlet» permet de manipuler un objet numérique et de le faire fonctionner à travers une interface graphique.</div>
  
http://www.openprocessing.org/portal/?userID=8553
+
<div>English version on '''[http://www.openprocessing.org/portal/?userID=8553 fuscia@openprocessing.org]'''</div>
  
Pour s'initier à la programmation, nous vous offrons plusieurs proglets, sous forme d'exercices animés et interactifs,<sup>[#1 1]</sup> sont disponibles [http://javascool.gforge.inria.fr/v3/?page=api:/org/javascool/doc-files/about-proglets.htm ici]. dont certaines sont développées en [http://www.processing.org processing]<nowiki>: </nowiki>
+
{| class="table" width="90%" cellpadding="5px" align="center"
 
 
{| class="table" width="90%" cellpadding="5px" align="center" bgcolor="#eeeeee"
 
| valign="top" |
 
| valign="top" |
 
| valign="top" |
 
| valign="top" |
 
| valign="top" |
 
| valign="top" |
 
| valign="top" | Auteur
 
| valign="top" |
 
 
|-
 
|-
| valign="top" |
+
||
«Exploration sonore» <div>[[Image:smallImage.jpg]]</div>
+
«Exploration sonore» <br><html>
| valign="top" |
+
<a href="http://javascool.gforge.inria.fr/documents/sketchbook/exploSonore/exploSonore.mov">
[http://javascool.gforge.inria.fr/v3/?page=doc:/sketchbook/ExplorationSonore/activites-unplug.htm Description]
+
<img width="400" alt="video" src="http://javascool.gforge.inria.fr/documents/sketchbook/exploSonore/ExplorationSonore_xml.png"/>
| valign="top" |
+
</a></html>
[http://vimeo.com/17929355 Demo]
+
||
| valign="top" |
+
* [http://javascool.gforge.inria.fr/v4/index.php?page=proglets&action=show&id=exploSonore «proglets»]
[http://javascool.gforge.inria.fr/v3/?page=doc:/sketchbook/ExplorationSonore/about-proglet.htm Usage]
+
* [http://www.openprocessing.org/visuals/?visualID=16032 «educlet»]
| valign="top" |
+
* [http://javascool.gforge.inria.fr/v4/documents/sketchbook/exploSonore/activites-unplug.htm «activité»]
[http://www.openprocessing.org/visuals/?visualID=16032 Proglet]
+
* [http://vimeo.com/17929355 «démonstration»]
| valign="top" |
+
||  
[http://javascool.gforge.inria.fr/v3/?page=doc:/sketchbook/ExplorationSonore/sujet-creation-de-sons.htm Activité]
+
Permet de visualiser l'évolution temporelle et le contenu fréquentiel (le spectre) d'un son.
| valign="top" |
 
CP<sup>[#4 4]</sup>@[http://www.openprocessing.org/portal/?userID=8553 fuscia]
 
| valign="top" | permet de visualiser l'évolution temporelle et le contenu fréquentiel (le spectre) d'un son.
 
 
|-
 
|-
| valign="top" |
+
||
«Cryptage RSA» <div>[[Image:smallImage.jpg]]</div>
+
«Cryptage RSA» <br><html>
| valign="top" |
+
<a href="http://javascool.gforge.inria.fr/documents/sketchbook/cryptageRSA/cryptageRSA.mov">
[http://javascool.gforge.inria.fr/v3/?page=doc:/sketchbook/CryptageRSA/activites-unplug.htm Description]
+
<img width="400" alt="video" src="http://javascool.gforge.inria.fr/documents/sketchbook/cryptageRSA/CryptageRSA_xml.png"/>
| valign="top" |
+
</a></html>
| valign="top" |
+
||
[http://javascool.gforge.inria.fr/v3/?page=doc:/sketchbook/CryptageRSA/about-proglet.htm Usage]
+
* [http://javascool.gforge.inria.fr/v4/index.php?page=proglets&action=show&id=cryptageRSA «proglets»]
| valign="top" |
+
* [http://www.openprocessing.org/visuals/?visualID=16149 «educlet»]
[http://www.openprocessing.org/visuals/?visualID=16149 Proglet]
+
* [http://javascool.gforge.inria.fr/v4/documents/sketchbook/exploSonore/activites-unplug.htm «activité»]
| valign="top" |
+
* [http://javascool.gforge.inria.fr/documents/sketchbook/cryptageRSA/cryptageRSA.mov «démonstration»]
[http://javascool.gforge.inria.fr/v3/?page=doc:/sketchbook/CryptageRSA/sujet-about-cryptageRSA.htm Activité]
+
||  
| valign="top" |
+
Permet de manipuler les concepts liés à l'encryptage/décryptage par clés publique et privée.
CP<sup>[#4 4]</sup>@[http://www.openprocessing.org/portal/?userID=8553 fuscia]
 
| valign="top" | permet de manipuler les concepts liés à l'encryptage/décryptage par clés publique et privée.
 
 
|-
 
|-
| valign="top" |
+
||
«En Voiture» <div>[[Image:smallImage.jpg]]</div>
+
«En Voiture» <br><html>
| valign="top" |
+
<a href="http://javascool.gforge.inria.fr/documents/sketchbook/enVoiture/enVoiture.mov">
[http://javascool.gforge.inria.fr/v3/?page=doc:/sketchbook/EnVoiture/activites-unplug.htm Description]
+
<img width="400" alt="video" src="http://javascool.gforge.inria.fr/documents/sketchbook/enVoiture/EnVoiture_xml.png"/>
| valign="top" |
+
</a></html>
| valign="top" |
+
||
[http://javascool.gforge.inria.fr/v3/?page=doc:/sketchbook/EnVoiture/about-proglet.htm Usage]
+
* [http://javascool.gforge.inria.fr/v4/index.php?page=proglets&action=show&id=enVoiture «proglets»]
| valign="top" |
+
* [http://www.openprocessing.org/visuals/?visualID=16153 «educlet»]
[http://www.openprocessing.org/visuals/?visualID=16153 Proglet]
+
* [http://javascool.gforge.inria.fr/v4/documents/sketchbook/enVoiture/activites-unplug.htm «activité»]
| valign="top" |
+
* [http://javascool.gforge.inria.fr/documents/sketchbook/enVoiture/enVoiture.mov «démonstration»]
[http://javascool.gforge.inria.fr/v3/?page=doc:/sketchbook/EnVoiture/sujet-about-voiture.htm Activité]
+
||  
| valign="top" |
+
Vise à s’approprier les différents éléments caractéristiques d’un graphe, en vue de saisir les algorithmes qui en font usage 1/2.
CP<sup>[#4 4]</sup>@[http://www.openprocessing.org/portal/?userID=8553 fuscia]
 
| valign="top" | vise à s’approprier les différents éléments caractéristiques d’un graphe, en vue de saisir les algorithmes qui en font usage 1/2.
 
 
|-
 
|-
| valign="top" |
+
||
«Un graphe des chemins» <div>[[Image:smallImage.jpg]]</div>
+
«Un graphe des chemins» <br><html>
| valign="top" |
+
<a href="http://javascool.gforge.inria.fr/documents/sketchbook/grapheEtChemins/grapheEtChemins.mov">
[http://javascool.gforge.inria.fr/v3/?page=doc:/sketchbook/UnGrapheDesChemins/activites-unplug.htm Description]
+
<img width="400" alt="video" src="http://javascool.gforge.inria.fr/documents/sketchbook/grapheEtChemins/UnGrapheDesChemins_xml.png"/>
| valign="top" |
+
</a></html>
[http://vimeo.com/17929441 Demo]
+
||
| valign="top" |
+
* [http://javascool.gforge.inria.fr/v4/index.php?page=proglets&action=show&id=grapheEtChemins «proglets»]
[http://javascool.gforge.inria.fr/v3/?page=doc:/sketchbook/UnGrapheDesChemins/about-proglet.htm Usage]
+
* [http://www.openprocessing.org/visuals/?visualID=16148 «educlet»]
| valign="top" |
+
* [http://javascool.gforge.inria.fr/v4/documents/sketchbook/grapheEtChemins/activites-unplug.htm «activité»]
[http://www.openprocessing.org/visuals/?visualID=16148 Proglet]
+
* [[http://vimeo.com/17929441 «démonstration»]
| valign="top" |
+
||  
[http://javascool.gforge.inria.fr/v3/?page=doc:/sketchbook/UnGrapheDesChemins/sujet-about-chemins.htm Activité]
+
Vise à s’approprier les différents éléments caractéristiques d’un graphe, en vue de saisir les algorithmes qui en font usage 2/2.
| valign="top" |
 
CP<sup>[#4 4]</sup> @[http://www.openprocessing.org/portal/?userID=8553 fuscia]
 
| valign="top" | vise à s’approprier les différents éléments caractéristiques d’un graphe, en vue de saisir les algorithmes qui en font usage 2/2.
 
|}
 
 
 
<br />
 
 
 
<div>
 
 
 
== Autres «educlets». ==
 
 
 
<div>Ces «educlets» ne sont pas des «proglets» (on les utilisent en "cliquant", mais ne sont pas programmable).</div>
 
 
 
{| class="table" width="90%" cellpadding="5px" align="center" bgcolor="#eeeeee"
 
| valign="top" |
 
| valign="top" |
 
| valign="top" |
 
| valign="top" |
 
| valign="top" | Auteurs
 
| valign="top" |
 
 
|-
 
|-
| valign="top" |
+
||
«Boite à Musique» <div>[[Image:smallImage.jpg]]</div>
+
«Boite à Musique» <br><html>
| valign="top" |
+
<a href="http://javascool.gforge.inria.fr/documents/sketchbook/BoiteAMusique/BoiteAMusique.mov">
[http://javascool.gforge.inria.fr/v3/?page=doc:/sketchbook/BoiteAMusique/activites-unplug.htm Description]
+
<img width="400" alt="video" src="http://javascool.gforge.inria.fr/documents/sketchbook/BoiteAMusique/BoiteAMusique_xml.png"/>
| valign="top" |
+
</a></html>
[http://vimeo.com/17928229 Demo]
+
||
| valign="top" |
+
* [http://www.openprocessing.org/visuals/?visualID=16253 «educlet»]
[http://www.openprocessing.org/visuals/?visualID=16253 Proglet]
+
* [http://javascool.gforge.inria.fr/v4/documents/sketchbook/BoiteAMusique/activites-unplug.htm «activité»]
| valign="top" |
+
* [[http://vimeo.com/17928229 «démonstration»]
CP<sup>[#4 4]</sup>@[http://www.openprocessing.org/portal/?userID=8553 fuscia]
+
||  
| valign="top" | permet de se familiariser à la notion de composition sonore et l'assemblage de sons.
+
Permet de se familiariser à la notion de composition sonore et l'assemblage de sons.
 
|-
 
|-
| valign="top" |
+
||
«Analyseur» <div>[[Image:smallImage.jpg]]</div>
+
«Analyseur» <br><html>
| valign="top" |
+
<img width="400" alt="video" src="http://javascool.gforge.inria.fr/documents/sketchbook/Analyseur/Analyseur_xml.png"/>
[http://javascool.gforge.inria.fr/v3/?page=doc:/sketchbook/Analyseur/activites-unplug.htm Description]
+
</html>
| valign="top" |
+
||
| valign="top" |
+
* [http://www.openprocessing.org/visuals/?visualID=16155 «educlet»]
[http://www.openprocessing.org/visuals/?visualID=16155 Proglet]
+
* [http://javascool.gforge.inria.fr/v4/documents/sketchbook/Analyseur/activites-unplug.htm «activité»]
| valign="top" |
+
||  
CP<sup>[#4 4]</sup>@[http://www.openprocessing.org/portal/?userID=8553 fuscia]
+
Permet de visualiser le contenu fréquentiel des graves aux aigus (le spectre) d'un son produit dans l'environnement.
| valign="top" | permet de visualiser le contenu fréquentiel des graves aux aigus (le spectre) d'un son produit dans l'environnement.
 
 
|-
 
|-
| valign="top" |
+
||
«Vaguelettes ajustables» <div>[[Image:smallImage.jpg]]</div>
+
«Vaguelettes ajustables» <br><html>
| valign="top" |
+
<img width="400" alt="video" src="http://javascool.gforge.inria.fr/documents/sketchbook/VaguelettesAjustables/VaguelettesAjustables_xml.png"/>
[http://javascool.gforge.inria.fr/v3/?page=doc:/sketchbook/VaguelettesAjustables/activites-unplug.htm Description]
+
</html>
| valign="top" |
+
||
| valign="top" |
+
* [http://www.openprocessing.org/visuals/?visualID=16159 «educlet»]
[http://www.openprocessing.org/visuals/?visualID=16159 Proglet]
+
* [http://javascool.gforge.inria.fr/v4/documents/sketchbook/VaguelettesAjustables/activites-unplug.htm «activité»]
| valign="top" |
+
||  
CP<sup>[#4 4]</sup>@[http://www.openprocessing.org/portal/?userID=8553 fuscia]
+
Permet d'illustrer ce qu'est une onde, comment elle naît et se propage.
| valign="top" | permet d'illustrer qu'est-ce qu'une onde, comment elle naît et se propage.
 
 
|-
 
|-
| valign="top" |
+
||
«Magnetophone» <div>[[Image:v3]]</div>
+
«Magnetophone» <br><html>
| valign="top" |
+
<img width="400" alt="video" src="http://javascool.gforge.inria.fr/documents/sketchbook/Magnetophone/Magnetophone_xml.png"/>
[http://javascool.gforge.inria.fr/v3/?page=doc:/sketchbook/Magnetophone/activites-unplug.htm Description]
+
</html>
| valign="top" |
+
||
| valign="top" | (utilisable localement uniquement)
+
* [http://javascool.gforge.inria.fr/v4/documents/sketchbook/Magnetophone/activites-unplug.htm «activité»]
| valign="top" |
+
||
CP<sup>[#4 4]</sup>@[http://www.openprocessing.org/portal/?userID=8553 fuscia]
+
Permet d'enregistrer ses propres sons.  
| valign="top" | permet permet d'enregistrer ses propres sons.
 
 
|}
 
|}
 
<br /></div>
 

Version actuelle datée du 31 août 2011 à 12:17

Les «educlets» et «proglets» de Cécile Picard-Limpens dans JavaScool.

Une «proglet» permet de manipuler un objet numérique et de le faire fonctionner avec des algorithmes.
Une «educlet» permet de manipuler un objet numérique et de le faire fonctionner à travers une interface graphique.
English version on fuscia@openprocessing.org

«Exploration sonore»
video

Permet de visualiser l'évolution temporelle et le contenu fréquentiel (le spectre) d'un son.

«Cryptage RSA»
video

Permet de manipuler les concepts liés à l'encryptage/décryptage par clés publique et privée.

«En Voiture»
video

Vise à s’approprier les différents éléments caractéristiques d’un graphe, en vue de saisir les algorithmes qui en font usage 1/2.

«Un graphe des chemins»
video

Vise à s’approprier les différents éléments caractéristiques d’un graphe, en vue de saisir les algorithmes qui en font usage 2/2.

«Boite à Musique»
video

Permet de se familiariser à la notion de composition sonore et l'assemblage de sons.

«Analyseur»
video

Permet de visualiser le contenu fréquentiel des graves aux aigus (le spectre) d'un son produit dans l'environnement.

«Vaguelettes ajustables»
video

Permet d'illustrer ce qu'est une onde, comment elle naît et se propage.

«Magnetophone»
video

Permet d'enregistrer ses propres sons.