Eléa 2000 - Aide en ligne

1 - Introduction – la philosophie d’Eléa 2000 2 - Pourquoi ? Pour qui ? 3 - Les modes de couleur 4 - Les outils : principes 5 - Détail des outils
	5.1 – Harmoniseur
		5.1.1 - Section « couleur de base » 5.1.2 - Section « harmonies » 5.1.3 - Section « Couleurs » 5.1.4 - Section « Bordure » 5.1.5 - Section « Affichage » 5.1.6 - Section « Outils » 5.1.7 - Section « Réglage fin » 5.1.8 - Les autres fonctions 5.1.9 - Barre d’état 5.1.10 - Fenêtres de prévisualisation 5.1.11 - Clic droit de la souris et « presse papier » 5.1.12 - Les menus 5.1.13 - Raccourcis claviers
	5.2 – Palette Pro
		5.2.1 – Roue des couleurs 5.2.2 – Section palette 5.2.3 – Section résolution 5.2.4 – Section niveau 5.2.5 – Section outils 5.2.6 – Barre d’état 5.2.7 – Clic droit et « presse papier » 5.2.8 – Boutons « Ok » et « Annuler »
	5.3 – Contrast
		5.3.1 – Section couleurs 5.3.2 – Section édition 5.3.3 – Réglages 5.3.4 – Fonctions aléatoires 5.3.5 – Clic droit et « presse papier » 5.3.6 – Boutons « Ok » et « Annuler »
	5.4 – Composeur
		5.4.1 – Palette 5.4.2 – Désaturation de la couleur de base 5.4.3 – Zone de travail 5.4.4 – Boite à outils 5.4.5 – Enregistrer – Ouvrir 5.4.6 – Sélection / modification des couleurs 5.4.7 – Clic droit et « presse papier » 5.4.8 – Boutons « Ok » et « charte chromatique »
	5.5 – Charte chromatique
		5.5.1 – Nommer des couleurs 5.5.2 – Choix du modèle de charte 5.5.3 – Créer charte sous 5.5.4 – Visualiser 5.5.5 – Création d’un modèle personnalisé
6 - Contacter l’auteur 7 - Remerciements 8 - Configuration Matérielle 9 - En savoir plus sur les couleurs (bibliographie)

1 - Introduction – la philosophie d’Eléa 2000

Eléa 2000 a pour objectif d’aider ses utilisateurs dans le choix de couleurs. Elle permet tant à l’amateur qu’au professionnel de fixer ses choix en fonction de logiques mathématiques et harmoniques, avec pour finalité l’obtention d’une charte chromatique.

A partir des multiples outils disponibles il est possible d’obtenir une palette de couleurs de façon totalement automatisée, ou bien totalement libre.

L’abondance d’outils a pour objectif de permettre à chacun de trouver sa façon de composer les couleurs.

Les affichages des couleurs et leur harmonisation sont basés sur des recherches approfondies sur la couleur réalisées par des Maître en la matière tels Johannes Itten, ou encore Robert Chalavoux.

En général, après 3 couleurs harmonisées, les couleurs supplémentaires sont des dérivés ou des composantes des premières. Le fait de pouvoir composer sur 5 couleurs permet plus de combinaisons. Il est possible d’harmoniser jusqu’à l’infini. Ex : on harmonise une couleur avec trois autres, puis chacune avec encore 3 autres, etc.

2 - Pourquoi ? Pour qui ?

Il existe nombre de situations où l’on peut être confronté au choix de couleur : dessin, peinture, mise en pages, web design, typographie, architecture, développement d’interfaces… Le problème à résoudre étant l’obtention rapide et standardisée d’une charte chromatique.

Eléa 2000 a pour principal objectif les utilisations informatiques de la couleur. Il s’agira du web designer en premier lieu. Les fonctions d’affichage du code hexadécimal et rvb, ainsi que le « copier/coller » en sont les résultantes. Il s’agira ensuite de l’illustrateur, et du composeur de pages en PAO.

Chacun peut obtenir par l’intermédiaire d’Eléa 2000 des chartes chromatiques qu’il pourra distribuer à ses clients ou à ses collaborateurs. Cette charte est disponible sous trois formes : un fichier Eléa 2000, un fichier HTML, un document résultant de l’impression du fichier HTML.

HTML et toute sa souplesse laisse l’utilisateur libre de modifier le fichier à sa convenance (voir partie Charte chromatique).

3 – Les modes de couleur

RVB (rouge/vert/bleu) ou RGB:
Eléa 2000 utilise le format standard RVB adopté pour l’affichage informatique des couleurs à l’écran. Les couleurs sont toujours reproduites à l’aide de ce standard. Le choix par curseurs et la visualisation des composantes rouges, vertes et bleues utilisent principalement ce standard.

Hexadécimal :
Pour une compatibilité avec les applications demandant un format de couleur hexadécimal (outils web en général), Eléa 2000 fourni la conversion RVB>Hexa. Le code hexadécimal est souvent disponible avec un clic droit pour le copier dans le presse-papier. La fonction Web-safe permet d’ajuster la valeur hexadécimale pour la faire correspondre aux 216 couleurs de la palette Web (multiples de &h33 le plus proche).

TSL (teinte/saturation/luminosité) ou HSV :
Ce format est disponible dans les fenêtres de choix de couleur Windows. En outre, il est utilisé dans les calculs automatiques des harmonies et dans les calculs d’affichage de la Palette Pro.

Note :
La fonction « classer par luminosité » utilise la valeur luminosité du mode TSL. En conséquence, la luminosité d’une couleur correspond à la valeur la plus haute des composantes RVB. Il s’agit donc d’une luminosité objective de la couleur, selon ses composantes, et non d’une luminosité subjective en fonction de l’impression que peut donner la couleur à l’œil humain.

4 - Les outils : principes

Fenêtre principale (Harmoniseur) :
A partir de cette fenêtre il est possible de créer des harmonies de couleurs en fonction d’une couleur de base. Plusieurs types d’harmonies automatiques sont disponibles. La prévisualisation des couleurs est modifiable en fonction du nombre de couleurs choisies.

Il est possible d’effectuer des réglages et des modifications sur les couleurs affichées a partir de divers boutons. Les valeurs RVB et Hexadécimales des couleurs sont visualisables dans la barre d’état en bas et dans les cadre de prévisualisation.

Les diverses fonctions et outils sont également accessibles à partir de cette fenêtre.

Palette Pro :
C’est un outils permettant un choix des couleurs plus pointu. Il reprend sous forme géométriques les diverses méthodes d’harmonisations. Un éventail très large de formes est disponible, ainsi que la possibilité d’importer une image en guise de palette de couleur.

Contrast :
Il permet de mettre en contraste jusqu’à 3 couleurs. Les modifications des composantes de chaque couleur sont immédiates et permettent d’appréhender les concepts de contrastes, et de les améliorer.

Composeur :
Interface permettant de visualiser sommairement les diverses couleurs en les affectant à des régions sur une composition. Viennent s’ajouter des possibilités de mélange des couleurs entres elles, et avec du blanc ou du noir. C’est à partir d’ici que l’on peut sauvegarder des réglages.

Charte Chromatique :
Permet la génération d’un fichier HTML en tant que charte chromatique. Le principe est d’utiliser un fichier HTML source dans lequel des champs sont insérés, et de remplacer ces champs par les données de couleurs, de titres et de références disponibles dans l’interface charte chromatique. Un fichier HTML est obtenu au final, visualisable par exécution du navigateur par défaut, et modifiable à souhait dans n’importe quel éditeur.

Le fichier source HTML peut être modifié. Il est également possible de créer ses propres fichiers sources (voir utilisation avancée des outils).

5 – Détail des outils

5.1 – Harmoniseur

L’harmoniseur permet l’obtention automatique d’une harmonie de couleurs à partir d’une couleur de base.

Sélecteur de couleur : il permet de sélectionner directement une couleur de base à partir du sélecteur standard de Windows.

Curseurs R, V, B : chacun permet de faire varier en temps réel les trois composantes (rouge, vert et bleu) de la couleur de base. Ce fonctionnement permet un réglage très fin. La valeur de la composante est visible à l’extrémité (comprise ente 0 et 255)

Bouton Aléatoire : il permet de générer de façon totalement aléatoire une couleur.

Le sélecteur permet de choisir entre plusieurs type d’harmonisation des couleurs entres elles. Chaque type d’harmonie est un calcul complexe, basé sur les théories classiques ou modernes de la couleur et des contrastes. Lorsqu’ Eléa 2000 vient d’être lancé, aucune harmonie n’est sélectionnée. Aucun calcul n’est donc réalisé, les couleurs restent donc noires, hormis la couleur de base.

La dernière valeur, « manuel », lance l’outil Palette Pro pour un choix manuel de l’harmonie.

Cette partie permet de choisir le nombre de couleurs à harmoniser. De 2 à 5 couleurs sont utilisables. Néanmoins à partir de 4, certains outils ne sont plus disponibles (contrast).

Permet de teinter en noir le bord des figures de prévisualisation des couleurs. Ceci peut être rendu nécessaire lorsque les couleurs « bavent » l’une sur l’autre. Cet effet est la conséquence d’un moniteur ou d’une carte vidéo de mauvaise qualité, ou bien d’un contraste de couleur particulier.

Permet de modifier l’aspect de la fenêtre de visualisation des couleurs en fonction du nombre de couleurs.

Permet de lancer directement des outils ou des calculs. Les quatre boutons et leur fonction :

Permet de contrôler plus finement le calcul de l’harmonie en insérant une variation dans le calcul grâce au curseur. Le bouton « zéro » permet de remettre rapidement le curseur au point neutre.

« Calcul de la proportion des couleurs en fonction de la luminosité » : Affiche dans la fenêtre du dessous, les couleurs, en faisant varier leur taille, les une par rapport aux autres en fonction de leur luminosité maximale. La luminosité maximale est calée sur la valeur L du mode HSL (HSV) après conversion interne dans ce format. (voir : 3 – les modes de couleur)

« Sat. Moins » ; « Sat. Plus » : permet de faire varier la saturation sur toutes les couleurs calculées (pas la couleur de base) après transformation interne en HSL (HSV).

« Lum. Moins » ; « Lum. Plus » : de la même façon fait varier la luminosité des couleurs calculées.

« Classer par lum. » : Classe les couleurs entre elles de la plus lumineuse à la plus sombre, après transformation en mode HSL (HSV). (voir : 3- les modes de couleur)

La barre d’état donne des indications sur les composantes RVB des couleurs survolées avec le pointeur de la souris.

Lorsque le pointeur survole un bouton, une brève description de son utilisation apparaît.

Chacune permet de voir les couleurs à sa façon. Des indications de la valeur hexadécimale de la couleur sélectionnée ou survolée apparaissent au dessus des deux fenêtres de droite.

Lorsque le pointeur de la souris se trouve au dessus d’une couleur, un clic du bouton droit de la souris fait apparaître un menu contextuel permettent de copier dans le presse papier la valeur hexadécimale de cette couleur.

Le menu aide permet l’accès aux différents informations disponibles sur Eléa 2000.

Certains raccourcis clavier sont disponibles. Ils apparaissent dans les menus en face de la fonction disponible.

5.2 – Palette Pro

La roue des couleurs présente les différentes couleurs dans leur teinte à 100 %. C’est à partir d’ici que les harmonies peuvent se décomposer ou se composer. Les sections suivantes permettent de contrôler cette roue. Les couleurs primaires, secondaires ainsi que le noir et le blanc sont directement accessibles sur les bords.

Note : pour revenir du mode image aux autres modes, il suffit de cliquer sur un de ces modes.

Permet de changer la finesse de la roue, et par conséquent le nombre de couleurs. Le clic sur une définition lance le calcul de la roue. Ce calcul peut être long en fonction du processeur utilisé sur votre machine.

Permet de régler le niveau de saturation ou de luminosité de départ dans la roue des couleurs. N’est disponible qu’avec les palettes luminosité ou saturation.

Les outils sont avec la roue des couleurs pour rechercher la combinaison de couleur.

Diagonale :
A partir de la couleur pointée avec la souris (garder le bouton gauche enfoncé), trace le point diamétralement opposé.
Choix de 2 couleurs

Angle fixe :
A partir de la couleur pointée avec la souris (garder le bouton gauche enfoncé), trace le point correspondant à l’angle affiché.
Angle en degrés compris entre 0 et 360.
Choix de 2 couleurs

Triangle Isocèle :
A partir de la couleur pointée avec la souris (garder le bouton gauche enfoncé), trace les points correspondant à un triangle isocèle centré d’ouverture correspondante à l’angle.
Angle en degrés compris entre 1 et 179.
Choix de 3 couleurs

Triangle équilatéral :
A partir de la couleur pointée avec la souris (garder le bouton gauche enfoncé), trace les points correspondant à un triangle équilatéral centré
Choix de 3 couleurs

Carré rot. (carré rotatif) :
A partir de la couleur pointée avec la souris (garder le bouton gauche enfoncé), trace les points correspondant à un carré centré.
Choix de 4 couleurs

Carré dep. (carré déplaçable) :
A partir de la couleur pointée avec la souris (garder le bouton gauche enfoncé), trace les points correspondant à un carré non centré jusqu’à relâchement du bouton. Pendant le tracé un clic sur le bouton droit tout en maintenant le gauche enfoncé permet de déplacer le carré.
Choix de 4 couleurs

Losange :
A partir de la couleur pointée avec la souris (garder le bouton gauche enfoncé), trace les points correspondant à un losange centré.
Le pourcentage compris entre 1 et 100 % indique le taux de proportion entre les deux dimension du losange.
Choix de 4 couleurs

Rect. Dep. :
A partir de la couleur pointée avec la souris (garder le bouton gauche enfoncé), trace les points correspondant à un rectangle non centré jusqu’au relâchement du bouton. Pendant le tracé un clic sur le bouton droit tout en maintenant le gauche enfoncé permet de déplacer le rectangle.
Choix de 4 couleurs

Rectangle :
A partir de la couleur pointée avec la souris (garder le bouton gauche enfoncé), trace les points correspondant à un rectangle centré.
Le pourcentage compris entre 1 et 100 % indique le taux de proportion entre les deux dimension du rectangle.
Choix de 4 couleurs

Libre :
Permet de choisir librement une couleur.
Sélectionner la couleur à modifier (texte, fond, titre, cercle, boite) et cliquez sur une couleur dans la roue ou l’image visible dans la fenêtre.
Choix de 5 couleurs.

Un clic droit dans les cases des couleurs affiche un menu contextuel permettant de copier la valeur hexadécimale de la couleur dans le presse papier.

« OK » : valide le choix des couleurs et retourne celles-ci.
« Annule » : annule les choix…

5.3 – Contrast

Permet de choisir le nombre de couleurs à mettre en contraste. 2 ou 3 couleurs peuvent être utilisées.

Paramètres de réglage de la couleur à éditer.
Les sliders modifient les 3 composantes RVB. Quatre boutons permettent de modifier directement la lumière ou la saturation de la couleur.
La palette Windows est également accessible, ainsi que le mode aléatoire.

Deux fonctions aléatoires sont disponibles. Une fonction aléatoire agissant sur la couleur sélectionnée, dans la zone réglages. Une fonction aléatoire agissant globalement sur toutes les couleurs.

Un clic droit dans les cases des couleurs affiche un menu contextuel permettant de copier la valeur hexadécimale de la couleur dans le presse papier.

« OK » : valide le choix des couleurs et retournent celles-ci.
« Annule » : annule les choix…

5.4 – Composeur

La palette permet de mélanger une des trois composantes avec les deux autres. L’action sur le slider dose le mélange.
Un clic dans la fenêtre de visualisation permet de capturer la couleur pour la zone de travail sélectionnée. La palette Windows est toujours disponible.

Cette zone permet de déssaturer une couleur sélectionnée, vers le noir par le bas, et vers le blanc par la droite.

Sélection manuelle d’une couleur à déssaturer : les trois slider permettent la sélection manuelle d’une couleur grace à ses trois composantes. Les variations se réalisent en temps réel.

Sélection automatique de la couleur à déssaturer : lorsque la case « auto » est cochée, toute couleur sélectionnée ailleurs dans la fenêtre est automatiquement prise pour la déssaturation.

Jusqu’à 5 couleurs peuvent être éditées selon le nombre de couleurs choisies dans l’écran précédant.

Les couleurs :
Chaque couleur apparaît dans la fenêtre de visualisation de la composition à un endroit spécifique : sur le texte, le cercle, la boite, le titre ou le fond.

Chaque couleur a une propriété « visible » ou « modif » (pour modifiable).

Pour éditer une couleur, celle-ci doit être sélectionnée en cliquant sur son nom.

Texte :
Les boutons Noir et Blanc permettent d’affecter l’une des deux couleurs rapidement au texte.

Tous visibles :
Permet de rendre toutes les couleurs visibles en un seul clic.

Tous modifiables :
Permet de rendre toutes les couleurs modifiables en un seul clic.

Les même outils que pour l’harmoniseur sont disponibles par un clic sur leur bouton : Palette Pro, Contrast, Aléatoire, WebSafe.

Ces deux boutons permettent d’enregistrer le travail effectué, ou d’ouvrir un travail sauvegardé précédemment.

Les données sont sauvegardée sous le format Eléa2000 avec l’extension « .ele ».

La fenêtre qui s’ouvre, est une fenêtre standard Windows d’explorateur, vous permettant de nommer, renommer, créer des répertoires ou effacer des fichiers à l’aide des icônes et du clic droit de la souris.

Lorsqu’une couleur est sélectionnée, un clic dans l’une des palettes, ou sur une autre couleur permet de modifier sa couleur.

Un clic droit dans les cases des couleurs affiche un menu contextuel permettant de copier la valeur hexadécimale de la couleur dans le presse papier.

« OK » : valide le choix des couleurs et retourne celles-ci si leur propriété « modif » est sélectionnée, et si le nombre de couleurs de l’écran précédant est égal.

Le nombre de couleurs de l’écran précédant est affiché en haut à gauche de la zone de travail.

« Charte chromatique » : passe à l’écran suivant en prenant toutes les couleurs « visibles ».

5.5 – Charte chromatique

Les différentes couleurs utilisées peuvent être nommée ici, ainsi que le nom de la charte et sa référence.

Ces noms seront appliqués aux fichiers HTML résultant de l’exportation de la charte.

Trois modèles standard sont disponibles. Il s’agit des trois fichiers « std_3Coul.html, std_4Coul.html et std_5Coul.html » du répertoire « modeles ». Attention à ne pas les effacer. Vous pouvez utiliser ces fichiers comme base à la création de vos propres modèles.

Le choix « personnalisé… » permet d’utiliser le fichier de son choix. Voir « 5.5.5 – création d’un modèle personnalisé » pour créer votre propre modèle.

Ce bouton permet de choisir le fichier de sortie de la charte. Vous pouvez écraser un fichier existant ou en créer un nouveau. Le fichier créé doit obligatoirement avoir l’extension « .html » ou « .htm ».

Permet de lancer automatiquement le navigateur Internet par défaut afin de visualiser la dernière charte graphique crée.

Note : cette fonction ne fonctionne que si un navigateur est installé et est correctement configuré.

L’exportation de la charte graphique fonctionne sur un principe simple. Un fichier html ordinaire sert de base. Certaines zones de texte de ce fichier seront remplacées par la valeur correspondante. Ces zones sont des codes qui commencent et se terminent par un « % ». Les valeurs correspondantes au code seront remplacées automatiquement par l’exportateur d’Eléa2000.

Il suffit donc d’insérer le code correspondant dans votre fichier modèle, à l’endroit voulu. Ceci nécessite un minimum de connaissance du langage HTML, notamment en ce qui concerne le placement au bon endroit du code des couleurs.

Il est donc facile de remplacer par exemple le code de couleur du fond de la page par %hexa_fond%
Ex : <BODY bgcolor= #3366DD > devient <BODY bgcolor=%hexa_fond% >

6 – Contacter l’auteur

7 – Remerciements

L’auteur tient particulièrement à remercier :
Isabelle Guyot, conseil, soutien
Jean-Pierre Malandrino, bêta-testeur, conseil
Paul Vidonne (Kreatys), bêta-testeur, conseil
Franck Saladini, bêta-testeur

8 – Configuration Matérielle

Configuration minimum :
PC – Pentium 100 Mhz
16 Mo de mémoire vive
Carte graphique 16 bits
Résolution écran de 800x600 pixels
Souris
Windows 95/98/NT4.0/2000
Navigateur Internet version 4

Configuration conseillée :
PC – Pentium II 300 Mhz
32 Mo de mémoire vive
Carte graphique 24 bits
Résolution écran de 1024x760 pixels
Souris
Windows 95/98/NT4.0/2000
Navigateur Internet version 4 ou plus

9 - En savoir plus sur les couleurs (bibliographie)

Bibliographie :
Johannes Itten, Art de la couleur, ed. Dessain&Tolra
Robert Chalavoux, Outil des couleurs, Chalagram Editiond et Editions DésIris

Table des matières

1 - Introduction – la philosophie d’Eléa 2000

2 - Pourquoi ? Pour qui ?

3 – Les modes de couleur

4 - Les outils : principes

5 – Détail des outils

5.1 – Harmoniseur

5.2 – Palette Pro

5.3 – Contrast

5.4 – Composeur

5.5 – Charte chromatique

6 – Contacter l’auteur

7 – Remerciements

8 – Configuration Matérielle

9 - En savoir plus sur les couleurs (bibliographie)