[EN] Inkscape: workflow optimization recipes

Prep

It’s a good practice to collect reference images or a specific color palette beforehand. If you have a sketch image place it on the lower layer while making the upper one (for the outline) transparent & with blending mode.

Hotkeys

Time saving hint - learn shortcuts. You don’t need to know them all, but it's good to learn some for commonly used tools and actions. Part of my list:

Shift+Ctrl+A Align and Distribute Dialog

Shift+Ctrl+L Layers Dialog

Shift+Ctrl+F Fill and Stroke Dialog

+ zoom in, - zoom out

Color Picker + Shift+click set stroke color on selection

Ctrl+D duplicate selection

Ctrl+G group selected objects

Shift+Ctrl+G ungroup selected group(s)

Status Bar

Informative dynamic message bar, that displays tooltips, warnings, errors, and other notifications. After selecting everything on the canvas (Ctrl+A), status bar will show the number and the type of selected objects (even the hidden ones).

Default template

Black and white colors are very contrast and affect our perception. With white canvas all dark ones will seem darker, and vice versa with the black canvas. As a result, you might not be happy with your artwork ended up too faded or too bright. Especially if you are a beginner or still bad at choosing colors.

 

The most neutral color for canvas is 50% of gray (#808080) and you can easily set it in Document Properties (Ctrl+Shift+D). By making it transparent it will be ignored when exporting.

 

To optimize this setting, you can change the template that the program opens by default after launching. It is located Inkscape\share\templates\default.svg

Interpolate

The key to good colors in your artwork is to use a ready-made color palette. Trendypalettes, colorfulgradients or colourlovers can help you with that. Or you can create a color palette by your own, using Interpolate Extension. Just create two objects and fill them with two key colors, than select both and apply the extension (Extensions\Generate from Path\Interpolate).  As a result, you get a smooth transition from one color to another. These can be used to add volume to an object, character or a background.

Note that both objects must be paths, not shapes. 

View

If you constantly zoom in & out like I do, you’ll find these two Inkscape features quite useful.

 

View > Icon Preview

Want to know how your element looks in the smallest sizes like 16x16px or 48x48px (is it a tile, sprite or ui element)? Then this is just for you! 

​Note: if you check the Selection option, it will preview the selected object or group of objects. Otherwise it displays on preview (magnified) everything located on the canvas.

View  > Duplicate Window

This feature not only shows your working area in a separate window, it also can be very helpful if you need to handle Inkscape freezing. If your artwork have many filters applied (blurs or color filters), you can set View > Display Mode > No Filters to the window you are working on, and see the results in a duplicated window. This is something I use all the time, since I have a heart for a glowing effects in my personal works recently.

View  > Display Mode > Outline

 

Use it to see structure of your drawing, masked or clipped objects, objects with texture, or to select hidden underneath paths.   

Use Ctrl+5 to toggle between 3 Display Modes.

View  > Color Display Mode > Grayscale

good to check the tone of the drawing

Batch Export

If you need to get a pack of png-files, you can use Batch Export in Export dialogue (Shift+Ctrl+E). Make sure to set dpi (the only way to manage size for all objects at a time) beforehand.

Axonometric projection

There are several ways to help you create graphics in axonometric projection (used in games, infographics and various designs). The first one is a customizable grid (Document properties\Grids Tab\Create Axonometric Grid). Enable snapping to grids to accelerate yor workflow.

The second way is for more complex objects (circles, ellipses, custom text). They can be shifted to axonometric projection using Transform Tool (Shift+Ctrl +M) with scale and rotation tabs.

Right Plane

Scale Height: 86,6%

Skew Horizontal: 30˚

Rotate  (in clockwise direction): 30˚

Left Plane

Scale Height: 86,6%

Skew Horizontal: −30˚

Rotate  (in clockwise direction): −30˚

Top Plane

Scale Height: 86,6%

Skew Horizontal: 30˚

Rotate  (in clockwise direction) −30˚

Pixel Art Style

In latest Inkscape versions you can make your vector graphics look like pixel art using a special filter (Filters > Pixel tools> Pixelize)

Note that you can see the difference only after exporting PNG image with low size or dpi.

More about colors

Use blend modes (Objects Dialog) to find color shades: Screen for highlights, Multiply for shading. Don’t forget to play around with opacity and initial color of the upper object.

Use Ctrl+C & Ctrl+V to copy color value and fill selected object with it (much faster than using Fill & Stroke dialog).

Filters > Color > Color Shift - great tool for quick color shift of your object with a live preview.  

Clipboard + Pencil or Pen = Custom Brush

Brush Shape in the clipboard (must be path) + Pencil / Pen tool + From clipboard Mode = drawing using the original shape. The result will have black fill, a path with points to bend and a handle to change width (i. e. Pattern Along Path Effect (Path>Path Effects) use dialog box to play around with pattern settings). 

 

Brush Object in the clipboard (must consist of paths) + Pencil / Pen tool + Bend from clipboard Mode = drawing using the original object. The result will have initial fill (with all paths and colors included), a path with points to bend and a handle to change width (i. e. Bend Path Effect). 

Note this mode is sensitive to the direction of the original object. Use Node Tool (F2) to alter the width.

Good practice: to convert Objects to Path (Ctrl+Shift+C) afterwards, to prevent incorrect effect operation (object may disappear or appear very deformed on the other part of the canvas).

 

Useful for creating paths with interesting shapes or creating many bended variations of the same object (e. g. leaves or grass).

Inkscape Freezing

Still on the subject of freezing - hide heavy objects through Layers or Objects dialog box. If you need them for further work (i.e. you can’t hide background, because you need to build other elements on its colors), add them as an exported PNGs.

The End.
Thank you for attention!