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

Back with the Mesh Warp / Distort Tool... Some considerations


Recommended Posts

Hi there!

DISCLAIMER: First of all, this is not another "bring the Mesh Warp / Distort Tool right now!" Topic. I'm not asking the Team to give us an estimated time of arival... None of that. It's something different, hinted in the Title.

INTRODUCTION & INTENTIONS

The purpose of this Topic is to share my thoughts and considerations, specially with @MattP, the talent behind this and some other great Features, to keep in mind when developing this. Why? The reasons are simple:

  • Some of us are more than impatient to have this Feature available.
  • It's been on the Roadmap for so long...
  • Many need this and they are all in into Designer and lefting [Design Application] behind.

There are high hopes and so much anticipation. And it's in the Dev Team plans. That's all good, but... is the gap between the Dev Team idea and the users need really been closed, even narrowed? When realeased, will it be what a lot of people are expecting? That's the key point that might turn things ugly here in the Forums.

So, I want to open a relaxed discussion to talk about needs, capabilities and workflow. I will do so by diving the kins of distortions I know in 3:

TYPE ONE

Miscellanous Specific Forms Distortions:

  • Topic 1: Arc Warp. @TonyB confirmed it will be doable as some other transformations. Said feature works like this for texts (but also for shapes), in Illustrator 2019 and on other Apps like PSE 10:

image.thumb.png.b82774a3320b1522ef166e0b895abe8b.png

image.thumb.png.0534770c1cb4bc3b64fc43b659023263.png

The other transformations available are this ones. Available on both Apps but they don't work exactly in the same way:

image.png.e86a53188b6e78cf7a938240427a0ccd.png

 

Now, the thing about these transformations (and the other Types) are these ones: Control and configuration. They are done through a set of parameters, not through a Mesh like the one in Affinity Photo. so, it's not just that it's doable, but that it's repeatable and done with a degree of presicion. And of course, it has to be editable and resetable, or as it's called nowadays: live. For example, trying to do it through a Mesh is not that great (the red one is done by hand after a lot of struggle, and it's no good):

image.thumb.png.623bb18f6f8b92afe557f7d8cc9a8721.png

That's the Arc Warp but imagine this for all kind of options known to man.

TYPE TWO

The next thing is about Perspective, whis is another popular requested feature.

  • Topic 2. This is really clear as what it has to do. Not just of one object, but for an entire Group, to do a pseudo 3D thing.

On this one, DrawPlus does a good job and offers interesting options, like the slider on the Top part, and it gives the sens of working with a 3D object.

image.thumb.png.4e4d211a22ca1c18735c542b91fc37f9.png

The one in Illustrator does its part, but once you transform an object, you can't have the original back, so it's a destructive effect (making this a live feature would be awesome).

image.thumb.png.21a2021d8c811b0c7592e0a3bccb963e.png

If the angles of "rotation" can be in the form of parameters and mouse control, would make it cover all scenarios.

TYPE THREE

The last kind of Distortion people ask for in the forums is the Free Transform.

  • Topic 3. This is the one that sounds more like the one currently present for bitmaps in Photo or the Envelop Tool in DrawPlus. Personally, this is the least I am interested in, but it has its uses and would make this feature as robust as it can be.

image.thumb.png.67df1ee3534218bbb784e3ec35803025.png

image.thumb.png.061ffa34d246ae683a10f9e62d4b47e0.png

I see there are two variations to this feature:

  1. One with the handles, as seen on the previous pictures.
  2. One with "sharp" cornes, without the handles (it's almost like a Perspective Distortion, but I present it like a different one because with a perspective you should be able to maintain the aspect ratio, with this one you can go beyond that).

In Illustrator, the Free Distort Effect does this in the "sharp corner" fashion, turning it to semi-curves in some extreme distortions:

image.thumb.png.aa23d6e77544b215af630cc92bec35e9.png

As with the previous ones, the ability to reset and edit the effect on already distorted objects, would be gold.

SUMMARY

As I said, when talking about Distortions / Warping, most people have one or more of the three I showed. So, I leave some key points:

  • Having all of the three types listed above in Designer is the best thing that can happen in this regard to Serif and us the Users.
  • Also, having the ability to reset, edit and have parameters in some of the cases, would provide absolute control (and enjoyment).
  • If the Dev Team implements this one after the other and not all in the initial release, even if it's not desirable, is still a good path.
  • Limiting to one or two of the Three Types "by design" would hurt the product.
  • Very important: I'm not saying "copy this and copy that", I'm just showing examples of the possible use cases for a Tool like this; however it's implemented, as long as it's logical and feels natural, offering all of the capabilities presented, would be perfect.

So, citing Matt himself:

I want our products to be good in their own right: It’s not good enough to be better than ‘x’ or ‘y’, you should just be really good and that be the end of the sentence

I expect from you what you have set as your own goal: the best possible Affinity Designer.

Finally, I invite anyone who wants to contribute by bringing examples or something they want for this Feature that I missed.

Best regards!

Link to comment
Share on other sites

Also, being honest, I got worried for this because of something said in another thread, where @MEB commented:

  • This is already on Designer's roadmap (which covers all new features until version 2.0) so it will come with one of the next updates. I'm referring to mesh warp distortions not to something similar to Warp Effects in Illustrator just to be clear. There's no eta for any specific feature (it depends on the development goes) so i can't add much more details at this point.

And when I asked bout it, trying to understand what would be and what wouldn't be developed, he added:

  • I believe it will be similar to the mesh warp you already find in Affinity Photo but vector based - I mean, it will change the geometry of the original objects based on the mesh grid displacements you make - but I may be wrong here. I don't know much about it at this point to be of much help, sorry.

Anyway, I hope this is taken into account. And as I said, it's a message first for @MattP but it's also for everyone. I don't take anything for granted, so it's great to express our needs and share them openly here in the forums.

Best regards!

Link to comment
Share on other sites

13 hours ago, Mithferion said:

Finally, I invite anyone who wants to contribute by bringing examples or something they want for this Feature that I missed.

Hi @Mithferion,

thank you for summing this up. For me the most important thing would be fine control about the transformation(s) including snapping if needed. It also would be good to have this non destructively (as you point out) and keeping the transformed objects editable. I think the existence of 'Isometric Mode' is a hint on what we can expect (or what is possible).

d.

PS: Saving and reusing transform settings (like 'Paste Style') would also be a great productivity feature.

Edited by dominik
Added PS.

Affinity Designer 1 & 2   |   Affinity Photo 1 & 2   |   Affinity Publisher 1 & 2
Affinity Designer 2 for iPad   |   Affinity Photo 2 for iPad   |   Affinity Publisher 2 for iPad

Windows 11 64-bit - Core i7 - 16GB - Intel HD Graphics 4600 & NVIDIA GeForce GTX 960M
iPad pro 9.7" + Apple Pencil

Link to comment
Share on other sites

Hi!

8 hours ago, dominik said:

including snapping if needed

That would be great for the Mesh based transformations, indeed. Free transformations are nice, but sometimes one needs a level of constrains for consistency.

8 hours ago, dominik said:

Saving and reusing transform settings (like 'Paste Style') would also be a great productivity feature.

Another great suggestion. Even saving some Presets like the ones we have for the different shapes would be good.

Best regards!

Link to comment
Share on other sites

24 minutes ago, Mithferion said:

but sometimes one needs a level of constrains for consistency.

I want to add one more thing that come to mind as you write 'constrain'.

Holding down SHIFT key constrains to horizontal or vertical movement as we know from other tools.

d.

Affinity Designer 1 & 2   |   Affinity Photo 1 & 2   |   Affinity Publisher 1 & 2
Affinity Designer 2 for iPad   |   Affinity Photo 2 for iPad   |   Affinity Publisher 2 for iPad

Windows 11 64-bit - Core i7 - 16GB - Intel HD Graphics 4600 & NVIDIA GeForce GTX 960M
iPad pro 9.7" + Apple Pencil

Link to comment
Share on other sites

TYPE FOUR

How could I forgot? Another kind of Distortion that some might find useful is to adapt text into some specific shape.

The idea is as follows: the ability to fit text into a shape, like this one (again, with editing capabilities):

image.thumb.png.17c693ad52ce3dc15e2a4e36892097b4.png

image.thumb.png.84ea6dcac6b9a9ab0c4605768a7b47d6.png

So, yeah, with this one added, I know it's A LOT to cover, but please, take it into consideration for your internal Roadmap.

Best regards!

Link to comment
Share on other sites

As in many features, the devil is in the details. And again: just because Illustrator dominates the market segment does not necessarily mean it is the program to emulate. Typically, Illustrator new features seem to be designed more for an initial "wow factor" when introduced, than thoroughly thought-out. Its first introduction of a warp tool was a case-in-point, which then cascaded down to other subsequently introduced distortion features. Those devilish details can make all the difference between just another "me, too" copycat feature and an elegantly more powerful implementation.

When Illustrator finally got around to having an enveloping tool, its primary historic rival, FreeHand already had one. There was a subtle difference: In FreeHand, the user had control over whether or not the envelope, when initially applied, already had its node curve handles extended.

This "tiny" interface detail made all the difference.

I dare say the simplest, most basic, and therefore most common use for a warp effect is to simply distort the rectangular envelope of a selection by independently moving its corners so as to make the content artwork fit a surface in the illustration that is viewed at an angle; like simply putting a graphic onto the side of a drawn box or monitor screen that isn't viewed "straight on."

That was a simple, straightforward, few clicks in FreeHand. It was a tedious nightmare in Illustrator. Why? For one simple reason: Illustrator's envelope insisted upon being created with its nodes' curve handles already pre-extended by the rule-of-thumb 1/3 length of the segments. In FreeHand, the user was provided control over that.

That was commensurate with a preceding interface superiority in FreeHand: Its provision of auto-retract and auto-extend options which did not appear in Illustrator until much later and which, as usual, still fall short of FreeHand's implementation due to other pre-established "underlying foundations" of the interface. Specifically, it was related to the fact that FreeHand "knew the difference" between paths' being selected at the object level as opposed to merely having all of its individual nodes selected. That engrained foundational inferiority plagues Illustrator to this day, being directly related to Illustrator's now almost universally mimicked interface convention of having two separate primary selection tools.

So thanks, Mithferion, for starting a forward-looking feature discussion thread, as opposed to the pandemic "I want this feature [ just like the only program I've ever used has] and I want it now!" demands. We need more of this. It's what could lead to more powerful innovation instead of just more same-old, same-old mediocrity (like—I hate to say—the frankly disappointing arrowheads feature).

JET

Link to comment
Share on other sites

On 6/30/2019 at 12:24 PM, arial_bold said:

Also why not add a macro option for Designer something like the one in Photo. Record every step. Instead of rebuilding the logo because of a name change, simply change the name and apply the same macro, get the same look. Done.

Maybe having the ability to save Presets would do the trick in such situations.

 

8 hours ago, JET_Affinity said:

Those devilish details can make all the difference between just another "me, too" copycat feature and an elegantly more powerful implementation.

Some of the reasons for me to use Affinity Designer is that some great decisions have been made in terms of workflows. It's lacking features, yes, but it has the potential and the time to have such neatly done implementations.

 

8 hours ago, JET_Affinity said:

So thanks, Mithferion, for starting a forward-looking feature discussion thread, as opposed to the pandemic "I want this feature [ just like the only program I've ever used has] and I want it now!" demands. We need more of this. It's what could lead to more powerful innovation instead of just more same-old, same-old mediocrity (like—I hate to say—the frankly disappointing arrowheads feature). 

Yes, the point to use some screenshots of the rival App is just to show desired results, with the intention of making things better, locical and natural, not in the old-fashioned way. Also, thanks to you. With your experience and knowledge you provide valuable inisghts to many of us novices.

I hope we can read some of the thoughts from the Dev-Team.

Best regards!

Link to comment
Share on other sites

  • 6 months later...

Something I hope all would consider: The intents (and therefore requirements) of distorting type, as opposed to general artwork.

I grew up working in sign shops, long before the advent of digital type. (I'm proud to say I can still twirl a lettering quill.)

The trouble with automated pre-set envelope distortions as usually implemented is that they treat type the same way they treat any other vector paths, when usually it shouldn't be.
I'm not talking about deliberate effects like the water-drop examples. I'm talking about the ubiquitous things like curving what is supposed to read like normal text around circular emblems, the ess-curved "flag" baselines, the 'hero' headlines, and especially the whole plethora of attempts to emulate retro signage styles. The result, more often than not, is really amateurish adulterations of good type.

All those classic treatments of type are why software since the earliest days, long before vector envelope effects in every drawing program, have been separate features implemented as options for live type-on-path objects, especially the one called various names like "Vertical" or "Skew."

The good thing about that very important treatment is that these things are maintained, as they should be:

  • The proper "uprightness" of the glyphs
  • The straightness of their vertical strokes
  • The proportion of horizontal strokes to verticals

The only bad thing is that the straight horizontals of the glyphs skew, but remain straight.

Typical general-purpose envelope distortion features know nothing of this.

That's why I'd like to see an envelope distortion that knows when it's dealing with type, not just random vector paths. Implementing it as a separate type-specific envelope feature wouldn't hurt my feelings a bit.

JET

Link to comment
Share on other sites

37 minutes ago, JET_Affinity said:

That's why I'd like to see an envelope distortion that knows when it's dealing with type, not just random vector paths.

 

Out of interest in this discussion and your experience: what do you think of APh's rendering of a Live Perspective Filter applied to a text layer? Note: the text is still editable (see APh file below).

927672622_liveperspectivegrid.thumb.jpg.d987aec2a265c46edec570f76dd1a94b.jpg

 

I post this because I have high hopes in Serif's capabilities to come up with a finally good solution to mesh, warp and perspective distortions. And also with type. To me the example above already looks pretty good. Another indication to this is the recent improvement (in beta) to 'Expand Stroke'. They seem to know about math :)

(Disclaimer: I found this method of using a live perspective on type in this forum. I just can't remember where and when).

d.

 

live perspective grid.afphoto

Affinity Designer 1 & 2   |   Affinity Photo 1 & 2   |   Affinity Publisher 1 & 2
Affinity Designer 2 for iPad   |   Affinity Photo 2 for iPad   |   Affinity Publisher 2 for iPad

Windows 11 64-bit - Core i7 - 16GB - Intel HD Graphics 4600 & NVIDIA GeForce GTX 960M
iPad pro 9.7" + Apple Pencil

Link to comment
Share on other sites

Somehow have missed and not seen this thread before.

20 minutes ago, dominik said:

...APh's rendering of a Live Perspective Filter applied to a text layer...

That can also be used (taken over from APh) to AD and would then there preserve text and shapes as vectors.

Related to other initially in this thread shown distortion methods, the free form distortion works mostly everywhere I've seen those implemented, on enhanced curves, meaning here on a vector node base, instead of shapes. Envelope distortions in contrast here via predefined shape/form presets (hence the name envelope).

☛ 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

On 1/17/2020 at 1:02 PM, v_kyr said:

That can also be used (taken over from APh) to AD and would then there preserve text and shapes as vectors.

It has, however, some disadvantages. One is that even if you convert text to curves, each letter will have its own Live Filter, and if you export that file, the result is not the distorted curves.

 

On 1/17/2020 at 1:02 PM, v_kyr said:

Related to other initially in this thread shown distortion methods, the free form distortion works mostly everywhere I've seen those implemented, on enhanced curves, meaning here on a vector node base, instead of shapes. Envelope distortions in contrast here via predefined shape/form presets (hence the name envelope).

All of the examples are shown to provide examples (with links to other Topics) of what people expecto. One of the purposes of this Topic is to reduce the gap of what we expect and what Serif have plans on developing.

Best regards!

Link to comment
Share on other sites

  • 3 months later...
  • 3 weeks later...
On 1/17/2020 at 6:27 PM, dominik said:

 

Out of interest in this discussion and your experience: what do you think of APh's rendering of a Live Perspective Filter applied to a text layer? Note: the text is still editable (see APh file below).

927672622_liveperspectivegrid.thumb.jpg.d987aec2a265c46edec570f76dd1a94b.jpg

 

I post this because I have high hopes in Serif's capabilities to come up with a finally good solution to mesh, warp and perspective distortions. And also with type. To me the example above already looks pretty good. Another indication to this is the recent improvement (in beta) to 'Expand Stroke'. They seem to know about math :)

(Disclaimer: I found this method of using a live perspective on type in this forum. I just can't remember where and when).

d.

 

live perspective grid.afphoto

This would work for me, if I can do the effect in Photo and keep it back in Designer (I already do this hack for tables from Publisher).

How did you set up this perspective on rectangle? (Sorry, I rarely use Photo)

Link to comment
Share on other sites

3 minutes ago, matt said:

How did you set up this perspective on rectangle? (Sorry, I rarely use Photo)

Hi @matt,

I did this in Photo.

  1. On top of the image create your text and a rectangle.
  2. Drag the text underneath the rectangle so that is being clipped by the rectangle.
  3. Choose 'Layer > New Live Filter Layer > Distort > Perspective'. This presents you the rectangle with four handles on each corner of the rectangle that you then can drag and adjust to the 'plane' in your image below.

Note: If you click in the layers panel on the rectangle or the text they get highlighted at their original size, which is different from the perspective display. I find it easier to select these two by clicking in the layers panel than to try to click in the drawing.

By selecting the text tool you can edit the text.
By switching to AD you can continue editing the entire content of the file, including the live perspective filter 🙂

Cheers,
d.

Affinity Designer 1 & 2   |   Affinity Photo 1 & 2   |   Affinity Publisher 1 & 2
Affinity Designer 2 for iPad   |   Affinity Photo 2 for iPad   |   Affinity Publisher 2 for iPad

Windows 11 64-bit - Core i7 - 16GB - Intel HD Graphics 4600 & NVIDIA GeForce GTX 960M
iPad pro 9.7" + Apple Pencil

Link to comment
Share on other sites

Thanks! I've done it.

This is a usable workaround for me.

It's crazy that Designer supports all these things—if you are canny enough to be able to get them into your file—but does not expose their creation in the user interface.

So now I have two template files to copy extra features: one for tables and one for perspective!

I think the vision of a happy ecosystem of Designer+Photo+Publisher has in fact fragmented what each app offers the user and has caused holes like this to appear. Such a shame.

Anyway, thanks again!

Link to comment
Share on other sites

2 hours ago, matt said:

It's crazy that Designer supports all these things—if you are canny enough to be able to get them into your file—but does not expose their creation in the user interface.

Personally I think the way it works right now is not the finished workflow. It's an intermediate step (some may call it a workaround). I am sure AD will have a capable envelope and distort funciton of it's own. Perhaps a refined version of distort in APh. I'm looking forward to what they come up with.

d.

Affinity Designer 1 & 2   |   Affinity Photo 1 & 2   |   Affinity Publisher 1 & 2
Affinity Designer 2 for iPad   |   Affinity Photo 2 for iPad   |   Affinity Publisher 2 for iPad

Windows 11 64-bit - Core i7 - 16GB - Intel HD Graphics 4600 & NVIDIA GeForce GTX 960M
iPad pro 9.7" + Apple Pencil

Link to comment
Share on other sites

Still these time consuming workarounds involving a secondary purchase are not exportable as vector.

The ecosystem of three apps with features fragmented into each app is pointless. There has to be some overlap, even more so now they actually share the code for it. And when they share code it makes absolutely no sense to have to switch to Photo or Publisher to use features Designer supports anyway. And vice versa.

Lets see what will actually be implemented and/or changed in coming revisions and versions. Dreams do not count.

  • "The user interface is supposed to work for me - I am not supposed to work for the user interface."
  • Computer-, operating system- and software agnostic; I am a result oriented professional. Look for a fanboy somewhere else.
  • “When a wise man points at the moon the imbecile examines the finger.” ― Confucius
  • Not an Affinity user og forum user anymore. The software continued to disappoint and not deliver.
Link to comment
Share on other sites

  • 11 months later...
On 6/5/2020 at 6:00 PM, dominik said:

Hi @matt,

I did this in Photo.

  1. On top of the image create your text and a rectangle.
  2. Drag the text underneath the rectangle so that is being clipped by the rectangle.
  3. Choose 'Layer > New Live Filter Layer > Distort > Perspective'. This presents you the rectangle with four handles on each corner of the rectangle that you then can drag and adjust to the 'plane' in your image below.

Note: If you click in the layers panel on the rectangle or the text they get highlighted at their original size, which is different from the perspective display. I find it easier to select these two by clicking in the layers panel than to try to click in the drawing.

By selecting the text tool you can edit the text.
By switching to AD you can continue editing the entire content of the file, including the live perspective filter 🙂

Cheers,
d.

@dominikThis workaround just saved me a lot of time. Thank you very much.

While is not a perfect solution for everyone and it's a good enough placeholder for me right now.

Link to comment
Share on other sites

  • 2 weeks later...

VectorStyler £85 👍

Daz1.png

Mac Pro Cheese-grater (Early 2009) 2.93 GHz 6-Core Intel Xeon 48 GB 1333 MHz DDR3 ECC Ram, Sapphire Pulse Radeon RX 580 8GB GDDR5, Ugee 19" Graphics Tablet Monitor Triple boot via OCLP 1.2.1 - Mac OS Monterey 12.7.1, Sonoma 14.1.1 and Mojave 10.14.6

Affinity Publisher, Designer and Photo 1.10.5 - 2.2.1

www.bingercreative.co.uk

 

 

 

 

 

Link to comment
Share on other sites

16 hours ago, Dazmondo77 said:

VectorStyler £85 👍

👎 Nope.

TL;DR: Some useful tools but user unfriendly

It's in free beta on Windows (free to Trial on Mac) and here is my experience of it at time of writing on Windows.

It is powerful and has some features which Designer is missing but it is also unintuitive to use.

It took me a while to even find where the keybinds were hidden (Shift+Alt+Ctrl+K) or from the menu bar at the top (View>Customize>Keyboard Shortcuts). I could not find a way to set mouse binds. It has keybinds set to the Option key in the Windows (this means Alt). The alt keybinds still work.

The "Help" redirects to a browser page and some of those "Help" pages direct to dead links. The "Help" pages that go somewhere aren't always all that helpful.

Time wasted learning the weirdness of VectorStyler is better spent learning how to use the features Designer has or using the forum search feature for workarounds.

 

Link to comment
Share on other sites

5 hours ago, Graphite Addict said:

Time wasted learning the weirdness of VectorStyler is better spent learning how to use the features Designer has or using the forum search feature for workarounds.

Yes VectorStyler does have a clunky user experience, but I've had nearly seven years of workarounds with Designer, just to do taken for granted stuff that was standard 25 years ago in Freehand - I've already used Vectorstyler on a few Vector jobs then got them into publisher for output - I'd love to be able to work solely in Affinity but we may never get these missing basics and VectorStyler has a near complete toolset, I don't want to use it, but I don't want to wait another seven years before Serif lets us know where it's heading

Daz1.png

Mac Pro Cheese-grater (Early 2009) 2.93 GHz 6-Core Intel Xeon 48 GB 1333 MHz DDR3 ECC Ram, Sapphire Pulse Radeon RX 580 8GB GDDR5, Ugee 19" Graphics Tablet Monitor Triple boot via OCLP 1.2.1 - Mac OS Monterey 12.7.1, Sonoma 14.1.1 and Mojave 10.14.6

Affinity Publisher, Designer and Photo 1.10.5 - 2.2.1

www.bingercreative.co.uk

 

 

 

 

 

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.