Artwork Guidelines/fr

Introduction
Pour toutes les icônes de l'arborescence source, voir Graphisme.

Une icône FreeCAD est composée de 6 éléments qui peuvent être mémorisés facilement en utilisant l'acronyme "SALCHO": Stroke, Alignment, Lhighting, Color, Hhighlighting, Outline

Voici un exemple concret mais arbitraire:



Les sections suivantes expliquent ces éléments avec plus de détails.

Cette icône s'affiche comme suit:

Couleurs
FreeCAD utilise une palette adaptée de la palette Tango. Chaque couleur principale est disponible en 4 tons: Highlight, Base, Dark et Outline. Notez que le contour n'est pas complètement noir mais une variation très sombre de la base.



Voir FreeCAD palette pour la gamme complète. Une sélection de quelques couleurs clés.

Grille et Largeur du trait
[Obligatoirement] Les icônes FreeCAD ont une taille nominale de 64px * 64px (bien que j'aime laisser une marge de 2px tout autour pour éviter que des choses géniales d'antialiasing ne se produisent sur le bord de l'image). Lorsque vous créez ou éditez un icône, assurez-vous que la taille de votre image est de 64 x 64, les unités étant px. Cela vous donne 60px * 60px d'espace utilisable.



Il est également fortement recommandé d'appliquer au moins une grille au document comportant une ligne de quadrillage à chaque pixel et une ligne de grille majeure tous les 2 pixels. N'hésitez pas à ajouter d'autres grilles pour vous aider, mais vous devriez en avoir au moins une. Vous êtes alors aligné sur les intersections mineures de la grille. (Voir image)

Les largeurs des traits ne doivent pas être plus minces que 2px, avec les têtes de lignes arrondies et les coins dans la plupart des cas. Les traits peuvent être plus épais, mais utilisez un multiple de deux pour minimiser le flou de la mise à l'échelle.



Contour
[Obligatoirement] En vous basant sur la couleur principale de l'icône, assurez-vous qu'il y a un contour sombre (de 2 pixels comme mentionné précédemment). Cela fonctionne en harmonie avec la mise en évidence pour assurer un bon contraste de forme sur plusieurs tons de fond.



Surligner
[Fortement conseillé] En utilisant la couleur de surbrillance, ajoutez un trait interne (encore une fois, 2px) pour vous aider à créer ce contour. Sur les fonds sombres, c'est ce point culminant qui fournira le formulaire à l'icône.



Éclairage
[Optionnel] Selon les directives de Tango, si vous ajoutez un effet d'éclairage dégradé, essayez de faire en sorte que la lumière vienne du haut à gauche. Cela se fait en ajoutant la couleur de surbrillance en haut à gauche et la couleur de base ou sombre en bas à droite (notez que je n'ai pas joué en essayant d'utiliser une couleur autre que celle de la palette)



Remarques de clôture
C’est tout - il s’agit de s’assurer qu’il existe un aspect unifié pour tous les icônes. Rappelez-vous: SALCHO AVC, alignement, éclairage, couleur, mise en évidence, contour

Voici une collection de conseils pour pouvoir vérifier votre travail:

Vérification de la taille
Inkscape dispose d'un outil très pratique pour vérifier votre icône à différentes tailles. Allez dans "Affichage → Aperçu de l'icône ..." et vous verrez les aperçus de votre icône redimensionnés à 16, 24, 32 et 64 pixels!

Vérification de votre contour
1. Placez votre icône sur un grand rectangle de la même couleur que la couleur la plus sombre de votre icône.



Vérification de votre contraste

 * 1) Exportez votre icône SVG vers un format bitmap, comme  ou.
 * 2) Chargez votre bitmap dans un programme d'image et changez-le en niveaux de gris. Par exemple, dans GIMP, vous iriez dans.
 * 3) Inkscape vous permet de convertir le SVG directement en niveaux de gris en utilisant.
 * 4) Pouvez-vous toujours clairement distinguer les détails internes ? Génial. Le contraste est bon.

A grayscale image allows you to more easily identify problems in contrast, as only a mix of black and white is present. Testing grayscale images is also good for colorblind users. If they can see the details in a grayscale image, then the contrast of the fully colored image is probably good as well.