Jump to content
You must now use your email address to sign in [click for more info] ×

Drawing beneath an overlay layer (explained below)


Recommended Posts

Apologies for a basic question. I'm getting used to the tools and drawing concepts, and layering/masking still vexes me sometimes. I'm trying the concept below and seem to be doing something dumb, but I can't get it to work.

This is what I'd like to do:

Let us say I want two layers, T (top) and B (Bottom).

T is a grid with nice thick borders. Imagine a 3 x 3 grid, where the inner rectangles are like windows and the borders are white.

B would be a blank transparent layer on which I want to draw stuff.

What I want is the T is on top of B, providing a grid overlay (like in comic book pages)

And when I select B, and draw, whenever my drawing goes beyond the border of the window, I don't want it to show (as if the white border is on top).

The other way to think about it is I have a white paper with 9 rectangular holes cut into it, and I place it on another paper, and I draw on the paper below.

How do I set this up? 

Thank you!

 

Link to comment
Share on other sites

Which app, ADe?

All in all I think there would be several different ways possible to get something like that.

  1. In ADe you could setup 3x3 transparent background Artboards with locked/on/off toggable white border layers on top of each. For drawing on one of them (an Artboard) hide it's top border layer and draw on the Artboard, when finished toggle the border again on.
  2. In ADe/APh place/embedd 3x3 = 9 rectangular transparent docs (areas) into a doc. For drawing expand the embedded transparent embedded one you want to draw on and draw on it. The white borders could be a toggable border in the main document here, which also contains the 9 embedded transparent subdocs.
  3. In APh you can also make something similar to (2.), but instead of embedded docs then with just sized transparent pixel layer parts then and masking out the rest of the whole doc area.

☛ Affinity Designer 1.10.8 ◆ Affinity Photo 1.10.8 ◆ Affinity Publisher 1.10.8 ◆ OSX El Capitan
☛ Affinity V2.3 apps ◆ MacOS Sonoma 14.2 ◆ iPad OS 17.2

Link to comment
Share on other sites

If you want to do this with Designer, I would create the grid first on the top layer or as a group on top. Because every single stroke/shape/curve you draw will create a new layer, I would create a group for the drawings and draw everything inside this group. Place this group below the layer/group with the grid.

In Photo, simply create two layers. Add your grid to the top layer. Then click on the bottom layer and draw/paint on that layer.

Link to comment
Share on other sites

8 minutes ago, cluelessn00b said:

Let us say I want two layers, T (top) and B (Bottom).

How do I set this up? 

Why not just setting up like this? – Or are asking how to create layer T in particular? If yes: create a large rectangle for the page size and smaller ones for the 'windows'. Then combine the 'windows' via Geometry > Add (hold Option/Alt to get the compound) and create with the result and the large rectangle a second compound but now with Subtract instead of Add.

100790366_compoundgrid2layers.jpg.7c644265e2bf3d89a16f1527f6507856.jpg

macOS 10.14.6 | MacBookPro Retina 15" | Eizo 27" | Affinity V1

Link to comment
Share on other sites

12 minutes ago, thomaso said:

Why not just setting ...

The more challenging and important point here is IMO ...

-> And when I select B, and draw, whenever my drawing goes beyond the border of the window, I don't want it to show (as if the white border is on top).

... for each of those 9 areas then (AFAI understood it).

☛ Affinity Designer 1.10.8 ◆ Affinity Photo 1.10.8 ◆ Affinity Publisher 1.10.8 ◆ OSX El Capitan
☛ Affinity V2.3 apps ◆ MacOS Sonoma 14.2 ◆ iPad OS 17.2

Link to comment
Share on other sites

Above named 1. would look like this then, where you hide the rect border and only draw on each of the selected Artboards then on their own ...

artboards.jpg.bc197264ff07bdc99e4880f6acef96e0.jpg

☛ Affinity Designer 1.10.8 ◆ Affinity Photo 1.10.8 ◆ Affinity Publisher 1.10.8 ◆ OSX El Capitan
☛ Affinity V2.3 apps ◆ MacOS Sonoma 14.2 ◆ iPad OS 17.2

Link to comment
Share on other sites

20 minutes ago, v_kyr said:

The more challenging and important point here is IMO ...

-> And when I select B, and draw, whenever my drawing goes beyond the border of the window, I don't want it to show (as if the white border is on top).

... for each of those 9 areas then (AFAI understood it).

Doesn't my sample work like that? Any drawing underneath the parent compound will be covered by the 'window's frames' and occur behind it "as if the white border is on top" (in my sample orange). With the bottom most rectangle defining the outer edge while the single 'window' rectangles may get adjusted individually to increase / reduce window size / boarder width.

macOS 10.14.6 | MacBookPro Retina 15" | Eizo 27" | Affinity V1

Link to comment
Share on other sites

2 minutes ago, thomaso said:

Doesn't my sample work like that?

Didn't tried, just pronounced what is the overall main difficulty here when setting up the whole.

☛ Affinity Designer 1.10.8 ◆ Affinity Photo 1.10.8 ◆ Affinity Publisher 1.10.8 ◆ OSX El Capitan
☛ Affinity V2.3 apps ◆ MacOS Sonoma 14.2 ◆ iPad OS 17.2

Link to comment
Share on other sites

1 minute ago, v_kyr said:

Didn't tried, just pronounced what is the overall main difficulty here when setting up the whole.

3 minutes ago, cluelessn00b said:

@v_kyr this could be a more complex case where the overflow does not show on the adjacent panel, but that's not an issue for me.

Ah, @v_kyr, the OP's addition made your note more clear to me. Yes, you are right, my sample does not prevent a drawing which exceeds the area of window 1 from appearing in window 2. – I tried to keep the initially mentioned 2 layers ("T" + "B"): one (main) layer for the frame borders, the other for the drawing, whereas the multi-artboard solution would split the drawing and the 'windows' on various artboards + layers.

If each single drawing is meant to be created in its separate 'window' then clipping would be an alternative, regardless of pages or artboards and of their total number per spread.

1506631479_clippedlayer.jpg.00fa25a7ae581e4795b833729dfe8905.jpg

macOS 10.14.6 | MacBookPro Retina 15" | Eizo 27" | Affinity V1

Link to comment
Share on other sites

Hi
It is really all about masking! and how the layers are organised. Drawing beneath is pretty simple to set up!
Ignore some of the complexity in the little movie but concentrate on how the layers are organised
1. Top Layer has a mask (which is the solid with holes [punched out using tier panel assets]) ...Which are still stored as a separate layer!
2. The imported template has 2 layers a. Vector b. Raster (Where you can draw!)
3. Next is tier or panel storage (Not necessary but useful to have for any edits you need to make)
4. background Solid.

Notes
1. Draw on the Raster layer. You can see that the ink colour is set to black. But the scribbles are orange or blue or black. In Clip Paint you can set a colour for a layer.. useful... So whatever you draw with whatever brush it will always be set to a single colour...You can do this in Affinity by setting the FX of a drawing layer to 'Colour Overlay' and picking a colour. You can have >1 so switching between colours is a checkbox nothing more!
2. Lock the 'overlay mask'...not the layer itself. make it vector and save as asset then you can have several in one document .... or you can change it! 
3. You can fill in the gaps (Holes with fill holes)..but you need to be in 'Vector Persona' or 'Divide' or 'Separate Curves'
4. You could be really efficient and set the underlying panels to be slightly larger than the cutters in the mask..It's not vital but may be useful for printing
5. You can change the colour of the mask...
6. To get more elaborate you can drag the drawing layer inside a panel and sketch inside the panel. Then the drawing is a bit more independent.

Hope this helps

 

Affinity Version 1 (10.6) Affinity Version 2.4.2 All (Designer | Photo | Publisher)   Beta; 2.5 2.2437
OS:Windows 10 Pro 22H2 OS Build 19045.4046+ Windows Feature Experience Pack 1000.19053.1000.0
Rig:AMD FX 8350 and AMD Radeon (R9 380 Series) Settings Version 21.04.01 
Radeon Settings Version 2020
20.1.03) + Wacom Intuous 4M with driver 6.3.41-1

 

 

Link to comment
Share on other sites

10 hours ago, cluelessn00b said:

this could be a more complex case where the overflow does not show on the adjacent panel, but that's not an issue for me.

Well that's IMHO the easiest way to set it up and complex no, it's just one Artboard with a border copy/pasted 8 times and arranged/positioned into a 3x3 grid of the artboards here, nothing more. - Also it offers the ...

Quote

...whenever my drawing goes beyond the border of the window, I don't want it to show

... right out of the box for each Artboard here, so no hazzles with masks or clippings etc.

 

 

☛ Affinity Designer 1.10.8 ◆ Affinity Photo 1.10.8 ◆ Affinity Publisher 1.10.8 ◆ OSX El Capitan
☛ Affinity V2.3 apps ◆ MacOS Sonoma 14.2 ◆ iPad OS 17.2

Link to comment
Share on other sites

21 minutes ago, v_kyr said:

complex no, it's just one Artboard with a border copy/pasted 8 times

IMHO, it's not setting this up which may feel complex but rather the various positions of the drawing layers: spread across the entire Layers panel, mixed with / separated by the 'window' frames.

Well, you could add an extra artboard for the drawing only, in total size + position of all single artboards + placed underneath them, but then your advantage of the clipped/cropped drawing would be lost and turn to the simply hiding (being covered) as in a setup with all single 'windows' on 1 (parent) layer.

macOS 10.14.6 | MacBookPro Retina 15" | Eizo 27" | Affinity V1

Link to comment
Share on other sites

56 minutes ago, thomaso said:

Well, you could add an extra artboard for the drawing only, ...

There are different scenarios possible, dependent on what the OP really wants and is after here. - Personally I wouldn't hazzle at all with such an initial pre-subdivision with bordering, instead I would use the common one doc for each drawing approach and afterwards just fit the contents of 9 docs, into a one doc 3x3 matrix with an appropriate white border subdivision. Pretty much like creating an image contact sheet and the like out of single images/drawings.

I also doubt that those who draw comics and the like professionally, do go from start-up such a pre-subdivision surface drawing area way/route, which looks to me somehow to be overall more hindering than productive for drawing the single independent parts. They probably also scale & fit peaces afterwards together to form a subdivided page.

☛ Affinity Designer 1.10.8 ◆ Affinity Photo 1.10.8 ◆ Affinity Publisher 1.10.8 ◆ OSX El Capitan
☛ Affinity V2.3 apps ◆ MacOS Sonoma 14.2 ◆ iPad OS 17.2

Link to comment
Share on other sites

40 minutes ago, v_kyr said:

Personally I wouldn't hazzle at all with such an initial pre-subdivision with bordering,

Me too (as no comic-artist), I'd prefer APub + vector masks or picture frames for the page layout + add single drawings or copies of pages with drawings accordingly.

Although I can imagine the requested workflow as useful in certain situations, for example, when using scans with multiple sketches per page with different formats for the individual drawings to create the final artwork with more precision or slight adjustments of the single frames. Also it may be useful to predefine a story first by its sequence(s) of single picture formats to stay easier with a certain dramaturgy while drawing.

I wonder how @StuartRc is using the rich set of Assets & Templates visible in their video. The preset empty Raster and Vector layers might indicate they get used for the creation of drawings rather than simply placing illustrations.

macOS 10.14.6 | MacBookPro Retina 15" | Eizo 27" | Affinity V1

Link to comment
Share on other sites

51 minutes ago, thomaso said:

Me too (as no comic-artist), I'd prefer APub + vector masks or picture frames for the page layout + add single drawings or copies of pages with drawings accordingly.

Although I can imagine the requested workflow as useful in certain situations, for example, when using scans with multiple sketches per page with different formats for the individual drawings to create the final artwork with more precision or slight adjustments of the single frames. Also it may be useful to predefine a story first by its sequence(s) of single picture formats to stay easier with a certain dramaturgy while drawing.

I wonder how @StuartRc is using the rich set of Assets & Templates visible in their video. The preset empty Raster and Vector layers might indicate they get used for the creation of drawings rather than simply placing illustrations.

Hi

I keep meaning to add some explanation to the templates in the original thread. It was just a template experiment to start with...but I keep picking at it to add extra features | options.

The assets and page layouts were built in Publisher originally!... Sketching templates are from AD. It is just that assets are visible across all apps now that the confusion has arisen. I agree that the layout should be processed in Publisher. This was always the intention. However while building the template structures I realised that the whole process would require options to sketch | create and edit across all apps. A real advantage in Affinity as not only is the format the same; with later updates assets and brushes could be 'interchanged'. 

The Publisher 'Master Template' carries Styles | Assets (Panels Masks | Tiers | Txt Boxes | Grunge Vector Overlays) | Speech Bubbles | Colour Swatches [Global])

Personally most of my drawings are created in Designer but rather than just create something and place on the Publisher Page as you would 'normally' do inside a picture frame. You could have much more flexibility working between apps and by creating Panels | Masks | Tiers | as vectors (Assets) a lot of page options are automatically introduced...It is then just a matter of converting the panel vectors to a picture frame and placing the graphics. OR AD pages Or PDF OR Photo should you choose to do so. 

In the Video I just used the supplementary sketching templates from AD to demonstrate a few options in reply to the original question. The 'working' template in Publisher is here


It is not finished yet as there are a number of functions | options I would like to add. Especially to the assets. The idea was for any page to be significantly different using assets and templates to create the variation. Changing the page sizes will be another issue to face...

 

 

Affinity Version 1 (10.6) Affinity Version 2.4.2 All (Designer | Photo | Publisher)   Beta; 2.5 2.2437
OS:Windows 10 Pro 22H2 OS Build 19045.4046+ Windows Feature Experience Pack 1000.19053.1000.0
Rig:AMD FX 8350 and AMD Radeon (R9 380 Series) Settings Version 21.04.01 
Radeon Settings Version 2020
20.1.03) + Wacom Intuous 4M with driver 6.3.41-1

 

 

Link to comment
Share on other sites

Love all the inputs here! Of course, I'm more of a beginner so some of the outlined concepts are harder for me to understand, but I'm sure with practice I'll get there. At this time, learning from the various posts, I think I have a reasonable setup that looks like it could work (I tried it).

My intention is to draw a comic book of about 20+ pages. Each page has a few panels--anywhere from 3 - 5.

Here's what I am going to do:

1. AD - 1 Artboard per page. And on that Artboard I will use different grids that act as panel separators (the boxes around a drawing). 

2. I will use Assets to keep my various Comic stuff - like the grid layouts, dialogs, commonly used backgrounds etc.

3. I will draw inside each panel. 

In terms of the flow, 

1. I will be writing out the script first (i.e., what I expect each panel to have)

2. Draw

3. Place dialog bubbles.

Each panel will get a Layer with a numbering scheme: (PgNum]-[PanelNum] for example, 1-3 2-5, and that Layer will have all the sub-layers of the actual drawing.

This way, I have 1 page per Artboard, all panel drawings within the board that makes it easier to manage. And the AD file would have 20+ artboards. 

I should be able to use APub as well, with each page and the same grid asset dragged on it, and draw using AD persona. The advantage here is APub provides the master layout facility.

But that's the thought right now...

Thanks once again,

 

Link to comment
Share on other sites

4 hours ago, cluelessn00b said:

2. I will use Assets to keep my various Comic stuff - like the grid layouts, dialogs, commonly used backgrounds etc.

Just a technical note (in case you haven't noticed yet): Assets must not contain linked image resources and container file types (e.g. EPS, PDF, Affinity files). Images will get rasterized + embedded, container files will get rejected. That means the Asset Panel is not like a library where you could be able to modify an item + automatically get its used instances updated.

macOS 10.14.6 | MacBookPro Retina 15" | Eizo 27" | Affinity V1

Link to comment
Share on other sites

I was very active in drawing Comics in my analogue days (until about 10 years ago), but haven't created anything like that since I'm painting on my PC, I must confess. But I think, as I am more interested in Graphic Novels that don't have a standard grid, but a flexible page layout, I would not work with Artboards for the panels. I think, I would drag a white rectangle over each page - the whole page. Then I would create shapes (not imperative rectangles) for each panel and place them where they belong on each page. After that I would add them to each other, all together (Boolean), so that they become only one layer, and then subtract them from the white rectangle (which of course also can be black or a different color, if you like). After that you should have a sort of passe-partout as a grid, that covers the spaces between the panels. Think of, that you can easily manipulate the grid by dragging the nodes (and it's handles) of the passe-partout. I think this is the easiest and most intuitive way.

In general, it is helpful to create sketches first, to find your page layout and what shall be on the single panels. Possibly analogue, if that works better for you. Then you can scan that sketches and use them as a kind of template.

Link to comment
Share on other sites

Coming back to report on how I'm doing with the workflow.

1. I've setup my main pages on AP. I realized I don't really need the grid options...

2. I first do the backgrounds and script on the frames I draw on AP (and use AD for some vector stuff)

3. I do my drawings on a general artboard on a AD, and once satisfied, just transfer the vector to the publisher, and where I need to reuse, I add it to assets.

I'm still learning all the different possibilities, but this is working great for now. Love learning and I recently purchased a Wacom Intuos Pro Medium, and it's enhancing my enjoyment.

Lot more to learn and figure out, but so far so good. Thanks everyone!

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.