1. Accueil
  2. la-photographie-numerique
  3. 1-pixels

Cell Phone screen Pixels, de Dinesh Dhankhar, publié sous licence Creative Commons by 4.0.

Pixels

Cette activité est très inspirée des activités de Gilles Lassus et Stéphane Colomban.

Lorsqu'une question est marquée d'un symbole 🔎, la réponse est à aller chercher sur Internet.

Sauf mention contraire, les réponses aux questions sont à rédiger sur un compte-rendu papier.

Pixels, Définition, Résolution

Une photographie numérique (au format jpg, png, tiff, etc.) est un tableau de pixels, chaque pixel étant une case du tableau, d'une couleur bien précise.

_primary
Pixel-example, par ed g2s, publié sous licence CC BY-SA 3.0.

La définition d'un écran est le nombre de pixels qui composent l'écran (généralement données sous la forme 1024×780, signifiant « 1024 pixels de large, et 780 pixels de haut »).

_primary
Cell Phone screen Pixels, par Dinesh Dhankhar, publié sous licence CC BY 4.0.

La résolution d'un écran (exprimée en dpi (dots per inch), ppi (pixels per inch), ou ppp (pixels par pource)) est le nombre de pixels disponibles sur une longueur d'un pouce (environ 2,54 cm). Plus ce nombre est élevé, plus la taille des pixels est petite, et plus l'image sera précise.

  1. 🔎 Quelle est l'étymologie du mot pixel ?
  2. 🔎 Quelle est la définition (le nombre de pixels en largeur et hauteur) d'un écran HD, Full HD, et 4K ?
  3. Écran de téléphone portable. Sur la fiche technique du téléphone portable Fairphone 3 est écrit : « 2160 x 1080 resolution ; 427 ppi pixel densité. » Quelles sont la définition et la résolution de cet écran (attention : il y a un piège) ?

  4. Écran de télévision 4K. Une télévision 4K a les caractéristiques techniques suivantes :

    • Taille de l'écran 55"
    • Résolution : Longueur 3840 Pixels
    • Résolution : Largeur 2160 Pixels
    • Longueur du produit 123,06 cm
    • Largeur du produit 79,26 cm
    • Hauteur du produit 23,75 cm
    1. 🔎 Convertir la largeur de la télé en pouces.
    2. Quelle est la résolution (en largeur) de cet écran ?
    3. La résolution est-elle plus grande ou plus petite que celle du téléphone portable étudié à la question précédente ?

  5. Les imprimantes n'utilisent pas de pixels, mais manipulent de minuscules points d'encre, qui forment des lettres et auxtres dessins. Il est possible de faire des calculs avec les points d'encre d'une imprimante de la même manière que les calculs faits avec les pixels d'un écran.

    Une imprimante a une résolution de 300 ppp (dpi en anglais), soit 300 points d'encre par pouce (un pouce ≈ 2,54 cm). On souhaite imprimer une photo en pleine page sur une feuille A4.

    1. 🔎 Quelle est la définition de cette feuille pour cette imprimante ?
    2. On désire imprimer une photo sur toute la feuille. Est-ce que la définition de 1024 × 768 est suffisante ?

Couleurs

Dans cette partie nous nous intéresserons à manière dont sont codées les couleurs.

Souvenirs d'art plastique

  1. Quelles sont les trois couleurs primaires en peinture ?
  2. Comment obtenir les couleurs suivantes à partir des trois couleurs primaires : orange, vert, violet ?

Modèle RGB

Ouvrir le logiciel GIMP, puis cliquer sur la couleur de premier plan (le carré noir dans le menu de gauche) pour afficher la palette des couleurs. Vous obtenez alors la fenêtre suivante.

_primary

Dans cette partie, nous nous intéressons uniquement aux trois lignes R, G, B (qui ont, sur l'image, les valeurs 66, 107 et 95).

  1. 🔎 Que signifient les initiales RGB ?
  2. Quelles sont les valeurs minimales et maximales que peuvent prendre les quantité de rouge, vert, bleu ?

  3. En utilisant la palette de Gimp utilisée à la question précédente, donner le code des couleurs suivantes (on notera (x, y, z) la couleur composée de x rouge, y vert et z bleu) :

    • Rouge : (255, 0, 0)
    • Vert : (…, …, …)
    • Bleu : (…, …, …)
    • Noir : (…, …, …)
    • Blanc : (…, …, …)

  4. En utilisant le même outil, avec la même notation, donner les couleurs (en français) correspondant aux codes suivants :

    • (0, 255, 255)
    • (255, 0, 255)
    • (255, 255, 0)
    • (255, 128, 0)

  5. Combien de couleurs différentes est-il possible de coder en utilisant cette méthode ?

  6. 🔎 Quels autres modèles de couleur sont aussi utilisés en informatique ?

Capteurs et Photosites

Lire la page suivante, qui explique le fonctionnement d'un appareil photo numérique : Capteur photo.

Répondre aux questions suivantes (toutes les réponses se trouvent dans le document qui vient d'être lu).

  1. Compléter la phrase suivante : « Un photosite est un composant électronique ayant la capacité de capter un signal … pour le convertir en un signal … (grâce à l'effet photoélectrique), qui sera lui-même converti en un … (on parle de numérisation). »
  2. Comment fait-on pour qu'un photosite ne soit sensible qu'à une des trois couleurs (rouge, verte, bleue) ?
  3. Pourquoi y a-t-il deux fois plus de photosites verts que de photosites des autres couleurs ?
  4. Combien de photosites faut-il associer pour créer un seul pixel ?

Un peu de programmation

La bibliothèque Pillow permet de manipuler, pixel par pixel, des images en Python. Chaque image est considérée comme un tableau, chaque case contenant un triplet de nombres (R, G, B).

_primary

Par exemple, l'image ci-dessous représente une image de 3×2 pixels. Deux choses sont à noter sur les coordonnées :

  • les coordonnées commencent à 0 (comme dans les ascenceurs, ce qui est courant en informatique) ;
  • l'axe vertical est gradué de haut en bas (alors qu'habituellement en mathématiques, il est gradué de bas en haut).

Ainsi, la couleur du pixel de coordonnées (2, 1) est (236, 25, 32), ce qui correspond à du rouge.

Le programme Python suivant permet de dessiner le drapeau français de l'exemple ci-dessus.

from PIL import Image

image = Image.new('RGB', (3, 2))

image.putpixel((0, 0), (5, 20, 64))
image.putpixel((0, 1), (5, 20, 64))
image.putpixel((1, 0), (255, 255, 255))
image.putpixel((1, 1), (255, 255, 255))
image.putpixel((2, 0), (236, 25, 32))
image.putpixel((2, 1), (236, 25, 32))

image.save("image.png")

Voici l'explication de chaque ligne :

  • Chargement de la bibliothèques pillow, qui permet à Python de manipuler des images.

    from PIL import Image

  • Création d'une nouvelle image, de 3 pixels de large par 2 pixel de haut.

    image = Image.new('RGB', (3, 2))

  • Tracé d'un pixel de couleur (5, 20, 64) aux coordonnées (0, 1).

    image.putpixel((0, 1), (5, 20, 64))

  • Écriture de l'image dans le fichier image.png.

    image.save("image.png")
Dans cette partie, seule la réponse à la question 1 devra apparaître sur votre compte-rendu.

  1. Reproduire le tableau suivant sur votre compte-rendu, et faites un dessin (une lettre, un smiley, etc.) en coloriant certaines cases. Votre dessin devra être composé d'au moins trois couleurs (en plus du blanc).

    _primary

  2. Téléchargez le fichier drapeau-france.py, et renommez-le en dessin-NOM.py (en remplaçant NOM par votre nom de famille).

  3. Ouvrez ce fichier avec le logiciel Thonny, puis exécutez-le.

    Si vous obtenez dans le shell (la partie basse de la fenêtre) un message d'erreur qui se termine par ModuleNotFoundError: No module named 'PIL', installez la bibliothèque Pillow de la mannière suivante :

    1. Allez dans le menu Tools, puis Manage packages….
    2. Dans la fenêtre qui s'ouvre, inscrivez Pillow, lancez la recherche, puis cliquez sur le bouton Install pour l'installer.
    3. Une nouvelle fenêtre s'ouvre. Patientez jusqu'à ce qu'elle se ferme.
    4. Fermez la fenêtre Manage packages.

    Exécutez à nouveau le programme. Si la même erreur s'affiche, appelez le professeur à l'aide.

  4. Ouvrez le dossier qui contient votre fichier .py : un fichier image.png doit avoir été créé. Ouvrez cette image pour observer le drapeau français.

  5. Modifiez le programme pour reproduire votre dessin, pixel par pixel.
  6. Rendez le fichier .py dans le dossier partagé sur le réseau.