Apply a fill to a logo

[Thommynat0r]

Hi all,

I am a new Affinity Design user. I try to recreate a logo with vectors for a website (no pixel - I want to export as SVG). I have managed to draw all strokes and it worked pretty well. Now I try to fill the single shapes with different linear gradient fills. 

Something like this is the goal for the blue gradient fills:

At the moment I have this (I know the areas have no closed curves, but some areas sharing a single curve):

How can I create single areas to apply the gradient fills?

 

Thank you,

Thomas

share R.afdesign

Edited July 5, 2021 by Thommynat0r

[Old Bruce]

You are going to have to do a lot of duplicating of the existing curves. So first you should separate the curves. Then duplicate the shapes so you can build enclosing curves.

Fair amount of work but it was a fun challenge.

R bruce.afdesign

I put in one named Global colour in a Document Palette. You should make more for the colours in all the gradient/solid fills and the stroke(s) so you'll be able to quickly change update the colours in the Swatches panel.

[PixelPest]

What I love about transparencies:

[Thommynat0r]

Hello again

thank you for your input. I have tried to do the same (duplicating the lines, merging to a closed curve). But when I apply the Fill tool, it doesn't fill the inside. There are two red dots. What I am doing wrong?:

Thank you,

Thomas

 

/Edit:

I got it, I need to use the tool "join curves" after selecting the merged curves. 🙂 

Dynamo für Revit Vector remake v2.afdesign

Edited July 6, 2021 by Thommynat0r

[PixelPest]

Take node-tool - drag around the corner nodes and call for "Join Curves":

[Thommynat0r]

How can I use the black shape to make the same area of another shape transparent like @Old Bruce did in his example? 

 

 

Dynamo für Revit Vector remake v3.afdesign

[Old Bruce]

There is some duplication of strokes that needs to be done and then there is the bottom one that needs to be shortened as well as duplicated. I have marked the curves which need to duplicated. I think that some of the curves will need to be reversed before the joining can take place.

Check the file I uploaded earlier to see a finished version.

 

[Old Bruce]

2 minutes ago, Thommynat0r said:

How can I use the black shape to make the same area of another shape transparent like @Old Bruce did in his example? 

 

I used the blend mode Erase some times and other times I used the Geometry > Subtract.

[Thommynat0r]

I think it looks already pretty good:

Do know a good method to add a bit of light on the top and on the side:

I have tried to add a second fill to that 2 shapes, but it changed the whole color and not only the edge

Dynamo für Revit Vector remake v4.afdesign

[Thommynat0r]

My result with Gimp:

And my final result with Affinity Designer 🤩 Any suggestions for improvement is welcome 

[Alfred]

On 7/6/2021 at 6:08 PM, Thommynat0r said:

I have tried to add a second fill [to add a bit of light on the top and on the side]

Instead of trying to add another fill to the existing shape, add a separate shape! A white shape with gradient transparency will produce a highlight effect on the underlying object (and a black shape with gradient transparency would produce a shadow effect).

[Old Bruce]

One thing I would suggest is to make a Designer document with a series of artboards, one for each of the logos.  Make them all big size vector objects and then you can cut and paste into a new document and size them.