Doodling with pen to paper is one of my happy places; it’s good therapy. The doodles are pretty cool, too, and I like to make other crafts and artwork from them. This blog provides steps for converting handwriting or drawings on real-life pages into digital vectors so that they can be resized for other projects without losing quality.

Free online converters

There are some free online converters you can try. Since I usually have to edit and crop my doodles, I just use the process below to create SVGs and PNGs. There is no reason for you to have to learn all of this, however, if one of the free converters fulfill your needs. Disclaimer: I have not tested these tools. An Internet search for “SVG converter” will provide many more options.

• Adobe Free SVG Converter
• Convertio
• Pixelied

Turn pen-and-paper drawings into digital graphics

You will need a scanner and a good source document (I mean, don’t torment your artwork, dude; keep it clean). Thicker lines scan and trace better. If all you have are thin pen or pencil lines, don’t fret; I’ll explain how to thicken lines, too.

We will use two open-source (freely available) image-editing applications: GIMP and Inkscape. For me, it is easier to break apart and crop graphics in GIMP than in Inkscape. You, however, can skip GIMP altogether if you are more at home editing in Inkscape. GIMP also makes it easy to convert PDFs into bitmap images, which, in my experience, import and trace more accurately in Inkscape than PDFs do. Do what, you ask?

To turn these bitmap scans into digital vector graphics, we will import them into Inkscape and use a feature called Trace Bitmap to convert them into vectors.

Watch this video for a 12-minute demonstration of the process:
[yotuwp type=”videos” id=”PXEd7dGgvBQ” ]

Create the source bitmap

1. First, scan the drawing page to JPEG or PDF using your scanner.
2. Open GIMP and import the scan image, setting the DPI at 300.
3. Crop the image close to the drawing and Export As > JPEG or PNG file type (those are both bitmap graphic types).
   TIP: Naming the export as [name]_source.png will help you stay organized as you work through this process to create “final” digital images. Be sure to also save the GIMP source file (*.xcf) if you make any edits or crop your scan, just in case you have changes to make in the future.

Trace the bitmap to create a vector

1. In Inkscape, import the exported “source” JPEG or PNG.
2. Set options for the trace, depending on whether you are working with black-and-white or color drawings (see table below). You may need to tweak settings a bit, depending upon the detail of your drawing. For single scans, increasing the Threshold will fill the image in more. For color scans, increasing the number of Scans will allow for more colors. Much of this work is trial-and-error to get it right.

For black and white drawings	For color drawings
Single scan tab with Detection mode set to Brightness cutoff. Threshold at 0.450.	Multicolor tab with Detection mode set to Colors. Select Stack and Remove background.

6. Click on Apply.
7. Once the trace completes, move the traced layer to select and delete the original bitmap layer.
8. Select File > Save as and save the Inkscape vector (*.svg) with a final name that includes the “_source” suffix (*_source.svg).
   NOTE: Inkscape SVGs are slightly different than standard SVGs “under the hood,” which you will want for uploading to websites or other software.

Thicken lines in Inkscape

Does your drawing have thin ballpoint or pencil lines? Once scanned, cropped, and imported into Inkscape, you can improve the readability by thickening the lines.

1. Open the Trace Bitmap pane.
2. Select the Single scan tab and tweak the Threshold and other settings to get the best scan you can.
3. Click Apply to trace the bitmap to vector.
4. Move the vector layer and delete the original bitmap layer.
5. Select the traced layer.
6. Open Path > Path effects.
7. Click the + in the lower-left corner of the pane to add a new effect and choose Offset.
8. Tweak the Offset value to thicken the lines.
9. When you are content with results, select File > Save as and save the Inkscape vector (*_source.svg).

Export the vector to a final SVG or PNG

1. To export to a “_final” SVG and/or PNG for crafting or digital publishing, select File > Export.
2. Click on the image to select it and then choose the Selection button in the Export pane.
3. Change the DPI to 300.
4. At the bottom of the panel, change the Type to either Plain SVG (*.svg) or Portable Network Graphic (*.png)
5. Click on the folder to select the file location to which you want to save the export. Once in the folder, click on the Save button.
6. Click in the field to edit the filename, as desired.
7. Click on Export.

Now that you have a digital image of your hardwriting or drawing, see what it might look like on a t-shirt or hoodie.

Sample end file set

Here is my final file set, including the scanned PDF, the GIMP (*.xcf) file created when I cropped the PDF, the “source” PNG I exported from GIMP and imported into Inkscape, the saved trace vector (*_source.svg) from Inkscape, and the final PNG exported from Inkscape (which I upload to third-party design software for crafting).