Inkscape: Impress Slides

Inkscape for Daily Life.

Local Group

Preface

Adding content illustration to impress slide using inkscape.

The hardest part of making presentation after master slides is the content illustration. Here is my content illustration attempt that you can use for your daily presentation. You can also share your content illustration to be used by other people.

My mission is clear. This template should be usable enough to be used by Impress user. But unfortunately to modify this, require Inkscape knowledge. This is why we need pretty diagram, with infographics style.

All will be no good if you do not have good material to be presented.

Article Series

This is a six parts article series.

Part One: Auto, the simple template
Part Two: Candyclone, the modern classic template
Part Three: Adding custom bullets decoration
Part Four: Adding content illustration
Part Five: Creating illustration diagram
Part Six: Adding genuine artwork

Thumbs 3 Preview

Preparation

The Requirement

I had been in a contest of Impress template in Indonesia for a while, and get the fifth nominee of the best six template. One of the requirement is the content. So after master slides and bullets, content is the things to do.

The contest itself is a cooperation, between LibreOffice Indonesia, and Gimpscape. Gimpscape is a local community in Indonesia, mostly discussing design using libre graphics, not limited by Inkscape and The Gimp. This is my chance to use Inkscape, and I choose to make diagram like shape, as an illustration for my Impress content.

Source

Source image is provided here below:

github.com/…/template-candyclone-content.svg.zip

Layers

After a few moment, I found it easy to do it with inkscape. In fact I cannot stop making illustration. Finally I make fifteen illustration, with two additional rejected illustration that, I even refuse to use.

You can see all layers here:

Content Illustration: Inkscape: All Layers

Base Layer

To simulate master slide, we need to prepare background layer. I use three colors: red, green, and blue. And one fake title is also required, for positioning reason.

Content Illustration: Inkscape: Base Layer

With source image preview as below:

Content Illustration: Inkscape: Master Slide

The Process

I am going to explain step by step using one case. The same process applied to all other case as well.

Inkscape: Main Artefacts

Generally I use source layer, before cut them into useful shape. I use whatever color, and set the aesthetic part later.

Content Illustration: Inkscape: Source Layer

Then cut it in separate layer. And also set the material color. Notice that I use more icon positionings than required.

Content Illustration: Inkscape: Cut Layer

It takes some iteration to find the right color. Especially the shadow below, until I found that I only need to darkened them. For example, if I use blue300, then I could use the shadow color with blue400 or blue500.

Inkscape: Prepare Import File

To be able to insert from Inkscape with Impress menu, we need to delete all other unused ayers. So save the inkscape file as different SVG file artefact.

Content Illustration: Inkscape: Import Source

Notice that there is only one layer, although multi layer is fine. My intention to use only one layer is simplicity.

Impress: Insert Image

After preparing my candy clone template with all master slides, I can make a new slide, and insert SVG image.

Content Illustration: Impress: Insert Image

Make sure that the position start zero point.

Content Illustration: Impress: Position and Size

Impress: Break and Adjust

Break the Image, and remove unecessary icons. Now you can have the slide preview as below:

Content Illustration: Impress: Fresh Image

You do not need to break the image in Impress. You can prepare all in Inkscape Instead.

Without breaking, you cannot adjust position of object in Impress. But who wants to adjust position in Impress anyway, while we can do it all in Inkscape.

Impress: Adding Text

With method above, all we need to do in Impress is only adding text.

Content Illustration: Impress: Final Image

Repeat The Process

Now you can do the same process, for all other diagram illustration. Just remember that the creative process in Inkscape part, might be different for each diagram. One maybe simpler, and the other one might be complex, as shown in example below:

Content Illustration: Inkscape: Example Complex Layers

With color from material design palette, it is easy to switch the color, to suit your needs. The guidance lines in above figure shown blue material color, because originally the shapes are blue, before I turn them to the red counterparts.

Coloring Example

For easy color switching, you might want to utilize material pallete color only.

Candyclone Template: Inkscape: Material Design Pallete

Custom Icons

I’m not a lawyer. I avoid mixing licenses.

Of course I can use any free icon such as FontAwesome or Google Icons. But I decided to use my own custom made icon that I have made in 2017.

Content Illustration: Inkscape: Custom Nano Icons

I call this nano icon. My intention is to make something like atom bonding, and I failed miserably. Until I finally find it useful for this diagram in 2020.