Browse Source

Add a blog post talking about making artwork for badges.

master
Syfaro 1 year ago
parent
commit
a9f77443d1
4 changed files with 124 additions and 0 deletions
  1. BIN
      content/blog/led-badges-artists-guide/engraved_paw.jpg
  2. +86
    -0
      content/blog/led-badges-artists-guide/index.md
  3. BIN
      content/blog/led-badges-artists-guide/line_thickness.jpg
  4. +38
    -0
      content/blog/led-badges-artists-guide/paw.svg

BIN
content/blog/led-badges-artists-guide/engraved_paw.jpg View File

Before After
Width: 3024  |  Height: 4032  |  Size: 2.1 MiB

+ 86
- 0
content/blog/led-badges-artists-guide/index.md View File

@@ -0,0 +1,86 @@
---
title: "Making Art for the Badges"
date: 2018-10-20T02:00:00-05:00
draft: false
---

An important component of the acrylic badges I've been making is the
artwork displayed in the center. In order to get quality results, here's
a bit of information on how to put together artwork for them.

Engraving is done on my CNC machine with a V-bit. Instead of a typical
cutting device's flat end, it is shaped in a V. This allows it to cut
smaller or larger holes depending on how far down it is plunged into the
material.

It is by far the easiest for me to use SVG (or other vector) formats.
Unlike bitmaps, it is easy to tell the software what shapes to cut.
Primarily artwork should be lines or outlines of the desired shapes.
Color is irrelevant in SVGs. If done as a bitmap, color is important
and used to identify edges.

### Lines

When using lines, the variation in thickness will show up. Lines should
generally remain as thin as needed. Smaller lines will still have a
great contrast against the background. As lines get thicker they also
get deeper into the acrylic. However, thicker lines can be extra
contrast where needed. Note that because light comes down from the top,
the upper part of the groove will be brighter than the lower part.

{{<img "line_thickness.jpg">}}

This is an extreme example of how thinner lines can look much cleaner.
The first frame was a result of a poor tool choice but does demonstrate
how thick lines make the whole thing look busy. Even the right frame
has lines slightly thicker than they could be.


### Filled Shapes

We can do a lot with filled shapes depending on what's needed.
Let's look at some examples. This SVG file is from
[Wikipedia](https://en.wikipedia.org/wiki/File:Black_Paw.svg).

{{<img "paw.svg">}}

All of the details are done as outlines of the desired lines. A large
filled area does not always mean the entire area will be engraved! The
software I use to process files allows me to select how to engrave
things. Typically trying to engrave a large area results in an ugly
texture. It is almost always better to have a much thinner line instead.

{{<img "engraved_paw.jpg" "Ignore the poorly aligned engraving …">}}

While all of these started out as solid and similarly sized filled
areas, there is clearly a difference in how they were engraved.

Going from the upper left, the first one was a typical engraving. It
was engraved inwards at a maximum width of 0.1 inches. This is
a relatively wide engraving but useful for making certain items have a
very visible line. The next one was set so it would engrave the entire
interior. As you can see, because it is a V-bit, there is a lot of
material left and it looks quite poor. While it is possible to pass over
the same area many times it often isn't worth it. The edge lighting
effect is definitely best with fewer and more important lines. The third
one was an outwards engraving, with a relatively large set width. It
automatically stops as soon as it hits another object or path,
preventing it from removing other details. Because it's so big, it
doesn't have the same sharp and clean feel of the smaller engravings.
The fourth is the same as the first except with an outwards engraving.
It does not have a very different look, it is just larger. The final
middle one is a standard 0.039" engraving. This is generally the default
because it is small enough to look sharp but still large enough to
properly glow.

### Trying Yourself

If you're curious on how something would look,
[send me a message](https://syfaro.net/#contact). I'm happy to give more
feedback or to try engraving your design.

If any artists feel like this kind of line work is something they're
good at please send me a message! I'd love to work something out to
provide a high quality source of artwork for these badges. I'm hoping
to start selling them soon and would prefer using artwork that was
designed for engraving.

BIN
content/blog/led-badges-artists-guide/line_thickness.jpg View File

Before After
Width: 4032  |  Height: 3024  |  Size: 2.4 MiB

+ 38
- 0
content/blog/led-badges-artists-guide/paw.svg View File

@@ -0,0 +1,38 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
version="1.0"
width="425.82123"
height="399.03754"
id="svg2">
<defs
id="defs4" />
<g
transform="translate(-710.9656,-414.3609)"
id="layer1">
<path
d="M 921.33923,581.4693 C 945.36353,584.27464 973.71809,589.6455 986.40253,612.87765 C 995.6648,626.57267 1003.7277,641.26166 1015.279,653.24382 C 1035.7532,663.60408 1056.1522,676.04565 1070.8414,693.94741 C 1089.2763,721.51248 1083.6942,760.99615 1062.266,785.20268 C 1038.2723,807.17013 1003.7375,818.14446 971.75652,810.0172 C 951.31544,805.93057 930.93359,793.90449 909.66578,800.62274 C 889.99236,806.14399 870.46821,814.84312 849.51687,812.50934 C 829.60034,811.83437 811.73024,802.09401 794.97628,792.30024 C 775.44222,779.76141 763.23668,757.08888 764.55963,733.79231 C 764.62666,698.81964 790.92003,669.8259 820.53018,654.47663 C 833.16712,648.33493 846.4345,641.6636 852.44174,628.0246 C 861.0311,612.29062 868.56527,592.52738 887.64973,587.16149 C 898.42005,583.24249 909.91959,581.67166 921.33923,581.4693 z "
style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
id="path2078" />
<path
d="M 713.47645,547.66498 C 718.60622,529.65041 733.14771,512.98638 752.45374,510.54814 C 766.25651,508.76788 780.53967,512.2727 792.69123,518.79019 C 814.85189,533.5487 827.75076,558.53142 835.04425,583.46969 C 838.72024,595.39486 841.22091,608.14495 838.19192,620.50945 C 835.39262,635.11152 824.80135,647.48388 811.17146,653.17621 C 793.46782,663.81899 769.99193,662.3797 753.11174,650.74617 C 743.07136,644.09626 734.17395,635.41674 728.77377,624.537 C 715.98478,601.47388 707.35862,574.07004 713.47645,547.66498 z "
style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
id="path2040" />
<path
d="M 427.14286,81.071428 C 427.14286,81.071428 456.60714,81.249999 472.85714,118.92857 C 472.85714,118.92857 484.07022,143.36574 480.17857,180.89286 C 480.17857,180.89286 479.56992,218.67252 457.09403,234.07734 C 457.09403,234.07734 426.53691,261.85654 391.43411,224.48089 C 391.43411,224.48089 366.93791,198.21693 362.13969,161.09382 C 362.13969,161.09382 356.83639,122.70802 380.57497,99.727053 C 380.57497,99.727053 400.71429,80.892856 427.14286,81.071428 z "
transform="translate(452.8571,333.7907)"
style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
id="path2071" />
<path
d="M 571.96429,86.785713 C 571.96429,86.785713 608.21429,97.499999 604.28572,138.92857 C 604.28572,138.92857 606.34407,172.2055 586.64609,202.51008 C 586.64609,202.51008 566.69558,239.88572 540.17907,243.92633 C 540.17907,243.92633 510.88465,253.0177 489.67145,208.06591 C 489.67145,208.06591 474.51916,157.05321 498.00521,122.70802 C 498.00521,122.70802 525.42633,71.76157 571.96429,86.785713 z "
transform="translate(452.8571,333.7907)"
style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
id="path2073" />
<path
d="M 1105.3571,522.71927 C 1122.3699,527.91884 1134.3823,544.37469 1135.8951,561.8676 C 1137.5366,577.58634 1133.8163,593.38683 1128.5248,608.09948 C 1119.9151,629.61108 1104.3982,648.41646 1084.7667,660.735 C 1069.931,668.83247 1051.4329,665.39611 1037.8534,656.31786 C 1032.2984,653.65662 1028.9128,648.61483 1026.5204,643.12189 C 1017.4781,625.13003 1016.2091,603.22962 1024.4274,584.70277 C 1031.3743,567.25634 1039.9227,549.45024 1054.5745,537.16263 C 1065.6833,527.06623 1080.2017,518.81999 1095.7307,520.43746 C 1099.0213,520.77159 1102.2644,521.54838 1105.3571,522.71927 z "
style="fill:#000000;fill-rule:evenodd;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
id="path2075" />
</g>
</svg>

Loading…
Cancel
Save