Création de maquette web

Save this PDF as:

Dimension: px
Commencer à balayer dès la page:

Download "Création de maquette web"

Transcription

1 Création de maquette web avec Fireworks Il faut travailler en 72dpi et en pixels, en RVB Fireworks étant un logiciel dédié à la création de maquettes pour le web il ne propose que les pixels pour le texte et les tailles d objet

2 Création de maquette web avec Photoshop Il faut travailler en 72dpi et en pixels, en RVB Choisir dans les préférences : unités et règles en pixels

3 Voir la grille 960 Fondée sur 960 pixels, avec des variantes de 12 et 16 colonnes, ou plus. 960.gs à télécharger

4 Intégration avec Fireworks et Photoshop

5 Analyser le fichier pour déterminer ce qui sera de l image, ce qui sera stylé en css. Photos, décorations en images Pour les ombres, typos «exotiques», coins arrondis, choisir entre images ou CSS3 Pour les besoins pédagogiques de ce tutoriel, nous choisirons images plutôt que CSS3

6 Ici 9 éléments à récupérer un morceau de l arrière plan du menu logo arrière plan du pavé l étoile 4 photos un morceau de l arrière plan du détail

7 Création des tranches

8 Le principe des tranches est de découper ce qui est visible à l écran. Il faut masquer les calques qui se superposent. Pour la partie supérieure : le logo et le pavé noir doivent être sur un fond transparent.

9 Il y a deux façons de créer les tranches. Première façon: on souhaite avoir comme tranche le contenu du calque entier, comme pour le logo et le pavé noir. Clic droit sur le fond jaune du logo > Insérer une tranche rectangulaire

10 Nommer la tranche ainsi créée Soit dans l inspecteur des propriétés de la tranche, soit dans le dossier «calque web» Attention! Les noms choisis pour les tranches seront les noms des images gif, jpg ou png utilisées dans vos pages web. Pas d espace, d accents...

11 Une tranche apparaît sur le bloc Tranche insérée avec le nom choisi. Ne pas se préoccuper de l extension qui apparaît à ce moment

12 Il y a deux façons de créer les tranches. Deuxième façon On souhaite avoir comme tranche un morceau du calque comme l arrière-plan du menu, qui se répètera en x Choisir l outil tranche Dessiner la tranche sur l objet Nommer la tranche comme précédemment

13 Modifications des tranches Une fois les tranches créées, il est possible de les déplacer avec le curseur, ou en changeant les valeurs x et y dans l inspecteur de propriétés et de changer la largeur et la hauteur aussi en plaçant le curseur sur les bords ou en utilisant l inspecteur des propriétés

14 Optimisation des images gif, jpg ou png? Pour le web, le mode de couleurs est un mode RougeVertBleu. le mode d'affichage des couleurs sur un moniteur.

15 Le format JPEG Format avec perte de données. Basé sur une compression ajustable de 0 (qualité minimum) à 100 (qualité maximum). Il permet d'afficher des images 16bits, c'est à dire en millions de couleurs. Le format est JPEG est particulièrement adapté aux images photo-numériques. Et de manière plus générale, aux images contenant un très grand nombre de couleurs (images contenant un dégradé radial ou linéaire par exemple). compression à 80% Une compression trop forte a tendance à pixelliser l'aspect de la photo, à rendre les contours des formes moins lisses et le texte peu lisible. compression à 13%

16 Le format GIF Format sans perte de données mais avec indexation des couleurs dans une palette. Le format GIF fonctionne sur 8 bits. Elle existe plusieurs types de palette, qui conserve de manière plus ou moins efficace les couleurs de l'image originale. Le format GIF est particulièrement adapté aux images «géométriques», ayant un aspect vectoriel. Toutes les images en aplats de couleurs, comme le texte, les illustrations, les boutons, les logos réagissent parfaitement à l'optimisation GIF. gif 16 couleurs 949 octets Le lissage est bien conservé. A qualité proche, le format JPEG génère un poids de fichier plus important pour une même image. jpg 83% 3.48 k

17 Les Palettes : GIF entrelacé : Le GIF «entrelacé» permet un affichage progressif de l'image parallèlement à son téléchargement dans la mémoire du navigateur. GIF transparent : De plus, le GIF permet de rendre transparente une couleur présente dans l'image. Néanmoins, il s'agit de La couleur transparente est toujours en opacité 0%! Cela oblige à ajouter un cache (couleur de détourage) autour de la forme détourée pour conserver le lissage du texte ou de la forme. GIF animé : Le GIF permet la réalisation d'images animées. Longtemps utilisé pour créer des bannières publicitaires, il semble être abandonné progressivement face à une utilisation croissante des animations FLASH

18 Les Palettes : Perception Palette qui conserve un maximum de couleurs auxquelles l'œil humain est sensible. Théoriquement la palette qui restituera le plus fidèlement les couleurs de l'image originale. Web : Palette qui indexe sur les 216 couleurs web sécurisées. Les couleurs web ont été définies à l'origine pour rendre l'affichage des couleurs compatible entre MAC et PC. Problème, certaines couleurs de l'image originale sont remplacées par des couleurs web. Il en résulte parfois de véritables pertes de couleurs. Sélective : Compromis entre Perception et Web... Adaptative : Palette qui favorise la conserve d'un nombre important de nuances de couleurs dans une partie du spectre RVB.

19 Le format PNG PNG 8 8 veut dire 8bits. Il gère jusqu à 256 couleurs, comme le GIF et utilise une compression sans perte de qualité. Il a la transparence d index et la transparence alpha. (Pas dans Photoshop, uniquement dans Fireworks) Utilisable comme le GIF pour des aplats de couleurs, des logos, il ne conviendra pas aux dégradés ni au photos PNG 8 dans Fireworks transparence alpha PNG 8 dans Photoshop pas de transparence alpha

20 Le format PNG Le PNG 24 ne gère pas la transparence, il n a que 3 canaux (RVB) Dans un PNG 32 il y a aussi le canal alpha, qui enregistre en mode 32 bits PNG 32 png dans Fireworks Photoshop ne le propose pas mais propose un PNG24 qui est en fait de PNG32, sans le dire. Firewoks propose les 3. PNG 32 est la plus haute qualité possible, mais aussi un poids en conséquence. Il gère la transparence alpha. png dans Photoshop

21 Transparence alpha et transparence index. La transparence d index ne permet de rendre transparente qu une seule couleur. La transparence alpha offre plusieurs niveaux de transparence qui donneront un effet beaucoup plus doux aux courbes et coins arrondis. En résumé pour la transparence alpha : Dans Photoshop : choisir PNG 24 (qui est en fait du PNG 32) Dans Fireworks : choisir PNG 8 s il n y a pas beaucoup de couleurs 832octets choisir PNG 32 s il a beaucoup de couleurs 21.68ko

22 Optimiser les images correspondant aux tranches Nous allons optimiser les tranches une par une, puis les exporter en une seule fois Afficher l aperçu 2 en1 (en haut et à gauche du document)

23 Sélectionner le calque web «logo» ou cliquer sur le logo dans la partie droite du document Afficher la fenêtre «optimisation» dans le menu «fenêtre»

24 Choisir dans le menu déroulant le format (ici png32, car il y a des dégradés et nous voulons une transparence alpha) Recommencer pour chaque tranche Transparence alpha avec beaucoup de couleurs : png32 Photos : jpg Peu de couleurs : gif

25 Firewoks mémorise les formats choisis pour chaque tranche Sélectionner toutes les tranches (dans la fenêtre des calques, par exemple) Puis aller dans le menu «fichier» «exporter»

26 Faisons d abord quelques règlages, car Fireworks va renommer nos tranches en y ajoutant des tirets etc Ne pa se préocupper du nom donné ici, par défaut le nom du fichier ouvert cliquer sur «options»

27 Aller dans l onglet «propre au document» Ici les ajouts faits par FW

28 Choisir «Aucune» ou supprimer les contenus de tout sauf «nom.doc» nom final de la tranche Cliquer sur «ok»

29 Nous revenons à cette fenêtre Défiler pour trouver

30 Fenêtre «exporter» avec images uniquement Ne pas se préocuper de ce nom de fichier qui n apparaîtra nulle part sur votre disque dur décocher «inclure les zones sans tranches» Choisir l endroit où vous souhaitez récupérer vos gif, jpg et png. Cliquer sur «exporter»

31 Aller dans le dossier de destination où vous avez enregistré vos images

32 Pour enregistrer une seule tranche, il est plus simple de faire un clic droit sur la tranche dans la partie gauche du document, après l avoir optimisée puis exporter la tranche sélectionnée

33 Pour garder le fichier avec les calques Web, enregistrer «sous» l extension native de Fireworks est «png» Pour pouvoir ouvrir le fichier avec tous les calques dans photoshop, «enregistrer sous» et choisissez dans la liste déroulante : photoshop

34 Création et optimisation des tranches depuis Photoshop Ouvrons notre fichier enregistré depuis Fireworks, en psd. Nous retrouvons tous les calques

35 Nous avons récupéré tous les calques dans un dossier Calque Pour faire des tranches dans Photoshop il faut aller dans les outils, sous l outil «recadrage» Il y a l outil «tranche» et l outil «sélection de tranche»

36 Comme dans Fireworks il y a deux façons de faire les tranches. Soit on veut récupérer le contenu d un calque. Il faut alors sélectionner le calque et aller dans le menu «calque» Choisir «Nouvelle tranche d après un calque» Photoshop crée automatiquement des tranches autour de celle que nous venons de créer. Elles sont numérotées. En gris les tranches faites par Photoshop, en bleu, celle que nous avons faite

37 Pour renommer la tranche qui vient d être créée : Double cliquer sur celle-ci. Si vous avez cliqué ailleurs entre temps, il suffit de choisir l outil «sélection de tranche» Nommer la tranche ici La tranche faite d après le calque ne peut être modifiée. Les paramètres sont grisés

38 Pour créer une tranche qui ne comprend qu un morceau de calque Choisir l outil «tranche» et dessiner sur l objet. Double cliquer sur la tranche pour la nommer. Nommer la tranche ici La tranche créée avec l outil tranche peut être modifiée dans cette fenêtre, ou en cliquant sur les bords de la tranche pour changer les dimensions, ou en utilisant les flèches du clavier pour la déplacer

39 Optimiser les tranches dans Photoshop Sans rien sélectionner, aller dans le menu «fichier» «exporter pour le Web et les périphériques», choisir 2 vignettes.

40 Optimiser les tranches dans Photoshop Choisir dans le menu déroulant le format choisi ici PNG24 pour la transparence. Rappel : il s agit en fait d un PNG32 poids de l image optimisée Recommencer pour chaque tranche

41 Sélectionner toutes les tranches en cliquant dessus avec l outil tranche et la touche «shift» poids de toues les tranches sélectionnées Mixte dit qu il y a plusieurs formats d images cliquer sur «enregistrer»

42 Choisir uniqument les images à exporter Choisir dans le menu déroulant Images Choisir dans le menu déroulant Paramètres Autre Cette dernière opération va nous permettre de choisir (comme dans FW) le nom de nos tranches sans ajouts

43 Changement du nom des tranches Choisir dans le menu déroulant Enregistrement des fichiers ne garder que nom de la tranche et ext nom final des tranches Cette opération va nous permettre de choisir (comme dans FW) le nom de nos tranches sans ajouts. Cliquer sur «ok»

44 Choisir le dossier de destination Ne pas se préocuper de ce nom de fichier Il n apparaîtra pas dans votre disque dur. Enregistrer Vous récupérer les gif, jpg et png dans votre dossier de destination Choisir dans le menu déroulant Tranches sélectionnées

45 Erreurs courantes Vous avez toutes les tranches dans votre dossier de destination vous n aviez pas sélectionné les tranches que vous vouliez récupérer ou vous avez oublié de cocher «tranches sélectionnées». Vos images s appellent dans Photoshop Les paramètres de sortie n ont pas été mémorisés. Retourner dans «paramètres» autres» «enregistrement des fichiers» avant d enregistrer. Vos images s appellent dans Fireworks Les paramètres de sortie n ont pas été mémorisés. Retourner dans «document HTML et Images», «options» «propre au document», changer les paramètres

Chapitre 22 Optimisation pour diffusion à l'écran, pour le web

Chapitre 22 Optimisation pour diffusion à l'écran, pour le web 1 1 9 9 7 7 Optimisation pour diffusion à l'écran, pour le web Diffusion pour le web........................ 31 Les paramètres avant l exportation................. 31 Optimisation pour le web......................

Plus en détail

REALISER UNE CARTE GEOGRAPHIQUE SUR MESURE

REALISER UNE CARTE GEOGRAPHIQUE SUR MESURE REALISER UNE CARTE GEOGRAPHIQUE SUR MESURE Que fait-on? On crée une carte géographique sur laquelle on n affiche que l information strictement nécessaire à la présentation d une oeuvre. Pourquoi le fait-on?

Plus en détail

Cliquez sur le menu Fichier / Nouveau, puis sur OK dans la fenêtre qui s'ouvre.

Cliquez sur le menu Fichier / Nouveau, puis sur OK dans la fenêtre qui s'ouvre. Photoshop vous permet de faire du montage photo. La superposition des éléments est gérée grâce aux calques. Il est crucial de bien comprendre leur fonctionnement car les calques sont l essence de Photoshop.

Plus en détail

Paint.NET Fiche n 3. Table des matières

Paint.NET Fiche n 3. Table des matières Paint.NET Fiche n 3 Table des matières Paint.NET Fiche n 3...1 1- Redimensionner...1 2- Recadrer...2 3- Enlever un élément gênant...2 4- Éclaircir une partie de l'image...3 5- Éclaircir une sélection complexe...3

Plus en détail

Mode d emploi du logiciel PhotoFiltre

Mode d emploi du logiciel PhotoFiltre Mode d emploi du logiciel PhotoFiltre Ce document a pour but de vous aider à redimensionner vos images. Confidentiel E-comouest 2009 Tous droits de reproduction interdits. 1. Installer PhotoFiltre 1. Installer

Plus en détail

DETOURAGE SUR GRAPHTEC GRACE A ILLUSTRATOR

DETOURAGE SUR GRAPHTEC GRACE A ILLUSTRATOR DETOURAGE SUR GRAPHTEC GRACE A ILLUSTRATOR Création d une matrice pour le Graphtec, Génération d un tracé sur Photoshop, Mise en page sur la matrice, Paramétrage du Plugin 1. Pour commencer, il faut créer

Plus en détail

TUTORIAL. www.benevolat.org TUTORIAL. Créez en quelques minutes votre site Internet!

TUTORIAL. www.benevolat.org TUTORIAL. Créez en quelques minutes votre site Internet! Créez en quelques minutes votre site Internet! SOMMAIRE : Choisir une interface graphique - Nommez votre site... page 03 5 étapes de création... page 04 Les outils de création graphique... page 05 Mise

Plus en détail

Créer l album Photo facilement:

Créer l album Photo facilement: Créer l album Photo facilement: Nous allons voir comment insérer automatiquement dans un diaporama des photos stockées sur votre ordinateur. Il ne nous sera pas nécessaire de créer les diapositives, elles

Plus en détail

Sommaire. Images Actives Logiciel libre développé par le CRDP de l académie de Versailles 2 Rue Pierre Bourdan Marly le Roi - 78160

Sommaire. Images Actives Logiciel libre développé par le CRDP de l académie de Versailles 2 Rue Pierre Bourdan Marly le Roi - 78160 Sommaire Choisir son image... 2 Enregistrer son travail... 3 Créer les détails... 4 Supprimer une zone ou un détail... 6 Les commentaires... 6 Créer un lien hypertexte... 8 Appliquer un modèle... 8 Personnaliser

Plus en détail

Adobe Photoshop. Bonnes pratiques pour une utilisation professionelle CHAPITRE 7

Adobe Photoshop. Bonnes pratiques pour une utilisation professionelle CHAPITRE 7 M2 Caweb 2014-2015 Enseignant : Boris Epp Adobe Photoshop Bonnes pratiques pour une utilisation professionelle CHAPITRE 7 Sommaire 1. Les scripts a. Qu est-ce qu un script? b. La fenêtre script c. Créer

Plus en détail

II. Image = un type de média en vocabulaire Joomla

II. Image = un type de média en vocabulaire Joomla AJOUT D IMAGES DANS UN ARTICLE I. A savoir Pour agrémenter les articles, il est intéressant de pouvoir y ajouter des images. Cette action importante demande de la rigueur dans son exécution afin de : -

Plus en détail

Créer des styles CSS simples

Créer des styles CSS simples Créer des styles CSS simples Les styles CSS mémorisent les attributs de caractère et de paragraphe comme la police, la taille, la couleur, l alignement du texte, etc... Vous pouvez ensuite les appliquer

Plus en détail

Support de cours Dreamweaver CS5 les images. MC Benveniste

Support de cours Dreamweaver CS5 les images. MC Benveniste Support de cours Dreamweaver CS5 les images MC Benveniste 2013 Insertion de contenu > insertion d images image hors du dossier racine Si l image ne se trouve pas dans le site dans lequel vous travaillez

Plus en détail

Traitements de base d une image avec PHOTOFILTRE

Traitements de base d une image avec PHOTOFILTRE Traitements de base d une image avec PHOTOFILTRE Barre d outils Barre d outils complémentaire Nouveau Niveaux automatiques Contrastes automatiques Ouvrir Luminosité (-) Luminosité (+) Enregistrer Contraste

Plus en détail

Réalisez votre propre carte de vœux Éléctronique

Réalisez votre propre carte de vœux Éléctronique Les différentes possibilités d animer une carte de vœux Il existe plusieurs possibilités d animer une carte de vœux : - Une Vidéo : Vous pouvez créer une vidéo, un film simplement avec Windows Media Player.

Plus en détail

Nom :... Prénom :... Classe :... Techniques infographiques. InDesign

Nom :... Prénom :... Classe :... Techniques infographiques. InDesign Nom :... Prénom :... Classe :... Techniques infographiques InDesign 1 Insertion de blocs textes et images (bases) a Création d un nouveau document...p04 b Le plan de travail...p05 c Les outils de base...p06

Plus en détail

Menu. Modifier les images et les photos avec Picture Manager

Menu. Modifier les images et les photos avec Picture Manager Menu Modifier les images et les photos avec Picture Manager 1. Lancer le logiciel (page 2) 2. Sélectionner le dossier à afficher 3. Créer le raccourci vers les images 4. Découvrir le logiciel (page 3)

Plus en détail

APPRENDRE ET DEBUTER AVEC PHOTOSHOP // Tutorial Photoshop CS Difficulté : // Télécharger le tutorial au format PDF.

APPRENDRE ET DEBUTER AVEC PHOTOSHOP // Tutorial Photoshop CS Difficulté : // Télécharger le tutorial au format PDF. ACCUEIL CREDITS SERVICES FORUM LIENS ANNEXES NAVIGATION Crédits Services Portfolio Forum Articles Tutoriaux Partenariat Contact APPRENDRE ET DEBUTER AVEC PHOTOSHOP // Tutorial Photoshop CS Difficulté :

Plus en détail

RETOUCHER DES IMAGES

RETOUCHER DES IMAGES RETOUCHER DES IMAGES 1. Télécharger le logiciel gratuit Paint.net 2 2. Première approche du logiciel 3 2.1. Ouvrir et afficher une image 3 2.2. Choisir les couleurs 3 2.3. Utiliser les outils de dessin

Plus en détail

Mise en forme avec les tableaux

Mise en forme avec les tableaux Mise en forme avec les tableaux Les tableaux se composent de lignes et de colonnes, comme les feuilles de calcul d Excel. Ils permettent de contrôler la mise en page de tous les objets d une page Web.

Plus en détail

Réalisation d un montage simple

Réalisation d un montage simple Réalisation d un montage simple Utilisation du logiciel de montage gratuit : Vidéospin de Pinnacle 1/ Télécharger le logiciel VideoSpin à l adresse suivante : http://videospin.com/fr/ Cliquer sur Télécharger

Plus en détail

EasyNewsletter. 1. Création d un groupe d envoi de newsletter

EasyNewsletter. 1. Création d un groupe d envoi de newsletter EasyNewsletter Créez et envoyez des newsletters contenant textes, images, liens, et téléchargements en toute simplicité. Avec cet outil, vous pouvez également gérer vos listes de diffusion en quelques

Plus en détail

«Pour débuter» La Gestion des photos avec Windows 7

«Pour débuter» La Gestion des photos avec Windows 7 «Pour débuter» La Gestion des photos avec Windows 7 Importer des photos depuis un appareil photo numérique, ou de la carte SD de l appareil photo. Deux possibilités s offre à vous, voyons la première méthode.

Plus en détail

Création du site dans Dreamweaver :

Création du site dans Dreamweaver : CHARGER, CREER et ENREGISTRER 1. Se connecter au RESEAU du COLLEGE avec tes 2 mots de passe 2. Charge le logiciel Au lancement du logiciel, l écran suivant s affiche : Palette des objets Lanceur Zone de

Plus en détail

Déroulement de la formation

Déroulement de la formation Notes de cours Traitement de l image Marc Bernier Déroulement de la formation 1. Les différents formats d image. 2. Présentation de quelques applications Adobe Air. 3. Redimensionnement d une ou plusieurs

Plus en détail

Feuille de style sous open office.

Feuille de style sous open office. Feuille de style sous open office. Une feuille de style permet de mettre en page un cours, un exposé ou un rapport en lui gardant la même présentation du début à la fin. Elle se programme avant de taper

Plus en détail

Les modèles Word 2010 Word 2013 du Cartable fantastique. Installation. Marie-Laure Besson

Les modèles Word 2010 Word 2013 du Cartable fantastique. Installation. Marie-Laure Besson Les modèles Word 2010 Word 2013 du Cartable fantastique Installation Marie-Laure Besson Ce tutoriel est destiné aux personnes qui désirent installer un modèle Word du Cartable fantastique manuellement.

Plus en détail

Gthumb : gestionnaire d'images

Gthumb : gestionnaire d'images Plus qu un simple visualisateur d images, Gthumb permet quelques manipulations parfois inédites. Il a été créé pour l environnement GNOME (mais il va sans dire qu il fonctionne aussi fort bien sous d autres

Plus en détail

SOMMAIRE 1. L espace de travail 2. La palette d outils 3.Les calques 4. Les différents modes de couleur 5. Les réglages de l image : luminosité,

SOMMAIRE 1. L espace de travail 2. La palette d outils 3.Les calques 4. Les différents modes de couleur 5. Les réglages de l image : luminosité, 1 SOMMAIRE 1. L espace de travail 2. La palette d outils 3.Les calques 4. Les différents modes de couleur 5. Les réglages de l image : luminosité, contraste 6. Modifier la taille de l image 7. Rotation

Plus en détail

EXEMPLE DE PAGE : FORMAT A4 (210X297)

EXEMPLE DE PAGE : FORMAT A4 (210X297) EXEMPLE DE PAGE : FORMAT A4 (210X297) 220 210 Filet noir format réel du document soit 210x297mm Zone Rose Marge intérieure de 5 milimètres ou zone d exclusion qui doit être, si possible vierge de tout

Plus en détail

Vectorisation des images

Vectorisation des images Vectorisation des images Bienvenue dans CorelDRAW, programme de dessin vectoriel et de conception graphique complet destiné aux professionnels de l image. Dans ce didacticiel, vous apprendrez à vectoriser

Plus en détail

A) - Différents logiciels pour retouche de photos... 2. B) - Logiciel PICASA... 2. C) - Logiciel XnView... 6

A) - Différents logiciels pour retouche de photos... 2. B) - Logiciel PICASA... 2. C) - Logiciel XnView... 6 Sommaire A) - Différents logiciels pour retouche de photos... 2 B) - Logiciel PICASA... 2 C) - Logiciel XnView... 6 1) - Renommer vos photos par lots... 7 2) - Redimensionnement des photos... 8 9_Retouches_Photos.doc

Plus en détail

Picasa Utilisation : 1 ère partie

Picasa Utilisation : 1 ère partie Picasa Utilisation : 1 ère partie Pour ouvrir Picasa, faîtes un double clic sur l icône présente sur le bureau. Vous pouvez également cliquer sur le menu Démarrer, Tous les programmes, Picasa 3. Lorsque

Plus en détail

Le modèles Word 2007. Installation. Marie-Laure Besson

Le modèles Word 2007. Installation. Marie-Laure Besson Le modèles Word 2007 Installation Marie-Laure Besson Ce tutoriel est destiné aux personnes qui désirent installer un modèle Word du Cartable fantastique manuellement. Un installateur a été créé permettant

Plus en détail

INFOGRAPHIE Tutoriel Gimp : caricature

INFOGRAPHIE Tutoriel Gimp : caricature Tutoriel Gimp : caricature The Gimp possède en effet un outil de déformation interactif très pratique pour créer des défauts, faire des déformations, bref pour réaliser des caricatures à partir de vos

Plus en détail

Leçon N 11 Faire un Album de photo avec ALBELLI 2 ème partie

Leçon N 11 Faire un Album de photo avec ALBELLI 2 ème partie Leçon N 11 Faire un Album de photo avec ALBELLI 2 ème partie Vous allez créer avec cette leçon un album de photo avec le logiciel «Albelli livre photo». 2 La préparation Le travail le plus important pour

Plus en détail

Utilisation du logiciel PURPLE PEN

Utilisation du logiciel PURPLE PEN Utilisation du logiciel PURPLE PEN Préparation de cartes mères, circuits, courses au score, en course d orientation Purple Pen est un logiciel destiné à la course d orientation, gratuit, disponible en

Plus en détail

Point 3.5. Publier des contenus dans un portail e-sidoc. Mars 2014 Documentation détaillée V 2.3

Point 3.5. Publier des contenus dans un portail e-sidoc. Mars 2014 Documentation détaillée V 2.3 Point 3.5 Publier des contenus dans un portail e-sidoc Mars 2014 Documentation détaillée V 2.3 LA PUBLICATION D ACTUALITES... 2 La saisie d une actualité... 2 Déplacer une actualité... 4 Principes d affichage

Plus en détail

Nous allons créer un puzzle composé de 16 pièces.

Nous allons créer un puzzle composé de 16 pièces. Nous allons créer un puzzle composé de 16 pièces. Ces pièces seront autant de calques pour créer une animation du type Gif animé dans le programme ImageReady. Dans le dossier Mes Images (ou ailleurs!)

Plus en détail

TD M1205 - Infographie MMI1 - Les formats de fichiers image

TD M1205 - Infographie MMI1 - Les formats de fichiers image TD M1205 - Infographie MMI1 - Les formats de fichiers image 1. Préalable : extension des fichiers Dans les pages qui suivent il est question d extension des fichiers. Il est bien sûr préférable d afficher

Plus en détail

Le Système d Exploitation Windows 8

Le Système d Exploitation Windows 8 Le Système d Exploitation Windows 8 La page d accueil... 1 Une Visite dans les angles de l écran.... 3 Le Menu Rechercher.... 4 Pour sortir d une page et revenir sur une autre.... 5 Depuis un site Internet....

Plus en détail

OWNCLOUD L INTERFACE WEB. La réponse informatique

OWNCLOUD L INTERFACE WEB. La réponse informatique OWNCLOUD L INTERFACE WEB La réponse informatique Cette documentation a pour but de vous présenter les différentes options présentes sur l interface WEB. I- L INTERFACE WEB Pour commencer, connectez-vous

Plus en détail

FICHIERS ET DOSSIERS

FICHIERS ET DOSSIERS La différence entre fichier et dossier FICHIERS ET DOSSIERS La première notion à acquérir est la différence entre un dossier et un fichier Un dossier est une sorte de classeur dans lequel on range divers

Plus en détail

L image numérique. Bitmap (ou matricielle) vectorielle

L image numérique. Bitmap (ou matricielle) vectorielle L image numérique Bitmap (ou matricielle) vectorielle L image Bitmap (ou matricielle) L image est considérée comme un rectangle constitué de points élémentaires appelés pixels. Elle permet la qualité photographique

Plus en détail

Dessiner avec GIMP - Introduction des calques

Dessiner avec GIMP - Introduction des calques Dessiner avec GIMP - Introduction des calques Comme nous l avons signalé précédemment, GIMP comme PS sont des logiciels d infographie, nous allons donc créer notre première image. Ouvrir une feuille et

Plus en détail

PHOTOSHOP CALQUES NOTIONS DE BASE

PHOTOSHOP CALQUES NOTIONS DE BASE Niveau : Que tout le monde devrait avoir COURS PHOTOSHOP PHOTOSHOP CALQUES NOTIONS DE BASE INTRODUCTION Nous avons vu, jusqu à maintenant, des corrections et traitements de base qui sont appliqués sur

Plus en détail

Créer un dessin avec Word

Créer un dessin avec Word Créer un dessin avec Word Introduction Introduction Deux écoles, pour la création du dessin La réalisation du dessin Dessin à partir d une image Afficher les dessins Dans le menu, choisir : Outils Option

Plus en détail

Initiation à Photoshop

Initiation à Photoshop 56 / 81 Scanner une image Un Scanner transforme une image papier en un fichier numérique Pour cela il faut définir: le type d image (couleur, niveau de gris ou texte) la résolution en dpi ou ppp (point

Plus en détail

Leçon N 4 Picasa 1 ère Partie

Leçon N 4 Picasa 1 ère Partie Leçon N 4 Picasa 1 ère Partie Nous allons maintenant revoir PICASA en détail, car c est le principal logiciel pour gérer et traiter ses photos et que vous serez amenés à utiliser assez souvent. PICASA

Plus en détail

Utiliser le logiciel Freemake Video Converter

Utiliser le logiciel Freemake Video Converter Utiliser le logiciel Freemake Video Converter Le logiciel Freemake Video Converter permet, comme d autres programmes, de récupérer des vidéos de la toile et de les traiter. Lors de son installation, choisir

Plus en détail

Aller plus loin avec le traitement de texte : mettre en forme un Curriculum Vitae

Aller plus loin avec le traitement de texte : mettre en forme un Curriculum Vitae 29 janvier 2013 p 1 Aller plus loin avec le traitement de texte : mettre en forme un Curriculum Vitae Pour permettre au plus grand nombre de réaliser cet exercice, nous utiliserons le logiciel libre Libre

Plus en détail

Irfanview Le menu Fichier

Irfanview Le menu Fichier Irfanview Le menu Fichier Vous permet d ouvrir un fichier. La fonction Réouvrir permet de revenir à la dernière version enregistrée en annulant toutes les modifications faites. Ouvre un explorateur de

Plus en détail

TP retouche d image 4A- Création d une carte postale

TP retouche d image 4A- Création d une carte postale TP retouche d image 4A- Contact: Réseau des Espaces Publics Numériques du Pays de Montbéliard 31, avenue des alliés 25200 Montbéliard epn@agglo-montbeliard.fr Tel : 03 81 31 89 18 Recadrage de l image

Plus en détail

_ Julien Rousset, ftice, Aubenas 1 & 2

_ Julien Rousset, ftice, Aubenas 1 & 2 Préparations des Médias (photos, sons, clips vidéo) pour Didapages et diffusion du livre après finalisation en complément du document distribué en animation pédagogique Julien Rousset, ftice, Aubenas 1

Plus en détail

SOMMAIRE 1 INTRODUCTION 3 2 CONTACTER VOTRE SUPPORT 3 3 ESPACE DE GESTION DES CARTES 4 4 CONFIGURER UNE CARTE 5

SOMMAIRE 1 INTRODUCTION 3 2 CONTACTER VOTRE SUPPORT 3 3 ESPACE DE GESTION DES CARTES 4 4 CONFIGURER UNE CARTE 5 SOMMAIRE 1 INTRODUCTION 3 2 CONTACTER VOTRE SUPPORT 3 3 ESPACE DE GESTION DES CARTES 4 4 CONFIGURER UNE CARTE 5 4.1 Ajouter une carte 5 4.1.1 Détails : nom, taille, marqueur 5 4.1.2 Ajout d un marqueur

Plus en détail

Logiciel. Creative Photos. Cachet du magasin :

Logiciel. Creative Photos. Cachet du magasin : Logiciel Creative Photos Cachet du magasin : Installez le logiciel Creative Photos Insérez votre CD dans le lecteur de votre ordinateur et laissez le logiciel se lancer automatiquement. Si rien ne se passe,

Plus en détail

Date Version Auteur Notes 14/09/2014 1.1 Direction Informatique Création. Accueil Zimbra. Aide utilisateur

Date Version Auteur Notes 14/09/2014 1.1 Direction Informatique Création. Accueil Zimbra. Aide utilisateur Date Version Auteur Notes 14/09/2014 1.1 Direction Informatique Création Accueil Zimbra Aide utilisateur Ce document explique le fonctionnement de l accueil Zimbra, comment l utiliser et le personnaliser.

Plus en détail

ANIMATION PAR LE COLORIAGE avec GIMP

ANIMATION PAR LE COLORIAGE avec GIMP ANIMATION PAR LE COLORIAGE avec GIMP Ouvrir le logiciel GIMP Aller chercher l'image qui va servir pour fabriquer l'animation. FICHIER / OUVRIR Dans la palette des calques la première image s appelle «Arrière-plan»

Plus en détail

Créer sa première base de données Access Partie 4/4 - Création d un état

Créer sa première base de données Access Partie 4/4 - Création d un état - le 19/02/2013 Créer sa première base de données Access Partie 4/4 - Création d un état Ce tutoriel est la suite de l article sur la création d une table, l article sur la création d une requête et l

Plus en détail

Picasa Principes de base

Picasa Principes de base Présentation : Ce cours vous permettra de comprendre et appréhender le logiciel de photo Picasa. Qu est ce que PICASA? PICASA est le gestionnaire de photos créé par Google, il permet de rechercher, gérer,

Plus en détail

GUIDE D UTILISATION DU BACKOFFICE

GUIDE D UTILISATION DU BACKOFFICE GUIDE D UTILISATION DU BACKOFFICE 1. Modifier les pages du site : - Aller dans l onglet «PAGE HTML», puis «Liste des pages HTML» - Pour visualiser votre page, cliquer sur le nom écrit en vert, dans la

Plus en détail

Guide de correction et d optimisation des images en vue de leur publication sous Marcomedia Contribute. Logiciel utilisé : Adobe PhotoShop 7

Guide de correction et d optimisation des images en vue de leur publication sous Marcomedia Contribute. Logiciel utilisé : Adobe PhotoShop 7 Guide de correction et d optimisation des images en vue de leur publication sous Marcomedia Contribute Logiciel utilisé : Adobe PhotoShop 7 Etape 1 Sélectionner les images, et les copier dans un répertoire

Plus en détail

Guide d utilisation des gabarits au format Photoshop

Guide d utilisation des gabarits au format Photoshop Guide d utilisation des gabarits au format Photoshop Préambule Version du 21/03/14 Note: Ce guide est exclusivement réalisé pour le logiciel photoshop, si vous travaillez avec un autre logiciel type: Illustrator,

Plus en détail

Gestion des sites Internet du groupe Stem Notice d utilisation

Gestion des sites Internet du groupe Stem Notice d utilisation Gestion des sites Internet du groupe Stem Notice d utilisation Table des matières Présentation 2 Connexion à la plateforme de gestion 2 Gestion et modification du contenu 3 Gestion des documents 13 Gérer

Plus en détail

Paint.NET. Rappel sur les fichiers image :

Paint.NET. Rappel sur les fichiers image : Paint.NET Rappel sur les fichiers image : En informatique, une image est composée de pixels (Picture Element). Les dimensions d'une image sont exprimées par sa hauteur et largeur en pixels. Les images

Plus en détail

Cinquième projet Scribus

Cinquième projet Scribus Sommaire 1. Présentation du projet... 2 1.1. Organiser son travail... 2 2. Réalisation... 2 2.1. Préparation des textes... 2 2.2. Création du document Scribus... 3 2.3. Importer des gabarits... 3 2.4.

Plus en détail

Leçon N 2E Utilisation d un traitement de texte (2 ème partie)

Leçon N 2E Utilisation d un traitement de texte (2 ème partie) Leçon N 2E Utilisation d un traitement de texte (2 ème partie) Nous allons travailler sur la MISE EN FORME d un document. 1 Mise en forme des caractères Les logiciels Word et Writer regroupent les commandes

Plus en détail

Pour augmenter la taille du texte, plusieurs possibilités sont disponibles :

Pour augmenter la taille du texte, plusieurs possibilités sont disponibles : Agrandir le texte A l'ouverture de la page, l'écran contient l'ensemble de la fiche. Ceci vous permet de visualiser l'architecture de la fiche, mais peut rendre difficile la lecture du texte. Pour augmenter

Plus en détail

Logiciel Presentation d OpenOffice

Logiciel Presentation d OpenOffice Impress ou Presentation en francais est un logiciel de PréAO (Présentation Assistée par Ordinateur), il est compris dans la suite bureautique libre et gratuite Open Office. Ce logiciel est téléchargeable

Plus en détail

TUTO XNVIEW TRAITEMENT FACILE DE PHOTOS (recadrage, luminosité, traitement par lot.)

TUTO XNVIEW TRAITEMENT FACILE DE PHOTOS (recadrage, luminosité, traitement par lot.) TUTO XNVIEW TRAITEMENT FACILE DE PHOTOS (recadrage, luminosité, traitement par lot.) Ouvrir un fichier image ou un dossier Solution 1 : Fichier -> Ouvrir (de cette façon, on cherche notre image et il nous

Plus en détail

2 ème année C Option Informatique. Introduction à Powerpoint. PAYOT Cédric 2C Informatique 1

2 ème année C Option Informatique. Introduction à Powerpoint. PAYOT Cédric 2C Informatique 1 2 ème année C Option Informatique Introduction à Powerpoint PAYOT Cédric 2C Informatique 1 1. Introduction Le logiciel Microsoft PowerPoint permet de créer une présentation pour écran et vidéo projecteur

Plus en détail

Styler un document sous OpenOffice 4.0

Styler un document sous OpenOffice 4.0 Mars 2014 Styler un document sous OpenOffice 4.0 Un style est un ensemble de caractéristiques de mise en forme (police, taille, espacement, etc.) qui sert à structurer un document en l organisant de manière

Plus en détail

Atelier d initiation. Gestion de fichiers et de dossiers

Atelier d initiation. Gestion de fichiers et de dossiers Atelier d initiation Gestion de fichiers et de dossiers Contenu de l atelier Fichier... 1 Dossier... 1 Explorateur Windows... 1 Ouverture de l Explorateur Windows avec le menu Démarrer... 1 Ouverture

Plus en détail

Leçon N 5 PICASA Généralités

Leçon N 5 PICASA Généralités Leçon N 5 PICASA Généralités Avec cette leçon N 5, nous allons commencer l étude du traitement de vos photos avec le logiciel de GOOGLE, PICASA, que vous avez téléchargé dans la leçon N 3. 1 Présentation

Plus en détail

La reconnaissance optique de caractère : «Océriser» un document avec Abbyy FineReader

La reconnaissance optique de caractère : «Océriser» un document avec Abbyy FineReader La reconnaissance optique de caractère : «Océriser» un document avec Abbyy FineReader FineReader est une marque déposée propriété de la société ABBYY Le contenu de ce tutoriel est placé sous copyright

Plus en détail

Les images numériques

Les images numériques Les images numériques On traite les opérations sur les images numériques en plusieurs temps : 1. L acquisition d images Elles proviennent Du scanner De l appareil photo numérique D images envoyées par

Plus en détail

Guide utilisateur Imagine moviesolutions 2011

Guide utilisateur Imagine moviesolutions 2011 Guide utilisateur Imagine moviesolutions 2011 Les premiers pas avec Imagine Après avoir téléchargé le programme, double- cliquez sur l icône : Lors du premier lancement d Imagine, vous allez pouvoir modifier

Plus en détail

Espace de travail. Les éléments... 12 Modifications de l affichage... 17

Espace de travail. Les éléments... 12 Modifications de l affichage... 17 Espace de travail Les éléments... 12 Modifications de l affichage... 17 Chapitre 1 Espace de travail L espace de travail d InDesign CS4 s inscrit dans la lignée de tous les produits de la gamme Creative

Plus en détail

Réaliser une composition photographique avec the Gimp

Réaliser une composition photographique avec the Gimp Réaliser une composition photographique avec the Gimp Introduction Ouvrir le logiciel The Gimp Ouvrir un fichier image dans Gimp Ouvrir la boite de dialogue calques Détourer une photo Réalisation : François

Plus en détail

FICHE 9 : INSERER UNE IMAGE

FICHE 9 : INSERER UNE IMAGE FICHE 9 : INSERER UNE IMAGE Vous avez la possibilité dans Publisher tout comme dans Word d insérer une image clipart, une image personnelle à partir d un fichier ou une image à scanner. Vous pouvez également

Plus en détail

Fonctionnalités avancées de Word

Fonctionnalités avancées de Word BIBLIOTHÈQUE UNIVERSITAIRE DE LILLE 1 Thèses et littérature grise Fonctionnalités avancées de Word Bibliothèque de l université des sciences et technologies de Lille 1 Diffusion électronique des thèses

Plus en détail

CREATION D UN QUESTIONNAIRE AVEC QUESTION-REPONSE

CREATION D UN QUESTIONNAIRE AVEC QUESTION-REPONSE CREATION D UN QUESTIONNAIRE AVEC QUESTION-REPONSE ETAPE 1 : CREATION DU QUESTIONNAIRE SIMPLE Nous allons concevoir un questionnaire sur les moyens de communications. Pour créer un formulaire, cliquez sur

Plus en détail

FACTURATION. Menu. Fonctionnement. Allez dans le menu «Gestion» puis «Facturation» 1 Descriptif du dossier (onglet Facturation)

FACTURATION. Menu. Fonctionnement. Allez dans le menu «Gestion» puis «Facturation» 1 Descriptif du dossier (onglet Facturation) FACTURATION Menu Allez dans le menu «Gestion» puis «Facturation» Fonctionnement 1 Descriptif du dossier (onglet Facturation) 2 Maintenance des articles 3 Edition des articles 4 Saisie des factures 5 Validation

Plus en détail

Pop-Art façon Roy Liechtenstein

Pop-Art façon Roy Liechtenstein 1 sur 6 22/01/2010 22:35 Pop-Art façon Roy Liechtenstein Ce tutoriel peut paraître loin de la photographie, mais il contient des techniques très utiles, voire indispensables en matière de retouche. 1 -

Plus en détail

Comment convertir des documents PDF au format mviewer pour TI-Nspire

Comment convertir des documents PDF au format mviewer pour TI-Nspire Tutoriel TI-Planet Comment convertir des documents PDF au format mviewer pour TI-Nspire A l'usage de tous Xavier Andréani 12 février 2011 Table des matières Introduction...2 A)Ouverture d'une page du fichier

Plus en détail

Créer un album Web. L'album Web. Accueil

Créer un album Web. L'album Web. Accueil Créer un album Web Pourquoi créer un album Web? pour échanger ses photos avec ses proches pour sauvegarder ses images sur un autre support L'album Web Il existe divers sites permettant de stocker ses photos

Plus en détail

KompoZer. Composition du site : _ une page d'accueil : index.html. _ une page pour la théorie : theorie.html. _ une page pour les photos : photos.

KompoZer. Composition du site : _ une page d'accueil : index.html. _ une page pour la théorie : theorie.html. _ une page pour les photos : photos. KompoZer Créer un site «simple» Composition du site : _ une page d'accueil : index.html _ une page pour la théorie : theorie.html _ une page pour les photos : photos.html _ une page avec la galerie : galerie.html

Plus en détail

OpenOffice 2.3. Le traitement de texte «Writer» page 1 / 8

OpenOffice 2.3. Le traitement de texte «Writer» page 1 / 8 Le traitement de texte «Writer» page 1 / 8 1. Enregistrer un document au format souhaité (et souhaitable) 2. Personnaliser OpenOffice 2.3 3. Utiliser les tableaux 4. Insérer une image dans un traitement

Plus en détail

Animation Shop PREAMBULE... 2 CONTRAINTE... 2 CREER UNE ANIMATION... 2 AJOUTER DES IMAGES... 3 ENREGISTRER UNE ANIMATION... 3

Animation Shop PREAMBULE... 2 CONTRAINTE... 2 CREER UNE ANIMATION... 2 AJOUTER DES IMAGES... 3 ENREGISTRER UNE ANIMATION... 3 Jasc Software Animation Shop Sommaire : PREAMBULE... 2 CONTRAINTE... 2 CREER UNE ANIMATION... 2 AJOUTER DES IMAGES... 3 ENREGISTRER UNE ANIMATION... 3 AJOUTER DE L'EFFET... 5 TRANSISSIONS D'IMAGE... 5

Plus en détail

Sommaire : tutorial Powerpoint 2003

Sommaire : tutorial Powerpoint 2003 Sommaire : tutorial Powerpoint 2003 Ouvrir le logiciel PowerPoint 2003...2 Affichage «mode normal» : mode de travail...3 Ajouter un modèle de conception existant...4 Insertion d une nouvelle diapositive

Plus en détail

1 Liste des fonctionnalités de l éditeur :... 3 2 Gestionnaire d images... 4 2.1 Insérer une image qui existe déjà sur le serveur :... 4 2.

1 Liste des fonctionnalités de l éditeur :... 3 2 Gestionnaire d images... 4 2.1 Insérer une image qui existe déjà sur le serveur :... 4 2. Intranet EERV Edition des articles Table des matières : 1 Liste des fonctionnalités de l éditeur :... 3 2 Gestionnaire d images... 4 2.1 Insérer une image qui existe déjà sur le serveur :... 4 2.2 Charger

Plus en détail

- JE ME PERFECTIONNE - 8 Janvier 2014 JE CREE MA CARTE DE VOEUX

- JE ME PERFECTIONNE - 8 Janvier 2014 JE CREE MA CARTE DE VOEUX - JE ME PERFECTIONNE - 8 Janvier 2014 JE CREE MA CARTE DE VOEUX Objectif de la séance VOTRE CARTE DE VŒUX Vous allez réaliser la carte de vœux de votre choix avec vos photos et vos illustrations personnelles.

Plus en détail

Traitement de l'image avec le logiciel Pixia

Traitement de l'image avec le logiciel Pixia Traitement de l'image avec le logiciel Pixia Préparé par David Lamoureux Secteur des Technologies Éducatives Mars 2003 15200 Sherbrooke Est, Montréal, Qc, H1A 3P9 Téléphone (514) 498-4759 Télécopieur (514)

Plus en détail

Ouvrir Paint. Outils Paint

Ouvrir Paint. Outils Paint Ouvrir Paint Paint est un programme de dessin qui vous permet de créer des dessins ou de modifier des images numériques. Paint vous permet aussi d enregistrer des fichiers d image à l aide de différents

Plus en détail

Création d articles sur le site web du GSP

Création d articles sur le site web du GSP Création d articles sur le site web du GSP Mode d emploi pour les membres du groupe spéléo Porrentruy. www.speleoporrentruy.ch 1 Article avec photo et document pdf sur le site du groupe spéléo Porrentruy

Plus en détail

script sous photoshop, mode d emploi

script sous photoshop, mode d emploi script sous photoshop, mode d emploi sommaire préambule... 2 un grand classique... 3 on se lance... 3 les traitements... 5 la signature... 8 cadre et ombre... 9 utilisation... 15 aller plus loin... 16

Plus en détail

Gimp. Découverte de l espace de travail. Diaporamas,extraits du Cahier Gimp spécial débutants Editions Eyrolles Auteur : Raymond Ostertag

Gimp. Découverte de l espace de travail. Diaporamas,extraits du Cahier Gimp spécial débutants Editions Eyrolles Auteur : Raymond Ostertag Gimp Découverte de l espace de travail Diaporamas,extraits du Cahier Gimp spécial débutants Editions Eyrolles Auteur : Raymond Ostertag Gimp Découvrir l espace de travail Le premier contact avec le logiciel

Plus en détail

La Clé informatique. Formation Access XP Aide-mémoire

La Clé informatique. Formation Access XP Aide-mémoire La Clé informatique Formation Access XP Aide-mémoire Septembre 2003 Définitions de termes Base de données : Se compare à un énorme classeur ayant plusieurs tiroirs où chacun d eux contient des informations

Plus en détail

Guide d utilisation 2012

Guide d utilisation 2012 Guide d utilisation 2012 Tout ce dont vous avez besoin pour bien démarrer REACOM La performance marketing SOMMAIRE Démarrez avec reagiciel Accédez à votre console d administration 4 Gestion internet Aperçu

Plus en détail