Kibou Niji Rengou Rainbow Fighters Reborn. How to Make Ribbons, Part II.

As promised last week, I will now explain how to extend the method described here to create more complicated curved gradients and shapes in Inkscape, as those shown in the last two logos above.

First, let's sum up the method as described in the link I gave you:

1. Create a narrow rectangle (with a width-to-height ratio of at least 1:4, although you can change alter that after the fact) with the desired gradient.
2. Clone it (Alt+D), and convert this clone into a marker (in the menu Object > Objects to Marker).
3. Create a path (either directly via one of the path tools, or using the objects and then using Object to Path, Shift+Ctrl+C).
4. Add plenty of nodes to the path (with the path selected, push F2, select all the existing nodes, and then click a few times on the icon with the + sign "Insert new nodes into selected segments).
5. In the Fill and Stroke dialog box of the object, choose the Stroke style tab. For the 3 Markers boxes (Start, Mid and End) choose the newly created marker (it will appear as "marker####" on top of the list).
6. You can modify the original rectangle (and its gradient) and/or the path to get the effect you want

While the method in general is fine, I use it with a few enhancements that, in my experience, make it even easier to use:

• I always add the markers before I add nodes to the path. The reason is that adding plenty of nodes can slow down some computers (Inkscape is relatively heavy when it comes to memory and CPU usage) and adding the markers before adding nodes helps me decide when I have enough nodes, so that I don't overdo it.
• The method works best with a path without sharp turns. A smooth path will give better results than a jaggy one. Usually, I handle that by first running the Simplify tool on the path (Ctrl+L) and then setting the nodes to auto-smooth (press F2, select all the nodes, and click on the auto-smooth icon, which you can find on the Nodes toolbar by checking the buttons' tooltips. On my computer, it's the tenth button from the left). After those two steps, the resulting path is usually smooth enough, although a little bit of manual tweaking may sometimes be needed as well.

Now, this method works fine, but it only allows one to make simple curved gradients like the ones in the first two logos above. What if you want a ribbon with an edge, or with a special tip, like in the last two logos above? The trick here is that in Inkscape you can transform any object into a marker, i.e. not only simple basic objects like rectangles, but also complex paths, and even groups! Also, you can use a different marker for the start or the end of a path, allowing one to create special markers for the tip of the ribbon. As long as the markers have all the same height and the same gradient, the illusion of a continuous curved gradient will be kept.

In the case of the third logo, for instance, I made three markers, each a group of two rectangles, one with the gradient, and a slightly taller and thinner black one, behind it (you can do that using a combination of Raise or Lower, Page_Up and Page_Down, and Align and Distribute, Shift+Ctrl+A). Just move the back rectangle behind the rectangle with the gradient to form a black edge until you're satisfied with the result. You can then group the two rectangles into a group (just select them and use Ctrl+G) and turn the group into a marker (you can clone it first if you want, but in my experience cloning doesn't work as expected with groups: the clone isn't modified when you modify the original. So you might as well just duplicate the group, Ctrl+D). A vital thing here is that the black rectangle should be taller, but thinner than the rectangle with the gradient. The idea is that the gradient bleeds over, and will look like a continuous stripe when you add the marker to the path. If you don't, you may get black stripes across your curved gradient.

In the case of the last logo, I kept the start and mid markers I had created for the third logo, but created a more complicated shape for the end marker, a wedge-like shape with the same height as the other markers. In this case as well the actual marker is a group of two shapes, one with the gradient, and a black one behind it to form the edge. I also had to tweak the path a bit so that the end marker would align correctly with the other markers on the path (it was wider than the other markers because of its shape, so any misalignment on the path becomes more visible with such an end marker).

Well, that's about all I can say about this method of making curved gradients in Inkscape. I encourage you to experiment with shapes, gradients, paths and markers and see for yourself what you can do with it. It does have its limits, but with a bit of imagination you can do quite a lot with it. Don't hesitate to ask for more info in the comments, and don't forget that the poll will end next week! If you want your favourite logo to become the official logo for the new series, don't hesitate to give me your vote!