Difference between revisions of "Krita/Brushes Preset Preview"

Jump to: navigation, search
(Emblem / Icon)
(Emblem / Icon)
 
(32 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 
This document aim to provide '''standards''' propositions to unify the default brush preset icons of Krita , and ease the work of preset maintainers.  
 
This document aim to provide '''standards''' propositions to unify the default brush preset icons of Krita , and ease the work of preset maintainers.  
 +
It also provide templates to ease creation and a tutorial for new brush creator.
 +
 +
== Tutorial ==
 +
 +
Small step if you want to standardize your preset icons
 +
 +
# Clean resources in Krita (''Edit > Resources > Clean Up removed files'') then go to ''~/.kde/share/apps/krita/paintoppresets''
 +
# Open the <nowiki>*.kpp</nowiki> files you want to edit with Krita
 +
# Drag and drop from this wiki page backgrounds or templates you want ( or use 'copy image' and 'Paste' )
 +
# Draw over additional info : as painting the Stroke according to the color code, and Picto/text
 +
# Save file ( keep *.kpp extension )  ; at relaunch Krita should show your new icon customized
  
 
== Default background ==  
 
== Default background ==  
  
 
The default background is a neutral grey gradient, of 200px X 200px, without borders or decoractions
 
The default background is a neutral grey gradient, of 200px X 200px, without borders or decoractions
 +
 +
''( Note : this picture is ready to drag & drop over Krita, or 'copy image' and 'paste'  )''
  
 
[[Image:Krita-preset-preview-default-background.png|center]]
 
[[Image:Krita-preset-preview-default-background.png|center]]
Line 11: Line 24:
 
A preview icon is composed of 3 main blocks :
 
A preview icon is composed of 3 main blocks :
  
[[Image:block-disposition.jpg|center]]
+
[[Image:Areas Template.png|center]]
  
 
* Text/Picto area : a zone to write or use little picture  
 
* Text/Picto area : a zone to write or use little picture  
 
* Stroke area : a preview of the brush stroke itself  
 
* Stroke area : a preview of the brush stroke itself  
* Emblem/Icon : a visual to ease memorization of the brush  
+
* Emblem/Icon : a visual to ease memorization of the brush
  
 
== Stroke ==
 
== Stroke ==
Line 21: Line 34:
 
The brush preview feature a mini representation of the stroke.  This stroke is colored with those color codes :
 
The brush preview feature a mini representation of the stroke.  This stroke is colored with those color codes :
  
 +
[[Image:Krita-preset-preview-strokes.png|700px|center]]
  
* '''Black''' is "normal"  
+
'''Black''' (#000000) or '''Dark grey''' or '''grey''' --> "normal"  
* '''White''' is "erase" ''( note : Checker pattern representing alpha too )''
+
'''White''' (#FFFFFF) or '''Checker''' --> "erase"
* '''Dark blue''' is color-smudge smearing mode ''( note : little gradient in the stroke to a warmer color can helps )''
+
# '''Dark blue''' (#3F54C2) --> "color-smudge smearing mode"
* '''Purple''' is color-smudge dulling mode ''( note : little gradient in the stroke to a warmer color can helps )''
+
# '''Purple''' (#8D5FB9) --> "color-smudge dulling mode"
* '''light-blue''' for smudge-only
+
# '''Green''' (#6F9E45) --> "strokes with heavy textures"
* ... FX presets can use distinct colors according to the fx-related resulting color
+
# '''light-blue''' (#A7D1F7) --> "Smudging/Duling presets only"
 +
# '''Rainbows''' (  :-)  ) --> "presets with blending modes color"
 +
# '''Dark red / crimson''' (#8F392D) --> "presets with blending modes to darken ( burn/multiply/dark ) "
 +
# '''Pale light yellow''' (#E6E2B7) --> "presets with blending modes to enlight ( dodge/screen/addition/lighten ) "
 +
# ''{placeholder}''
 +
# ''{placeholder}''
 +
# ''{placeholder}''
  
 +
''Note 1 : The stroke can be exaggerated to boost the particular aspect of a brush.''
  
''Note : The stroke can be exaggerated to boost the particular aspect of a brush.
+
''Note 2 : Colors don't have to be super precise ; the Hex colors ID is provided but feel free to do variation to make your own brush kit looks good.''
''
 
  
 
== Emblem / Icon ==
 
== Emblem / Icon ==
  
An icons/emblems pasted on the "brush preset preview" ease the selection for user with a visual memory. It also make the UI more user friendly
+
An icons/emblems pasted on the "brush preset preview" ease the selection for user with a visual memory. It also make the UI more user friendly.
  
 
Icons can be vector, or 2D painted representation of tools or object.  
 
Icons can be vector, or 2D painted representation of tools or object.  
  
To ease brush preset creation here is a pack of picture ready to customize with your stroke under :
+
To ease brush preset creation here is a pack of picture ready to customize ''( Note : thoses pictures are ready to drag & drop over Krita, or 'copy image' and 'paste'  )''
  
[[Image:Preset-background-template_stylus.png]] [[Image:Preset-background-template_marker.png]] [[Image:Preset-background-template_bistle.png]] [[Image:Preset-background-template_thin-brush.png]] [[Image:Preset-background-template_knife.png]] [[Image:Preset-background-template_pencil.png]] [[Image:Preset-background-template_pastel.png]] [[Image:Preset-background-template_brush-marker.png]] [[Image:Preset-background-template_thin-marker.png]] [[Image:Preset-background-template_thin-liner.png]] [[Image:Preset-background-template_eraser.png]] [[Image:Preset-background-template_airbrush.png]] [[Image:Preset-background-template_clone.png]] [[Image:Preset-background-template_kneaded-eraser.png]] [[Image:Preset-background-template_experimental-alchemy.png]] [[Image:Preset-background-template_frottis.png]] [[Image:Preset-background-template_smudging.png]] [[Image:Preset-background-template_blender.png]] [[Image:Preset-background-template_brush-teeth-splatter.png]] [[Image:Preset-background-template_sponge-texture.png]] [[Image:Preset-background-template_conte.png]]
+
=== 2D painted Emblem / Icon samples ===
 +
<gallery widths=200px heights=200px caption="200x200px Templates ready to drag & drop over Krita ">
 +
File:Preset-background-template_airbrush.png
 +
File:Preset-background-template_clone.png
 +
File:Preset-background-template_kneaded-eraser.png
 +
File:Preset-background-template_experimental-alchemy.png
 +
File:Preset-background-template_frottis.png
 +
File:Preset-background-template_smudging.png
 +
File:Preset-background-template_brush-teeth-splatter.png
 +
File:Preset-background-template_sponge-texture.png
 +
File:Preset-background-template_conte.png
 +
</gallery>
 +
=== Vector Emblem / Icon samples ===
 +
<gallery widths=200px heights=200px caption="200x200px Templates ready to drag & drop over Krita ">
 +
 
 +
File:Preset-background-template_Stylus.png
 +
File:Preset-background-template_Pencil01.png
 +
File:Preset-background-template_Pencil02.png  
 +
 
 +
File:Preset-background-template_MechPencil.png  
 +
File:Preset-background-template_Eraser01.png  
 +
File:Preset-background-template_Eraser02.png  
 +
 
 +
File:Preset-background-template_Charcoal01.png
 +
File:Preset-background-template_Charcoal03.png  
 +
File:Preset-background-template_Charcoal02.png
 +
 
 +
File:Preset-background-template_CharcoalPencil.png
 +
File:Preset-background-template_WhitePastel.png   
 +
File:Preset-background-template_TranspPen.png
 +
 
 +
File:Preset-background-template_Knife.png
 +
File:Preset-background-template_Brush01.png  
 +
File:Preset-background-template_Brush02.png  
 +
 
 +
File:Preset-background-template_Pastel.png
 +
File:Preset-background-template_Spray.png  
 +
File:Preset-background-template_Cutter.png
 +
 
 +
File:Preset-background-template_GelPen.png
 +
File:Preset-background-template_BoldInk.png  
 +
File:Preset-background-template_InkBrush.png
 +
 
 +
File:Preset-background-template_FineMarker.png
 +
File:Preset-background-template_Marker.png
 +
File:Preset-background-template_FlatBoldMarker.png
 +
 
 +
File:Preset-background-template_RedPen.png
 +
File:Preset-background-template_Flat_Marker.png
 +
File:Preset-background-template_BoldInk02.png
 +
 
 +
</gallery>
 +
 
 +
Feel free to add more variations to this list as *.png 200x200px
  
 
== text / Picto ==
 
== text / Picto ==
 +
 +
[[Image:Krita-brush-preset-text-picto-illustration.jpg|center]]
  
 
A little '''optionnal''' text or logo that can be added on the top left corner. It might be related to the size, effect, or other factor
 
A little '''optionnal''' text or logo that can be added on the top left corner. It might be related to the size, effect, or other factor
 
The text can be written in any colors , but neutral are adviced ( white / grey / black ).  
 
The text can be written in any colors , but neutral are adviced ( white / grey / black ).  
 +
 +
''examples :''
 +
[[Image:Pictos-samples.png |center]]
  
 
* Icon of a drop = the preset feels wet
 
* Icon of a drop = the preset feels wet
Line 53: Line 131:
 
* Icon of a star = the preset does Fx
 
* Icon of a star = the preset does Fx
 
* Icon of a warning = the preset is still experimental
 
* Icon of a warning = the preset is still experimental
 +
 +
== Naming ==
 +
 +
Brush names should be kept simple and not use a particular prefix to workaround the lake of sorting on Krita.
 +
 +
* Simple words, composed of 3 words maximum
 +
* <nowiki>*.kpp</nowiki> filenames similar to preset name
 +
 +
[[Image:Preset-Krita-naming.jpg|500px|center]]
  
 
== License ==  
 
== License ==  
  
 
As for any painting ressources,  '''CC-Zero''' or '''Public Domain''' is adviced to let freedom of use to the end-users.  You can't really ask a user to attribute your name each time one of your brush kit appears on a screenshot or is used into an artwork.
 
As for any painting ressources,  '''CC-Zero''' or '''Public Domain''' is adviced to let freedom of use to the end-users.  You can't really ask a user to attribute your name each time one of your brush kit appears on a screenshot or is used into an artwork.

Latest revision as of 21:42, 22 July 2013

This document aim to provide standards propositions to unify the default brush preset icons of Krita , and ease the work of preset maintainers. It also provide templates to ease creation and a tutorial for new brush creator.

Tutorial

Small step if you want to standardize your preset icons

  1. Clean resources in Krita (Edit > Resources > Clean Up removed files) then go to ~/.kde/share/apps/krita/paintoppresets
  2. Open the *.kpp files you want to edit with Krita
  3. Drag and drop from this wiki page backgrounds or templates you want ( or use 'copy image' and 'Paste' )
  4. Draw over additional info : as painting the Stroke according to the color code, and Picto/text
  5. Save file ( keep *.kpp extension )  ; at relaunch Krita should show your new icon customized

Default background

The default background is a neutral grey gradient, of 200px X 200px, without borders or decoractions

( Note : this picture is ready to drag & drop over Krita, or 'copy image' and 'paste' )

Krita-preset-preview-default-background.png

Placement

A preview icon is composed of 3 main blocks :

Areas Template.png
  • Text/Picto area : a zone to write or use little picture
  • Stroke area : a preview of the brush stroke itself
  • Emblem/Icon : a visual to ease memorization of the brush

Stroke

The brush preview feature a mini representation of the stroke. This stroke is colored with those color codes :

Krita-preset-preview-strokes.png
  1. Black (#000000) or Dark grey or grey --> "normal"
  2. White (#FFFFFF) or Checker --> "erase"
  3. Dark blue (#3F54C2) --> "color-smudge smearing mode"
  4. Purple (#8D5FB9) --> "color-smudge dulling mode"
  5. Green (#6F9E45) --> "strokes with heavy textures"
  6. light-blue (#A7D1F7) --> "Smudging/Duling presets only"
  7. Rainbows (  :-) ) --> "presets with blending modes color"
  8. Dark red / crimson (#8F392D) --> "presets with blending modes to darken ( burn/multiply/dark ) "
  9. Pale light yellow (#E6E2B7) --> "presets with blending modes to enlight ( dodge/screen/addition/lighten ) "
  10. {placeholder}
  11. {placeholder}
  12. {placeholder}

Note 1 : The stroke can be exaggerated to boost the particular aspect of a brush.

Note 2 : Colors don't have to be super precise ; the Hex colors ID is provided but feel free to do variation to make your own brush kit looks good.

Emblem / Icon

An icons/emblems pasted on the "brush preset preview" ease the selection for user with a visual memory. It also make the UI more user friendly.

Icons can be vector, or 2D painted representation of tools or object.

To ease brush preset creation here is a pack of picture ready to customize ( Note : thoses pictures are ready to drag & drop over Krita, or 'copy image' and 'paste' )

2D painted Emblem / Icon samples

Vector Emblem / Icon samples

Feel free to add more variations to this list as *.png 200x200px

text / Picto

Krita-brush-preset-text-picto-illustration.jpg

A little optionnal text or logo that can be added on the top left corner. It might be related to the size, effect, or other factor The text can be written in any colors , but neutral are adviced ( white / grey / black ).

examples :

Pictos-samples.png
  • Icon of a drop = the preset feels wet
  • 'HB' ( text ) = the preset feels like a pencil 'HB'
  • '0.1' (numeral) = the size of the preset is thin
  • Icon of a star = the preset does Fx
  • Icon of a warning = the preset is still experimental

Naming

Brush names should be kept simple and not use a particular prefix to workaround the lake of sorting on Krita.

  • Simple words, composed of 3 words maximum
  • *.kpp filenames similar to preset name
Preset-Krita-naming.jpg

License

As for any painting ressources, CC-Zero or Public Domain is adviced to let freedom of use to the end-users. You can't really ask a user to attribute your name each time one of your brush kit appears on a screenshot or is used into an artwork.


This page was last edited on 22 July 2013, at 21:42. Content is available under Creative Commons License SA 4.0 unless otherwise noted.