1 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques David Crunelle – ESCG – Les Formats Graphiques Rappel : pixel et extension Les principaux formats graphiques Les niveaux de gris Le graphisme vectoriel La PAO Les logiciels de PAO

2 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques Pixel: Picture element « Elément d'un quadrillage rectangulaire composant une image numérique. » BITMAP

Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques RESOLUTION 20X20

Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques

5

6 Lextension nomdufichier extension Exemple : image001.jpg Détermine le format Logiciel Nombre dextension > Nombre de logiciels.

7 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques Lextension nomdufichier extension Exemple : image001.jpg Format Programme

8 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques Les types de fichiers les plus utilisés actuellement sont : - BMP (Bitmap), premier fichier graphique utilisé par Windows - JPG, consiste en un BMP compressé (mais perte de qualité) - GIF (Compuserve), fichier graphique animé (superposition) - TIFF, format affectionné par les graphistes - PSD, format créé par Adobe Photoshop - TGA (Targa) - RAS (Sun Rasterfile Image) - PNG (Portable Network Graphix) - SGI - PCX - RSB - IFF - etc. Formats Internet: - JPG - GIF

9 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques

10 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques JPG - compressé - format idéal pour Internet - mais perte de qualité

11 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques

12 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques GIF - animé - plus lourd - fond transparent

13 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques Les niveaux de gris % 50% 100%

14 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques Millions de couleurs

15 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques 256 couleurs

16 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques 16 couleurs

17 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques Noir et blanc

18 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques Niveau de gris

19 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques Le graphisme vectoriel Tracé est composé de primitives: - cercles - carrés - polygones - etc Stockage sous forme de liste de primitives & transformations Avantages: - Taille de stockage réduite - Haute qualité (surtout à lagrandissement)

20 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques Les images vectorielles : - Fonctions pixels - Polygones - gestion du calcul par la carte graphique = 10 ko Y= ax+b = 1 ko

21 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques Exemple: Logo Les images vectorielles :

22 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques Manipulations par objets en tant quentités distinctes. Exemples de manipulations: - Superpositions -Pivotement - Agrandissements ax+b²(3x-7y)³ [3x(ab+b²-2ab)² +9x³] = Les images vectorielles :

23 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques JPG 300dpi 100x100 pixels = = 10ko Les dessins vectoriels sont largement utilisés en publication assistée par ordinateur (PAO) ainsi que sur Internet. ax+b²(3x-7y)³ [3x(ab+b²-2ab)² +9x³] = < 1ko 2xax+b²(3x-7y)³ [3x(ab+b²-2ab)² +9x³] = < 1ko = = 156ko JPG 300dpi 700x700 pixels 1 pages de texte = environ 2 ko 2:1

24 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques 1:1 10:1 JPGVectors 1000:1

25 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques JPGVectors 800x800 pixels 300dpi = 124ko 800x800 pixels vectorisé 300dpi = 17ko17ko

26 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques La PAO (=Micro édition) Utilisation de matériels de: - Micro-informatique - Logiciels spécialisés But: produire des documents de qualité professionnelle combinant du texte et des images (photos, dessins, illustrations, graphiques…). Linfographie: - Traitement de limage - Modification dimages - Création graphique

27 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques La PAO : Création de documents Etapes: -Numérisations dimages -Créations dimages -Retouches -Mise en page WYSIWYG

28 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques Applications -Presse écrite (Journaux / Périodiques) -Communication (Pub) -Entreprises (Brochures, courriers, cartes de visites…) -Particuliers (Cartes de vœux, invitations,…)

29 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques Les Logiciels de PAO Adobe Illustrator Quark Xpress

30 Création de pages Web Gestion/Communication Herman Olivier – ESCG TRAITEMENT DE L IMAGE -Paint -Photoshop -Gimp

31 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques Paint

32 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques Adobe Photoshop Palette doutils Propriétés Calques

33 Multimédia & Internet 2èmes Gestion/Communication Les formats graphiques Gimp Palette doutils Propriétés Calques

34 Création de pages Web Gestion/Communication Herman Olivier – ESCG TRAITEMENT DE L IMAGE Fonctions de base: - Selection - image/découper la sélection - image/échèle et taille de limage - image/mode/niveaux de gris - Couleurs/teintes-saturation - Couleurs/luminosité-contraste

35 Création de pages Web Gestion/Communication Herman Olivier – ESCG EXERCICES Partez de limage « DentsDuMidi.jpg » Réduisez sa résolution en 640x480 pixels Enregistrer limage sous le nom ddm.jpg Repartez de limage originale et Isolez uniquement les dents comme ci- dessous. Transformez limage en « niveaux de gris » Jouez avec le contraste et la luminosité pour arriver au résultat ci- dessous.

36 Création de pages Web Gestion/Communication Herman Olivier – ESCG TRAITEMENT DE L IMAGE Fonctions complémentaires: - Couleurs - Clonage - Repiquer une couleur - Texte - Eclaircir - Barbouiller

37 Création de pages Web Gestion/Communication Herman Olivier – ESCG EXERCICES Partez de limage « DentsDuMidi.jpg » Recopier le point le plus haut dans la zone à gauche afin dagumenter le nombre de « dents »