Using vectors! How to write various handwritten fonts without drawing letters

1,287

かくもっち

かくもっち

Nice to meet you! My name is Kakumochi 🐈

Today, I'll share with you how to turn fonts into various types of handwritten designs without having to draw the letters yourself.


🌟 Overview of the process 🌟

The information we will cover in this TIPS is as follows.

🔸 ① Let's convert text to a vector layer

🔸 ② How to arrange vectorized text

🔸 ③ Things to keep in mind when converting fonts to vectors

Just knowing how to do it allows you to make all sorts of arrangements, so let's give it a try!

 

Let's get started...

Do you ever want to write cute handwritten text, but run into problems like this?

🔹 It takes a long time to find a handwritten font that you can use

🔹 You don't like the characters you draw, so you end up redrawing them over and over again

🔹 Even if you find a handwritten font, the characters end up blurry when you distort it

In such cases, try converting it to a "Vector Layer"!

🔸 ① Convert text to a vector layer

In fact, when you convert a text layer to a vector layer,

the conversion process changes it to have a slightly handwritten look.

 

You can convert it to a vector layer using the following method.

1. Enter the text you want to convert into a text layer

2. Right-click the layer and select Convert Layer

3. Change the type to "Vector Layer"

4. Press the OK button to complete the conversion!


[Additional Information]

On an iPad, you can slide the screen to the side to display tabs where you can use buttons such as Shift and Alt.

Right-click = Control

Shift = Shift

Alt = Option

Ctrl = Command

*Unlike PC, there are support functions like this for keys that cannot be used on the tablet version.


When converting a vector layer, you can set how the conversion will occur in the "Vector Layer Conversion Settings" that are displayed by clicking the "Vector Settings" button.

▼ Example of adjusting line width and density threshold

▼ Example of adjusting correction values

*The top one has the smallest correction value (1), and the bottom one has the largest correction value (20).

There are also many other adjustments you can make, such as "Anti-aliasing," which lets you set whether or not the outer edges of lines are smoothed, so try changing the values a little at a time to find the settings you like!

If you want to create a design with only the edges open,

you can draw the edges directly on a vector layer without using layer conversion.

 

The steps are as follows:

1. While holding down Ctrl, click on the image part of the text layer in the layer window

2. Create a new vector layer from the layer window

3. When the selection appears in the text shape, select "Menu ➡ Edit ➡ Outline Selection"

4. Set the border thickness etc. and click OK to complete!

Choose the most convenient method depending on the situation.

Once you have turned your text into a vector layer, you can move on to the next step.

🔸 ②How to arrange vector text

Now that you've converted it to a vector, we'll show you some ways to make the most of it!

 

There are three ways to arrange it:

 

 

📍 Transform with the "Mesh Transform" function

Vector layers support mesh transformation!

You can access it by going to "Menu ➡ Edit ➡ Transform ➡ Mesh Transform".

In addition, by adjusting the number of vertical and horizontal lattice points in the tool properties, you can divide and adjust the range of deformation as desired.

Text layers cannot be mesh transformed,

and rasterizing them will blur the lines when transformed,

so this is an advantage of converting them to vector layers!

*Rasterize = function that converts non-raster layers into raster layers

Let's transform text with mesh transformation and create various designs!

 

 


📍 Duplicate text to create a 3D look

Another way to arrange it is to slightly process the text to give it a three-dimensional look!

 

There are two ways to change it.

🔹 How to create a three-dimensional effect with lines of uniform thickness without interruption

1. Create a selection on the border text layer, and create a fill layer that covers the inside of the border

2. Shift the fill layer until you get the three-dimensional effect (shadow) you want

3. Put the border text layer and fill layer into one folder

4. While holding down Ctrl, click on the image part of the folder in the layer window

5. Select the border text vector layer

6. Select "Menu ➡ Edit ➡ Outline Selection" to complete

The above method allows you to create three-dimensional text without any interrupted lines.

You can also reduce the number of layers, as you can delete fill layers etc. after you're done.

however!

There may be cases where the position of the lines will not match the text layer with the border you created first, so when you border the selection, make sure to border it on the "inside."


🔹 How to connect lines only in the desired areas to create a three-dimensional effect

1. Duplicate the bordered text layer

2. Shift the duplicated layer to the side until you achieve the desired three-dimensional effect

3. To create a three-dimensional effect, erase lines or connect them with the Shape Tool → Straight Line

4. Merge the vector layers you've finished drawing

It does require a little bit of work, such as drawing lines, but you can create a variety of arrangements by connecting lines of different thicknesses and colors, or even not connecting some places at all.

In fact, there are many other ways to add depth to text...

(e.g. Layer Properties Effects → Using Borders)

 

 

Compared to Lester layers, you can readjust the line width later,

so the line drawing doesn't get blurry even when enlarged, and you can add strength and weakness to only some of the lines.

 

▼Example of line width adjustment

 

 

For information on the basics of vector layers, such as adjusting line width, please also refer to these TIPS.

Logos and other text are often reused in various places, so it's worth having them available for use in a variety of situations!

 

 

Now let's look at the final arrangement method.


📍 Change the brush shape to create different lines

If you use vector layers, this is a feature you can't miss.

When you select a vector layer and the 'Object Selection Tool',

you'll be able to readjust the main color, brush size, etc. in the tool properties.

By selecting "Brush shape" and selecting your favorite brush from the list, you can change the text to the design of that brush.

Depending on the brush shape, a certain brush size may not look good, so try adjusting different brush shapes.

You can register a brush shape by selecting the brush you like and pressing the "Sub Tool Details ➡ Brush Shape ➡ Register to Preset" button.

Please note that some brushes may not be able to be registered.

 

 

By trying out brush shapes on vector layered text,

you can write more neatly than if you were to draw it yourself, and it can be applied to longer sentences.

Or, why not try layering the same text with different brush shapes?

You can come up with all sorts of combinations, so it's fun to try them out.

 

 

🔸 ③Points to note when converting fonts to vectors

Finally, there is one thing to keep in mind when transforming text.

 

Some fonts may not allow transformation.

If you plan to use a font that only partially transforms it, make sure there are no problems with the license.

 

Also, because the nature of the function causes fonts to become slightly distorted when made into vector layers, we recommend that you choose a font with a design that is not too complex.

 

 


What did you think?

The methods shared above are just examples, so please try out various other arrangements.

 

Leaving a like will be very helpful for our future activities🫶

 

I hope that we can continue to enjoy our drawing lives together☺️

Comment

New

New Official Articles