Text from squares in Photoshop

One of the current trends in design is Low-Poly modeling. Basically, this method is used when working with 3D objects. But this method can be used for other purposes.

For example, if you use a small number of fragments and add lighting effects, you can get an interesting result that will resemble crumpled paper or origami.
In this tutorial, I will show you how to create an interesting 2D text effect using polygonal elements.

To complete the lesson you will need:
-Photoshop (version CS3 and later);
-time costs: 45 – 90 minutes.

Sources for the lesson:

Step 1

Create a new document in Photoshop. Select a canvas size arbitrarily, for example for your work, I use a size equal to the A3 format (so that at the end of the work you can print the resulting text without any problems).

Set foreground color to # e7e9ea and background color # a4a5a1. Activate the tool Gradient (Gradient Tool). In the tool settings, set the gradient type to “Radial Gradient”. In the gradient color settings, select the Foreground to Background fill type.

Then drag a gradient line from the center to one of the corners on the canvas.

Create a new layer above the background. Activate the tool Text (Horizontal Type Tool). From the list of fonts, select Intrepid ExtraBold. The font size is set to 180 pt (if you use a different size of the working canvas, then the font size may differ from what I use in this example). Write the desired text in capital letters.

Try to keep your text as short as possible. This will greatly facilitate the work with the “Image Triangulator App” in the following steps.

Ctrl / Cmd + click on the text layer icon to create a letter selection, then create a new layer and name it “Fill”.

Set the base color to # 9cbc2c and background color on # 405203.
Switch to Filter> Rendering> Clouds (Filter> Render> Clouds). Then deselect by going to Allotment> Unselect all (Select> Deselect).

Now go to File> Save As (File> Save As) and save the image as a jpeg.

Step 2

Install the application “Image Triangulator App”.
Follow the link in the source materials and download the application. Unpack it and then open the file. TriangulateImage5.bat inside the selected folder.

You will get an introductory window with a description of the features that you can use. You can view the proposed material before proceeding to further steps.

The second window you see is Toolbox (Tools window). That is what we will use to create a text effect in the style of Low-Poly.

Step 3

To start text conversion, refer to the top line (button) of the tool window “Select image“(Choose an image). And then open the image you saved previously with text.

Pay attention to that? that the display function should be used “Original“(Oiginal (O)).

Next, open the program window “TriangulateImage5” in which the file with your text opens. We proceed to the addition of base points. Points must be added at the corners and edges of the letters. It is important to keep the correspondence between the points, it will give you a much better result in the end.

Another important detail when placing points. On the short sides of the letters should be at least 2 points, and on the long – at least 4 points. This will make the process of adding polygons in the center of the letters easier.

If in the process of placing points you need to remove some of them, you can press E or use the button On / Off Eraser (On / Off ERASER (E)), which is in the toolbox.

When the Eraser button is active, when you hover over a base point, the cursor looks like a circle. Place this circle on any point and click to remove it. In order to add a new point, disable the button On / Off Eraser (On / Off ERASER (E)) and make a mouse click in the right place.

As soon as you finish adding points, you need to apply them. To do this, press the key R or button Result (Result) (in the toolbox). This will allow you to see the base polygons created from the affixed points.

Now adjust the number and size of the polygons. To do this, click inside the letters.

Please note that if you do not place the cursor inside the letter, then the faces of the letters will be movable. So be careful when adjusting polygons, or add more base points.

After you finish changing the letters, you need to work on a gray background. The principle of operation remains the same – make mouse clicks by adding (removing) polygons.

This process can take you quite a long time, but it’s still one of the fastest and easiest methods to create a 2D Low-Poly effect.

Do not forget that you can always make adjustments to your image by switching to the toolbox.

Step 5

After you have completely finished adjusting the polygons of text and background, you must save the result. To do this, click Write to pdf (Write to PDF).

Then you can open this file in Photoshop for further editing, or simply to save the result in various formats.

After you have opened the 2D text in Photoshop, you can add a grunge texture to it.

Following the link to the lesson, you will find a lot of textures, in this example I will use OTF_Light_Grunge_12 texture. I copy this texture to a folder on the computer, and then drag it to the working canvas with the text.
Layer with texture is placed at the top of the layers palette. Blend mode of this layer is set to Multiplication (Multiply), and opacity (opacity) is reduced to 15%.

In this plugin, you also have the opportunity to save a set of created points. To do this, click on the button Save points (Save points) in the tool window. Then set the file name in the settings window. The coordinates of the points will be saved in a simple text file. You can download this file at any convenient time.

For example, if you create text in Photoshop in different colors, then you can simply open the JPEG-template in the “Image Triangulator App”
and use the saved file with the location of points. To open the point scheme file, press the key Download points (Load points).
Please note that the saved scheme of points will also work effectively only for text with the same size and font style. When you change the size and font parameters, the polygons will look completely different, but you can safely experiment with the text and background color.

After the scheme of points is loaded, you can enable the button Result (Result (R)) and see how the text has changed with the addition of a new color.

You can also still edit points as you did before, and thus change the appearance of the polygons.

Now everything is ready! The lesson is over.

I hope you learned something new from my lesson and it came to your taste!

Like this post? Please share to your friends: