Artwork Guidelines/fr

Remarque: pour des exemples d’icônes, voir le artwork collection page.

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

Voici un exemple concret mais arbitraire:

Les sections suivantes expliquent ces éléments de manière plus structurée.

Couleurs
[Obligatory] FreeCAD utilise une palette adaptée de la palette Tango. Chaque couleur principale est disponible en 4 tons: Highlight, Base, Dark et Outline.

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.

Highlight
[Strongly Advised] Using the Highlight color, add an internal stroke (again, 2px) to help make that outline pop. On dark backgrounds, it's this highlight that will be providing the form to the icon.

Lighting
[Optional] As per Tango guidelines, if you're adding a gradient lighting effect, try to make it look like the light is coming from the top left. This is done by adding the highlight color up top left and the Base or Dark color bottom right (notice that I haven't played around trying to use a non-palette color)

Closing Remarks
That's it - that's all there is to making sure that there's a unified look to all the icons. Remember: SALCHO Stroke, Alignment, Lighting, Color, Highlight, Outline

Here's a collection of tips to be able to check your work:

Checking Size
Inkscape has a super handy tool to check your icon at various sizes. Go to "View > Icon Preview..." and it'll show you previews of your icon resized to 16,24,32 and 64px!

Checking Your Outline
1. Put your icon on a big rectangle that is the same color as the darkest color in your icon.

2. Still looks OK? Great! Go to step 3. If not, see the frowny face

3. Do the same but this time using the lightest color.

4. Still looks OK? Great! Outlines and highlights have been used appropriately!

Checking Your Contrast
1. Get your icon and export it to either .png or .jpg, whichever you prefer

2. Open an image program and change it to grayscale. In GIMP for example you would go to "Image > Mode > Grayscale" (This is excellent for testing for color blind users)

3. Can you still clearly make out any internal details? Great! You have good contrast!