====== Le codage pour enfant ======

  * Porteuse du projet : Léa MAUFFREY
  * Date : 2019/2020
  * Contexte : Mémoire
  * Fichiers : [...]
  * Liens : [...]

===== Synthèse =====
[...]

===== Fiche technique =====

=== Introduction / présentation du sujet ===
Mon sujet de mémoire porte sur l’importance de l’apprentissage du codage et des nouvelles technologies aux enfants. 

Aujourd’hui la technologie est omniprésente, mais reste un domaine compliqué et les objets ne sont pas modifiables, ce sont des objets fermés ce qui empêche d’en comprendre le fonctionnement et de se l’approprier. Les formes et fonctions de l’objet sont imposées par le fabriquant et le marché.
On considère souvent notre génération et encore plus les nouvelles générations comme des « digital native » mais l'utilisation se limite la plus part du temps à la consommation plus qu'à la création de contenue numérique. D'après Mitch Resnick l'un des créateurs du logiciel Scratch c'est comme savoir lire mais pas écrire. 
L’objectif et à la fois de démystifier l’informatique, de s’autoriser la modification des objets informatiques. De donner aux enfants un moyen de reprendre le contrôle de leur environnement et de prendre en main un outil utile et d’en faire un usage créatif et ré-enchanter le numérique grâce au méthode d’apprentissage alternative.

Plusieurs réformes sur l'apprentissage du numérique à l'école sont mise en place mais c'est une matière entière à créer et cela pause des problèmes en terme de formation des professeurs et de l'utilisation d'outils pédagogiques.


=== Problématique ===
Existe-t-il des moyens plus efficaces d’enseigner par l’apprentissage du code ?
L’apprentissage du code permet-il d’enseigner des compétences plus larges ? Comment mettre en œuvre des systèmes qui permettent de faciliter l'apprentissage du code ?

=== Etat de l'art===

[[https://docs.google.com/document/d/1pKF9WANqkKmm_f9-9Rlf8wbGAkZ7YmuZALsIBexld0Y/edit?usp=sharing]]

=== Propositions ===

Mon objectif est de créer des dispositifs servant de support à l'apprentissage du codage et de l'informatique par l'interdisciplinarité. Du point de vue du design, je cherche à trouver des moyens formels pour apprendre à coder tout en sensibilisant à la pensée informatique et au enjeux du numériques. Dans cette optique, l'apprentissage par l'interdisciplinarité permettrai non seulement de s'exercé dans une autre discipline en apprenant le code, mais aussi de commencé cette apprentissage sur des bases familières ou au moins plus engageantes.
 
  * Mise en place d'atelier de création numérique et d'initiation à Scratch avec des enfants de 9 à 13 ans 
Réalisation : [[https://scratch.mit.edu/studios/25159112/]]

  * Création de dispositifs d'aide à l'apprentissage du langage CSS à l'aide de mini jeux créer sur processing. 

{{:wiki:memoires:codage-pour-enfant:cameleon_capture.png?200|}}        {{:wiki:memoires:codage-pour-enfant:scarabe_capture.png?200|}}        {{:wiki:memoires:codage-pour-enfant:capture_poisson.png?200|}}

C'est code permettent d'illustré les fonctionnalités de bases de CSS, la couleur pour le caméléon, la taille pour le poisson et la positions pour le scarabée. il est possible de faire varié les fonctionnalités grâce à des potentiomètre. 

Code Processing
<code>
// librairie 
import processing.serial.*;
 
// variables
PImage img;
int s=80;//saturation
int v=100;//valeur
String capteur = "";
String css1 = " .caméléon {";
String css2 = " color : ";
String css3 = " }";

Serial myPort;  // Créer une serial class pour les data Arduino
float val;      // Data recu part Arduino
int[] serialInArray = new int[3];   
int serialCount = 0;
boolean firstContact = false;    

void setup() {
  size(700, 500);
  img = loadImage("caméléon.png");

  // initialisation du port série
  printArray(Serial.list());// liste de tous les ports séries disponibles
  String portName = Serial.list()[0]; // Afficher les donées arduino
  myPort = new Serial(this, portName, 9600);
}

void draw() {

  noStroke();
  colorMode(HSB, 360, 100, 100);
  fill(val, s, v); // donnée à la teinte la valeur du capteur arduino
  rect(0, 0, 500, 500);
  image(img, 0, 0, 500, 500);
  println(val);
  fill(#cccccc);
  rect(500, 0, 200, 500);
  fill(#ffffff);
  text(css1, 520, 50);
  text(css2, 530, 65);
  text(val, 575, 65); //écrire la valeur du capteur arduino 
  text(css3, 520, 80);
}

void serialEvent(Serial myPort) {

  int inByte = myPort.read();
  if (firstContact == false) {
    if (inByte == 'A') { 
      myPort.clear();         
      firstContact = true;    
      myPort.write('A');       
    } 
  } 
   else {
    serialInArray[serialCount] = inByte;
    serialCount++;

    if (serialCount > 2 ) {
      val = serialInArray[0];

      // afficher les données arduino dans la console
      println(val);
      myPort.write('A');
      serialCount = 0;
    }

  }
}
</code>

Code Arduino
<code>
  http://www.arduino.cc/en/Tutorial/SerialCallResponse
*/

int firstSensor = 0;    // first analog sensor
int secondSensor = 0;   // second analog sensor
int thirdSensor = 0;    // digital sensor
int inByte = 0;         // incoming serial byte

void setup() {
  // start serial port at 9600 bps:
  Serial.begin(9600);
  while (!Serial) {
    ; // wait for serial port to connect. Needed for native USB port only
  }

  pinMode(2, INPUT);   // digital sensor is on digital pin 2
  establishContact();  // send a byte to establish contact until receiver responds
}

void loop() {
  // if we get a valid byte, read analog ins:
  if (Serial.available() > 0) {
    // get incoming byte:
    inByte = Serial.read();
    // read first analog input, divide by 4 to make the range 0-255:
    firstSensor = analogRead(A0) / 4;
    // delay 10ms to let the ADC recover:
    delay(10);
    // read second analog input, divide by 4 to make the range 0-255:
    secondSensor = analogRead(1) / 4;
    // read switch, map it to 0 or 255L
    thirdSensor = map(digitalRead(2), 0, 1, 0, 255);
    // send sensor values:
    Serial.write(firstSensor);
    Serial.write(secondSensor);
    Serial.write(thirdSensor);
  }
}

void establishContact() {
  while (Serial.available() <= 0) {
    Serial.print('A');   // send a capital A
    delay(300);
  }
}
</code>

  * Création de dispositifs d'aide à l'apprentissage du langage HTML en réalité augmenté.

Ce dispositif se compose d'un jeu de carte avec sur chacune d'elles les principales classe du langage HTML. La réalité augmenté fait apparaître sur chacune des cartes une matriochka qui lui est associé. Grâce aux matriochkas, il est possible de reconstituer une arborescence et donc comprendre la structure d'un code HTML.

{{:wiki:memoires:codage-pour-enfant:20200131_0925512.jpg?400|}}   {{:wiki:memoires:codage-pour-enfant:screenshot_20200131-092703_hp_reveal.jpg?400|}}

  * Création d'une histoire interactive.

{{:wiki:memoires:codage-pour-enfant:chat.png?600|}}

Pour chaque page, on a une illustration et un code associé. 
<code>
// variables globales
PImage img0,img;
char letter;
String words = "";

void setup() {
  size(1200, 1920);
  // texte
  textSize(36);
  fill(#000000); // noir
  //charger le chat
  //dessin du chat 
  img0 = loadImage("ChatM.png");
}

void draw() {
  background(#ffffff); 

  // dessiner le chat
  image(img0, 450, 640,300,320);

  // dessin du texte
  fill(#26617f); // bleu
  text(words, 100, 100, 1200, 1000);
  textSize(150);
  // dessin du motif superposé au chat
  superposerMotif();

  // effacer tout si on appuye sur ENTER
  if (key == ENTER) {
    fill(255);
    rect(0, 0, width, height);
    //réinitialiser la chaine de caractères
    words ="";
    // dessiner le chat
    image(img0, 450, 640,300,320);
  }
}

void keyTyped() {
  // The variable "key" always contains the value 
  // of the most recent key pressed.
  if ((key >= 'A' && key <= 'z') || key == ' ') {
    letter = key;
    words = words + key;
    // Write the letter to the console
    println(key);
  }
}

void superposerMotif() {
  
  if (words.equals("soleil")) {
    img = loadImage("SoleilM_1.png");
    image(img, 140, 270, 920, 920);
  }
  if (words.equals("nuage")) {
    img = loadImage("NuageM.png");
    image(img, -300, -100, 1900, 1920);
  }
  if (words.equals("vent")) {
    img = loadImage("VentM.png");
    image(img, -460, -600, 2500, 3000);
  }

  if (words.equals("souris")) {
    img = loadImage("SourisM.png");
    image(img, 0, 0, 1200, 1920);
  }

  if (words.equals("chat")) {
    img = loadImage("Chat2M.png");
    image(img, 448, 638,305,325);
  }
}
</code>

Pour mon macro-projet j'envisage de créer un dispositif narratif. L'idéale serai d'avoir une histoire dont on peut modifier le contenu en codant.
===== Fiche arts, techniques & civilisations =====
https://docs.google.com/document/d/1cTTTeFs6xjzgZD_wKgPwZT4O595kYgCOL3Sm0GjJJ-I/edit

===== Fiche de lecture =====
[...]

===== Rapport de stage =====
[...]

===== Entretien =====
[...]

===== Lexique =====
[...]

===== Bibliographie =====


  * Rikimbili, Ernesto Oroza 
  * Naissance d'une pédagogie populaire, Élise Freinet 
  * Qu’est-ce que l’éducation populaire ? [[http://www.education-populaire.fr/definition/]] 
  * Petit Lexique des pédagogies "différentes", Antonella Verdiani, [[https://www.colibris-lemouvement.org/magazine/petit-lexique-pedagogies-differentes]] 
  * Réenchanter le monde, la valeur de l'esprit contre le populisme industriel, Bernard Stiegler
  * Un manifeste Hacker
  * Question Numérique : promesse / transition (2013/2014-2015)
  * Pour un humanisme numérique, Milad Douheihi 
  * "Quelle informatique enseigner à l’École, au Collège et au Lycée et pourquoi ?" par Gilles Dowek [[https://www.youtube.com/watch?v=8n7Z8fDKe3A]] 
  * Pourquoi apprendre le codage informatique aux enfants ?, Denis Peiron, [[https://www.la-croix.com/Famille/Education/Pourquoi-apprendre-codage-informatique-enfants-2016-11-29-1200806682]] 
  * Pharmakon, Ars industrialis, [[http://www.arsindustrialis.org/pharmakon]] 
  * Let's teach kids to code, Mitch Resnick, [[https://www.ted.com/talks/mitch_resnick_let_s_teach_kids_to_code#t-13180]] 


===== Références =====