Pour ceux qui sou­hai­tent apprendre à pro­gram­mer de façon sim­pli­fiée, Scratch est la solution idéale. Ce tutoriel Scratch vous explique en quoi consiste exac­te­ment et comment fonc­tion­ne ce projet, qui est en premier lieu destiné aux jeunes apprentis en pro­gram­ma­tion.

Qu’est-ce qui ca­rac­té­ri­se la pro­gram­ma­tion avec Scratch ?

La pro­gram­ma­tion Scratch repose sur une interface graphique qui rend inutiles toute syntaxe com­pli­quée et tout codage. L’objectif principal est d’aider les débutants qui sou­hai­tent apprendre à pro­gram­mer. C’est pourquoi Scratch mise davantage sur l’opé­ra­ti­vi­té que sur un grand nombre de fonc­tion­na­li­tés. Malgré ces re­stric­tions, Scratch bénéficie des prin­ci­pa­les pro­prié­tés des pa­ra­dig­mes de pro­gram­ma­tion, comme nous vous les pré­sen­tons ci-dessous. Les ca­rac­té­ri­sti­ques de ce langage de pro­gram­ma­tion sont :

  • Visuel : chaque objet de Scratch est re­pré­sen­té par un élément graphique. Les commandes de pro­gram­ma­tion sont par exemple re­pré­sen­tées par des blocs, qui peuvent être fa­ci­le­ment assemblés les uns aux autres par glisser-déposer.
  • Orienté objet : la pro­gram­ma­tion Scratch ne fait appel ni à des classes, ni à des relations d’héritage. Avec son en­cap­su­la­tion des données (accès contrôlé des données au moyen d’in­ter­fa­ces définies) et sa po­ly­mor­phie (les objets peuvent répondre à des typages divers), Scratch a aussi les ca­rac­té­ri­sti­ques d’un langage de pro­gram­ma­tion orienté objet.
  • Impératif : un certain nombre de scripts mis à votre di­spo­si­tion avec Scratch répondent au paradigme impératif de la pro­gram­ma­tion. Les séquences d’in­struc­tions dé­ter­mi­nent l’ordre dans lequel doivent être exécutées les actions.
  • Orienté résultat : chaque script que vous utilisez dans un projet Scratch démarre dès que l’événement est déclenché dans son bloc d’entête. En ayant recours à un bloc de type « attendre jusqu’à », vous soumettez le lancement d’un projet à la réa­li­sa­tion d’une certaine condition ou d’un événement.
  • Pro­gram­ma­tion d’actions en parallèle : Scratch gère dès le début les scripts qui s’exécutent en parallèle, ce qui veut dire qu’il est possible de pro­gram­mer in­dé­pen­dam­ment plusieurs parties du programme, et de les exécuter en parallèle.

Tutoriel Scratch : découvrez la pro­gram­ma­tion avec Scratch

Comme dans tous les domaines, c’est en forgeant qu’on devient forgeron ! Et même si le projet de pro­gram­ma­tion Scratch comprend beaucoup moins de points d’entrée que les langages de pro­gram­ma­tion clas­si­ques, comptez sur un certain temps de fa­mi­lia­ri­sa­tion pour vous ap­pro­prier l’interface de pro­gram­ma­tion. Dans ce tutoriel Scratch, nous vous ex­pli­quons tout ce qu’il y a à savoir sur la pro­gram­ma­tion Scratch.

N.B.

Si votre but est d’initier des enfants à la pro­gram­ma­tion Scratch, il est re­com­man­dé de bien vous fa­mi­lia­ri­ser d’abord à cette pla­te­for­me open source. Mieux vous com­pren­drez ce langage et son interface graphique, plus vous serez capable d’ac­com­pa­gner de jeunes ap­pre­nan­ts dans leur démarche. Pour savoir comment les enfants peuvent à pro­gram­mer tout en s’amuant, consultez notre article sur la pro­gram­ma­tion pour enfants.

L’interface uti­li­sa­teur

Dès que vous avez créé un compte et que vous avez en­re­gi­stré votre profil, vous verrez ap­pa­raî­tre dif­fé­ren­tes options ac­ces­si­bles dans la barre de menu, sur la partie haute de votre écran. Si vous cliquez par exemple sur le profil (vignette miniature et nom du compte), vous pouvez gérer votre profil, en­re­gi­strer votre do­mi­ci­lia­tion, modifier votre adresse email et votre mot de passe, et accéder à l’aperçu des projets actifs (« Mes projets »). C’est aussi dans ce menu que vous pouvez vous dé­con­nec­ter :

Immagine: Apprendre le Scratch : menu rapide pour le profil, le compte et les projets
À côté du bouton Profil se trouvent deux autres boutons avec lesquels vous pouvez ouvrir vos projets (icône dossier) et les messages reçus (icône enveloppe).

Derrière les menus suivants se cachent les fonctions suivantes :

  • Créer : la partie centrale d’un projet Web Scratch est la page de création et d’édition à laquelle vous accédez en cliquant sur l’onglet « Créer ». Avec cet éditeur internet, vous pouvez pro­gram­mer toutes vos ap­pli­ca­tions Scratch di­rec­te­ment dans votre na­vi­ga­teur.
  • Explorer : cette fonction vous permet d’accéder aux projets d’autres uti­li­sa­teurs. Vous pouvez non seulement découvrir et vi­sua­li­ser ces projets, mais aussi consulter toute leur pro­gram­ma­tion. Un « studio » rassemble tous les projets du même type.
  • Idées : la page « Idées » vous donne accès à dif­fé­ren­ts tutoriels et à des guides d’activité qui vous seront très utiles dans la réa­li­sa­tion de vos projets, et plus pré­ci­sé­ment pour trouver des idées. Vous di­spo­se­rez aussi sur cette page d’un lien pour té­lé­char­ger l’ap­pli­ca­tion Scratch (Windows, macOS, ChromeOS, Android). Cette ap­pli­ca­tion permet de dé­ve­lop­per des projets Scratch même si vous n’avez pas de connexion Internet.
  • À propos : si vous cliquez sur « À propos », vous êtes redirigés vers une page contenant des in­for­ma­tions générales sur le projet Scratch. Vous y trouverez entre autres des liens pour accéder à des in­for­ma­tions destinées aux parents et aux en­sei­gnan­ts, ainsi qu’une foire aux questions.

L’éditeur Scratch

L’en­vi­ron­ne­ment de dé­ve­lop­pe­ment de Scratch fait penser à un logiciel de création de site, ce qui est d’ailleurs assez com­pa­ti­ble avec l’approche par bloc proposée par les scripts. En plus de ces scripts, qui con­sti­tuent l’essentiel des blocs uti­li­sa­bles, vous pouvez ajouter à vos projets des costumes et des sons. Vous pouvez aussi les ajouter et les gérer au niveau de chaque script. Si vous cliquez sur « Ajouter une extension », vous di­spo­se­rez d’un plus grand nombre de scripts, par exemple le crayon de couleur ou un code de détection vidéo ou de synthèse vocale.

Consiglio

Scratch met à votre di­spo­si­tion un grand nombre de costumes, de sons et de scripts que vous pourrez insérer di­rec­te­ment dans vos projets. Vous pouvez aussi importer vos propres images et sons, voire les en­re­gi­strer si les éléments di­spo­ni­bles ne vous suffisent pas. Il est également possible de générer ses propres scripts.

Les costumes : animer les lutins et les objets

Quel que soit votre projet de pro­gram­ma­tion avec Scratch, qu’il s’agisse d’un jeu, d’une vidéo, d’une animation quel­con­que ou d’un petit dessin animé, les lutins et autres objets sont les blocs es­sen­tiels de votre histoire. En dessous de l’onglet « Costumes », vous pouvez choisir et insérer un certain nombre de gra­phi­ques dans votre projet. Vous pouvez choisir parmi les gra­phi­ques di­spo­ni­bles, dessiner ma­nuel­le­ment ou importer des gra­phi­ques que vous avez en­re­gi­strés en local. Si votre or­di­na­teur est équipé d’une caméra, vous pouvez aussi prendre une photo.

Immagine: Scratch : menu permettant de choisir les costumes
Les objets comme les lutins, re­pré­sen­tés dans toutes sortes de poses, vous per­met­tront ul­té­rieu­re­ment de créer des mou­ve­men­ts.

Si vous avez sé­lec­tion­né des costumes, vous pouvez par­fai­te­ment les ajuster par la suite. Pour ce faire, sé­lec­tion­nez l’objet de votre choix dans le menu latéral à gauche (sachez que vous pourrez à tout moment le glisser dans la corbeille d’un simple clic de souris), et utilisez ensuite les outils de l’éditeur, pour changer par exemple la couleur, pour supprimer des éléments avec la gomme, pour ajouter du texte, voire pour déformer l’objet. Il est également possible de convertir le graphique dans un format au mode vectoriel. Dans le champ « Costume », indiquez le nom du costume dont chaque script aura besoin ul­té­rieu­re­ment comme base de référence.

Immagine: Scratch : l’éditeur de costumes
Dans le cas de l’exemple du tutoriel Scratch, nous avons modifié l’apparence du lutin avec une couleur de rem­plis­sa­ge.

En bas, à droite sur votre écran se trouve le bouton « Choisir arrière-plan ». Cette option permet de définir l’image d’arrière-plan pour votre projet. Une fois de plus, vous pouvez choisir un arrière-plan proposé dans la bi­blio­thè­que de Scratch, ou ajouter vos propres images. Il est même possible de cliquer sur le pinceau et de dessiner votre propre arrière-plan.

Immagine: Tutoriel Scratch : personnage avec image d’arrière-plan
Comme pour les objets et les lutins, il est possible d’animer et de modifier l’image d’arrière-plan au moyen de scripts.

La bi­blio­thè­que de sons : bruitages et musique de fond

Trouver la juste sonorité dans un projet est tout aussi important que d’avoir les bons lutins et les bons objets. Quand vous pro­gram­mez avec Scratch, il est possible de gérer les sons et les bruits en passant par le menu « Sons ». Comme pour les éléments gra­phi­ques, vous disposez d’une grande bi­blio­thè­que de sons scratch ac­ces­si­ble par la fonction « Choisir son ». Il est également possible d’importer votre fichier sonore, ou de vous en­re­gi­strer si vous disposez d’un mi­cro­pho­ne.

Immagine: Menu pour enregistrer des sons avec Scratch
L’en­re­gi­stre­ment d’un nouveau son Scratch commence dès que vous appuyez sur le bouton en­re­gi­strer.

Les sons que vous insérez se re­trou­vent dans le menu latéral à gauche, et vous pouvez les sé­lec­tion­ner par un clic de souris pour les modifier et les éditer de plusieurs manières. Vous pouvez entre autres découper des séquences sonores, ajuster le volume, accélérer ou ralentir la vitesse de lecture. Comme il est également possible d’insérer des sons dans un projet Scratch à l’aide de scripts, il est important de nommer cor­rec­te­ment tous les sons que vous insérez dans le champ « Son ».

Immagine: Tutoriel Scratch : fenêtre de dialogue permettant d’éditer un fichier sonore
Si vous souhaitez couper certaines séquences, voire retoucher certaines plages du son, commencez par sé­lec­tion­ner la plage. Pour ce faire, cliquez le bouton gauche de la souris au point de départ, et faites glisser la souris jusqu’au point final tout en main­te­nant le bouton enfoncé.

Les scripts : l’essence même de la pro­gram­ma­tion Scratch

Pour être efficace en pro­gram­ma­tion Scratch, il est important de bien s’entraîner dans la gestion des scripts. Le véritable code derrière ces scripts est généré au­to­ma­ti­que­ment, dès que vous faites glisser dans votre projet un des blocs di­spo­ni­bles, qu’il s’agisse d’un contrôle, d’un capteur, d’un opérateur ou d’une variable. En tant qu’uti­li­sa­teur, vous pouvez vous con­cen­trer sur le fait d’assigner des valeurs aux dif­fé­ren­ts scripts, et leur attribuer des gra­phi­ques et des éléments sonores.

Tous les scripts existants sont dotés de de­scrip­tions précises, qui vous per­met­tent de bien com­pren­dre leur fonc­tion­ne­ment. Pour insérer un script dans votre projet, il suffit de cliquer sur le bloc concerné (nom donné aux scripts Scratch), et de le glisser dans la fenêtre d’édition, au centre de votre écran. Les valeurs ou options à définir sont con­sul­ta­bles di­rec­te­ment dans le bloc. C’est à ce niveau que vous pouvez les saisir ou les sé­lec­tion­ner. Si vous souhaitez associer di­rec­te­ment un script à un script existant, il suffit de le rattacher, comme on le ferait avec une pièce de puzzle.

Immagine: Apprendre le Scratch : incorporer des scripts et les tester
Dans la fenêtre d’aperçu, vous pouvez vi­sua­li­ser à tout moment la version en cours de votre projet Scratch, et exécuter par­tiel­le­ment les processus en guise de test.
Consiglio

Quand on apprend la pro­gram­ma­tion Scratch, la dif­fi­cul­té n’est pas de mémoriser des règles, une syntaxe ou un format quel­con­que, mais plutôt de bien com­pren­dre le fonc­tion­ne­ment des dif­fé­ren­ts scripts pour pouvoir les utiliser cor­rec­te­ment et bien les associer, les uns aux autres.

Pro­gram­mer avec Scratch : l’exemple d’un projet tout simple

Main­te­nant que nous avons présenté les prin­ci­paux éléments du site de pro­gram­ma­tion dans la première partie du tutoriel Scratch, nous allons, au moyen d’un exemple concret, vous montrer ce qu’il est possible de faire avec Scratch.

Com­me­nçons par trouver une image d’arrière-plan pour notre projet. Pour ce faire, nous cliquons sur l’icône d’image de fond, tout en bas à droite de l’écran, et sur « Sé­lec­tion­ner un arrière-plan ». Nous avons fait le choix d’utiliser le motif Blue Sky, que nous avons repris tel quel.

Immagine: Image d’arrière-plan « Blue Sky »
Pour notre exemple, nous choi­sis­sons l’image d’arrière-plan « Blue Sky ».

Nous allons ensuite ajouter un lutin à notre exemple de projet. Puisque l’onglet « Images de fond » recouvre l’onglet « Costumes », nous allons cliquer sur le bouton « Sé­lec­tion­ner lutin » (en bas à droite). Dans la bi­blio­thè­que de Scratch, vous avez dif­fé­ren­ts lutins et plusieurs costumes avec lesquels vous allez pouvoir ensuite simuler des mou­ve­men­ts. Le lutin « Cat » est par exemple di­spo­ni­ble avec les dé­cli­nai­sons « cat-a » et « cat-b », qui, exécutés l’un après l’autre, vous donneront l’im­pres­sion que le chat se déplace.

Consiglio

Plus vous avez de variantes de costumes pour un lutin, plus il sera facile de pro­gram­mer du mouvement avec Scratch !

Immagine: Tutoriel Scratch : figure « Cat »
C’est en jouant sur les costumes et les poses d’un lutin que vous réussirez à l’animer en pro­gram­ma­tion Scratch.

Dans la dernière étape de ce petit exemple, nous allons en venir au point central de la pro­gram­ma­tion avec Scratch : comment contrôler le lutin ? Si vous souhaitez par exemple que le chat se déplace de gauche à droite, aussi longtemps que la flèche droite est enfoncée, ajoutez le script suivant :

  • Événement : presser la touche [ ]
  • Contrôle : attendre [ ] secondes
  • Apparence : basculer sur costume suivant
  • Mouvement : avancer de [ ] pas

Pour le script événement, indiquez « la touche souhaitée ». Dans notre exemple, il s’agit de la « flèche à droite ». À l’aide du script « contrôle » suivant, vous pouvez définir le délai entre deux chan­ge­men­ts de costumes. Tapez la valeur « 0,2 ». Dans ce cas, il se passera 0,2 seconde avant que le lutin ne change d’apparence, ce qui rendra son dé­pla­ce­ment encore plus réaliste. Le script « Apparence » assure la tran­si­tion entre « cat-a » et « cat-b » aussi longtemps que la touche flèche est appuyée. Grâce au quatrième script « Mouvement », vous pouvez, en plus du chan­ge­ment de costume, déplacer le lutin vers la droite. Ici, nous avons fait le choix de pas réguliers de 10.

Immagine: Programmer avec Scratch : exemple d’un script dans un projet
Les valeurs ap­pli­quées à ce tutoriel Scratch sont données à titre d’exemple. On peut opter pour des chan­ge­men­ts de costumes plus lents ou plus rapides, augmenter ou réduire les pas des lutins.
Consiglio

Vous pouvez voir le résultat de ce petit code di­rec­te­ment sur la page projet Scratch et la tester !

Partager son projet Scratch

Si vous avez rejoint la com­mu­nau­té des scrat­chers et créé votre compte d’uti­li­sa­teur, vous pourrez publier vos projets de sur le site de Scratch. Pour ce faire, cliquez sur le bouton « Partager » dans la barre de menus, en haut de votre écran.

Une fois que vous cliquez sur ce bouton, vous accédez à une fenêtre dans laquelle vous pourrez modifier le titre du projet, apporter certaines pré­ci­sions, inscrire des com­men­tai­res, voire des re­mer­cie­men­ts. Si vous faites glisser votre curseur « Com­men­ting on » vers la gauche, vous dé­sac­ti­vez la fonction com­men­tai­res pour votre projet.

Immagine: Scratch : publication d’un exemple de projet
Dans le menu de votre projet, cliquer sur « Copier le lien » pour pouvoir partager votre projet avec vos amis et vos proches.
Vai al menu prin­ci­pa­le