# Curved Text

## Recommended Posts

Hi there,

I am new to Affinity Designer and I was wondering how I can create a text line like in the attached files. Like the Old Songs en Melodies poster where the upper part of the text follows a straight line and the lower part follows a curve. Or like the Revival poster where the upper and lower part of the word revival follow a unique curve.

Can anybody help?

Thanks!

##### Share on other sites

Not in designer, but if you also have Affinity Photo

1. Create some Artistic text
2. Filters > Distort > Equations
3. Enter formula shown below
4. Adjust the Slider A to vary the effect

This is the formula

y-(120*a)*sin(380*x/w)

Due to the fact that Boris Johnson is now our Prime Minister, punctuation, spelling and grammar will never be worried about ever again.  We now have far bigger problems to be concerned about.

##### Share on other sites

Thanks for the help Carl!

Wonderful

##### Share on other sites
9 hours ago, carl123 said:

This is the formula

y-(120*a)*sin(380*x/w)

Did you really mean to apply a factor of 380, Carl, or was that a typo for 360?

Alfred
Affinity Designer/Photo/Publisher 1.7.3.481 • Windows 10 Home (4th gen Core i3 CPU)

##### Share on other sites

Not a typo

380 sets the overall curve on the bottom part of the letter "L"

The higher the number the more the curve

I deliberately increased it from 360 to show that you could and affect the results by doing so

Due to the fact that Boris Johnson is now our Prime Minister, punctuation, spelling and grammar will never be worried about ever again.  We now have far bigger problems to be concerned about.

##### Share on other sites

If you want to re-shape the curve, you can try:

y-(120*a)*(b*sin(360*x/w/c)+(1-b)*cos(360*x/w/c))

Varying the a parameter will change the (vertical) amplitude of the curve.

Varying the b parameter will change the horizontal position of the curve.

Varying the c parameter will change the wavelength of the curve.

John

Windows 10, Affinity Photo 1.7 and Designer 1.7, (mainly Photo), now ex-Adobe CC

CPU: AMD A6-3670. RAM: 16 GB DDR3 @ 666MHz, Graphics: 2047MB NVIDIA GeForce GT 630

##### Share on other sites

Wow, this seems so esoteric. How would a lay person have any idea what equations to use or how to create them?

Do you think the programs will have have a more intuitive method of shaping text along a curve? If not, I wonder if the help files could have some sample equations or some explanation of how to create equations that do certain kinds of distortions.

Affinity Photo, V 1.7.1    Affinity Designer, V 1.7.1

Imac OS 10.13.6 ( High Sierra)

##### Share on other sites

I'm new to AP and I'm definitely not a math whiz. However, I did manage to easily do a controlled text warp using the "warp mesh tool".  Unfortunately, it apparently rasterizes the text, since it no longer allows font changes. Seems like adding the same curve control levers to the text manipulation box would be a fairly straight forward and useful modification. Already loving the general feel of this very versatile and intuitive software.

Cedge

##### Share on other sites

Hi,

If you're a Affinity Photo user check out the cheat file provided by  dutchshader in this link: textonapath.afphoto

Affinity Photo  1.7.3.481   - Beta 1.8.0.486

Windows 10 Home  1909 (build 18363.476) - 64 bit processor - AMD A4-5000 APU with Radeon HD Graphics  1.50GHz - RAM 8,00 GB
Calibrated Monitor (Datacolor Spyder5 Pro)

##### Share on other sites
12 hours ago, DianeF said:

Wow, this seems so esoteric. How would a lay person have any idea what equations to use or how to create them?

Definition of esoteric: "intended for or likely to be understood by only a small number of people with a specialized knowledge or interest."

You are quite right. I am not a mathematician, but I have enjoyed many such mathematical applications over my professional career (as a biologist). But then I do find some other aspects of Affinity esoteric whereas others find them straightforward.

12 hours ago, DianeF said:

Do you think the programs will have have a more intuitive method of shaping text along a curve? If not, I wonder if the help files could have some sample equations or some explanation of how to create equations that do certain kinds of distortions.

I have begun to provide a series of tutorials on using Distort > Equations (in the Tutorials forum). The thread this links to covers Trig functions, with a final post on using sines and cosines to place text on wavy lines. What I shall do is to create a macro to do this distortion so that you can use it without necessarily understanding the mathematics. This will be in that tutorial post.

As others have indicated above, this is not the only way to shape text along a curve. Using Affinity Designer is the way to go. The .afphoto file supplied by @dutchshader quoted in the link above by @HVDB Fotografie looks as if it has taken that route, bringing the curved text back into Affinity Photo.

Windows 10, Affinity Photo 1.7 and Designer 1.7, (mainly Photo), now ex-Adobe CC

CPU: AMD A6-3670. RAM: 16 GB DDR3 @ 666MHz, Graphics: 2047MB NVIDIA GeForce GT 630

##### Share on other sites

I'll look forward to seeing your macro, John. I checked out your earlier posts and still couldn't figure any of this out. It's been a lot of years since I studied trigonometry and most of it is not coming b, unfortunately.

I also looked at durchshader's post in the aforementioned link. I will review the help files for text on a path in Designer. I love the ability to switch back and forth between programs to take advantage of the features of each.

Affinity Photo, V 1.7.1    Affinity Designer, V 1.7.1

Imac OS 10.13.6 ( High Sierra)

##### Share on other sites
8 hours ago, DianeF said:

I will review the help files for text on a path in Designer.

You might want to watch these two video tutorials as well:

Affinity Photo 1.7.3, Affinity Designer 1.7.3, Affinity Publisher 1.7.3; macOS High Sierra 10.13.6 iMac (27-inch, Late 2012); 2.9GHz i5 CPU; NVIDIA GeForce GTX 660M; 8GB RAM
Affinity Photo 1.7.3.155 & Affinity Designer 1.7.3.1 for iPad; 6th Generation iPad 32 GB; Apple Pencil; iPadOS 13.1.2

##### Share on other sites

Thanks, R-C-R. I will watch them.

Affinity Photo, V 1.7.1    Affinity Designer, V 1.7.1

Imac OS 10.13.6 ( High Sierra)

##### Share on other sites

I was trying to find out how to add text to a path using AP on the iPad. This happens to be in the section for iPad yet from what I’ve read and comprehended so far this doesn’t belong here. Is there a way to do this on the iPad? Autodesk Graphic offers this, calling it Placing Text On Path. By creating an ellipse selecting text and shape together then choosing this feature. Instant!

I’m hoping on doing more using Affinity Photo.

“The curses are not what they seem, prepare... they, too, have teeth.”

##### Share on other sites
On 1/1/2018 at 2:12 AM, DianeF said:

I'll look forward to seeing your macro, John. I checked out your earlier posts and still couldn't figure any of this out. It's been a lot of years since I studied trigonometry and most of it is not coming b, unfortunately.

I thought that all I had to do is to record it as a macro and I could post it here. However, the recorded macro seems to have absolutely no effect on the artistic text I was using.

Windows 10, Affinity Photo 1.7 and Designer 1.7, (mainly Photo), now ex-Adobe CC

CPU: AMD A6-3670. RAM: 16 GB DDR3 @ 666MHz, Graphics: 2047MB NVIDIA GeForce GT 630

##### Share on other sites

Has these operations gotten any more straight forward in the past year?  I'm working on a bunch of Signage and this warping comes up all the time.

I currently use Baseline and Vertical Scale tools in the Character pallet

##### Share on other sites
16 hours ago, Rivka said:

Has these operations gotten any more straight forward in the past year?  I'm working on a bunch of Signage and this warping comes up all the time.

I currently use Baseline and Vertical Scale tools in the Character pallet

As far as I am aware, the answer is still no. Applying such transformations applies only to rasterized images in Photo. I do not believe that the 1.7 betas offer it.

John

Windows 10, Affinity Photo 1.7 and Designer 1.7, (mainly Photo), now ex-Adobe CC

CPU: AMD A6-3670. RAM: 16 GB DDR3 @ 666MHz, Graphics: 2047MB NVIDIA GeForce GT 630

##### Share on other sites

My macro to warp text along a wavy curve is now here.

I will also see if I can add macros to change just the top  or bottom line of the text as in your songsheets above.

John

Windows 10, Affinity Photo 1.7 and Designer 1.7, (mainly Photo), now ex-Adobe CC

CPU: AMD A6-3670. RAM: 16 GB DDR3 @ 666MHz, Graphics: 2047MB NVIDIA GeForce GT 630

## Create an account

Register a new account