City Symbols (Part 11): More Torfani Features

In the previous posting, I started adding city icon features I need to replicate the icons in the Torfani reference map.  The next thing to look at is the city wall which appears in the icons for large cities:

The city walls in these icons are quite complex.  They're not uniform rectangles, but instead seem to follow the land or flow around buildings.  Sometimes the top is fairly straight but the bottom is not; sometimes the bottom is fairly straight and the top is not; and sometimes both the top and the bottom vary.  They have some shading to indicate that they aren't flat, and likewise the sides of the walls are sometimes slanted to suggest they're wider at the base than at the top.  Many of the walls have openings to represent doors or passageways.

Back in Part 5 of this series I developed a basic wall:

shown here with battlements and doors.  To start with, I want to make the wall less linear.  To do that I'll perturb the baseline of the wall in much the same way I perturb mountain outlines, and tweak the perturbation parameters until I get something that looks reasonable.  Here's an initial effort:

In the Torfani icons, the wall looks to be more than one story high, so here's a slightly larger version with battlements:

This seems to look okay, although I'll withhold full judgment until I see it in an icon.  I'm always vaguely dissatisfied working with noise for things like this -- by it's very nature it is difficult to get something that looks good all the time.  I might be better off with some more limited but intentional way to add contour to the wall.  With my mountain symbols, I ended up with a mix of both types.

In the Torfani icons, the wall also has shading where it is turned away from the light.  In Dragons Abound the light comes from the right side, so the wall is turned away from the light where it angles downward on the map.  I can detect these spots by walking along the top or bottom of the wall and measuring the slope.   Then it's a matter of constructing a shading area and filling it in with a darker color:

I can't say I much like the look of this.  Let's call it a work in progress.

Another approach the Torfani artist used was to place lines to indicate the wall structure.  The general idea is to put a vertical line at points where the wall changes direction substantially.  To do this, I walk through the topline of the wall, and wherever the slope of the wall shifts significantly, I draw a line to the corresponding point on the baseline of the wall.

This can be made more subtle and effective by fading out the line from top to bottom (and/or the reverse).

The wall shading I tried above looks better if I tone it down and combine it with the inflection lines.

Taken together, this is starting to look pretty good.  One casualty here is that the door is no longer "carved" out of the wall to reveal what is behind the wall.  That's probably not a big loss.

Now let me tackle making the wall wider at the base than at the top.  This shows up primarily in the side profile of the wall, which I can accomplish just by pushing the ends of the baseline of the wall out a bit:

However, that leads to a slight inconsistency when I turn on the inflection lines.

The inflection lines still go straight up and down.  It would be better if the lines became increasingly more angled as they near the edges of the wall.  To do this, I need to stretch the baseline rather than just pad it on each end.  That's not too hard to do -- I just multiply the X value of each point on the baseline with a stretch ratio (greater than 1) and then shift it backwards to keep the baseline centered.

Now the inflection lines (and the wall shadows) reflect the slant of the wall.  I may need to come back and tweak walls when I see them used in a city icon, but for now I think this is sufficient.

The next feature to implement are the pennants flying above some of the buildings in the Torfani icons.  To start with, I'll implement spires.  These are just pointed lines straight up from the center of the roof:

Pennants are essentially triangles on the top of the spires.  The triangle sticks out to one side or the other, and it usually angles downward.  The triangle is about 2x as long as it is tall.

Let me add a color to the pennants to make them stand out a little better.

This looks pretty good, but it's a bit more artistic to add a little downward curve to the flag.  I have to take a straight line and turn it into a curve in many places in Dragons Abound -- such as along the bottom of a circular building.  So it's pretty straightforward to take the two lines of the pennant and a dip to them.

The Torfani icons also have some pennants that are shaped like a swallow's tail.  If you're thinking it's overkill to implement a second pennant shape for such a tiny detail you probably haven't been reading this blog for long ;-).  To start off with, I'll add rectangular flags.

A swallow tail requires cutting a triangle out of the end of the rectangular flag.

If you're thinking that implementing three different pennant shapes is sufficient overkill then you really should go back and re-read the earlier parts of this blog.  Because as long as I have pennants, I might as well implement flags.  To start with, I can have a flag with a circle on a different-colored background (like the Japanese flag):

Even at this very small size, the flag detail is visible.  Another flag option is a vertical stripe in the middle of the flag:

Unfortunately, at map scale that's not really distinguishable from the circle.  A horizontal stripe works better:

Another version that's distinguishable is a flag divided into two triangles:

Normally I intend to use the flags to distinguish different nations -- all the cities of a nation will fly that nation's flag.  The combination of different colors and flag types should help make them distinct.  But here's an example of a mix of different flags:

It's fun to see just how much can be accomplished at this tiny scale.  Now you can accuse me of overkill :-).