Font feedback

[auriond]

I've been worrying about the use of fonts in my game, as people keep telling me the fonts I'm selecting don't fit the graphics style of the game. So I tried to change it, but I'm not sure if the new font is any better. Any feedback on the change is welcome.

Here's the old font (above) and the new font (below) for comparison:



I'm still using the old font for dialogue though - think I should change it to the new font?

[Matti]

I don't have much to say but the new font is definitely better than the old one.

[auriond]

Thanks I guess I'm going with that then. Now to decide whether to use it for speech as well. I'm afraid with the serifs, it'll look even messier against the backgrounds.

[TerranRich]

You may want to consider a bolder or thicker typeface for the speech.

[auriond]

Thanks TerranRich. Here are some more options I tried out:

1. Liberation Sans


2. Tahoma


4. Trebuchet MS Bold


Liberation Sans looks clear, but the quotation marks come out as blocks in AGS for some reason. I like Trebuchet but it's a little smaller than the others. What do you think?

[Ryan Timothy B]

Out of the three, I prefer Trebuchet MS Bold.  It blends with the screen shot better than the others.
Then I'd have to say Liberation Sans as a second runner up.

[cat]

I'm not sure if it is really the font. In the dialog the font looks ok, i think its because of the color and the black outline.

The description text on the other hand is just plain white and does not have an outline (respectivly the outline is not visible because of the black background)

Have you thought of changing the color of the description text? White text on black background looks somewhat hard and cold. Could you use the yellow that is also used in the gui?

[TerranRich]

What happened to #3?

I agree that Trebuchet MS looks the best. As for the description text color, try out different colors. Avoid bright and saturated colors though. They'll end up looking cartoonish. Try a nice pale yellow, or a greyish blue, etc.

[LimpingFish]

TTF fonts used for speech tend to look a bit rough, regardless of font style. This is mostly down to AGS's lack of AA on TTF fonts when used for speech (when not displayed on an opaque GUI or text box).

I'm not really a big fan of any of the three, but Trebuchet seems the best.

[GarageGothic]

You could always write your own Say function that renders text as a graphical overlay similar to what I did. Basically I'm drawing the text 8 times non-antialiased at 1 pixel offsets for the outline and then drawing the interior text anti-aliased. I find that it looks a lot smoother than the built-in rendering of TTF fonts over transparent background:

Above: Custom rendering of text as graphical overlay.
Below: Text on GUI label. Note especially the 'a' and the 's' as less readable and the jaggies on 'v', 'w' and 'y'.

[auriond]

What happened to #3?

Eye kant kownt. Kant spel eyther.

For the description text, I agree that it looks rather cold, but it fits the character making the observations, so I'm pretty happy with that.

GarageGothic: That looks fabulous! The 's's look particularly good, but I'm afraid my scripting skills aren't exactly up to scratch. I have no idea how to even start doing what you're describing. Perhaps once I've finished the game and had some scripting experience under my belt, I'll try that out.

I guess the general agreement is to go with Trebuchet. Thanks for the input guys!

[GarageGothic]

If you ever want to use it, here's some code:

Code: ags

Overlay* CreateCustomTextOverlay(int x,  int y,  int width, FontType font, String text, int color, int outlinecolor, Alignment alignment) {
  Overlay* customtextoverlay;
  int textwidth = width-2;
  int textheight = GetTextHeight(text, font, textwidth-1);  
  DynamicSprite* customtextsprite = DynamicSprite.Create(width, textheight + 2, false);
  DrawingSurface* customtextsurface = customtextsprite.GetDrawingSurface();
  SetGameOption(OPT_ANTIALIASFONTS, 0);
  customtextsurface.DrawingColor = outlinecolor;
  customtextsurface.DrawStringWrapped(0, 0, textwidth, font, alignment, text);
  customtextsurface.DrawStringWrapped(1, 0, textwidth, font, alignment, text);
  customtextsurface.DrawStringWrapped(2, 0, textwidth, font, alignment, text);
  customtextsurface.DrawStringWrapped(0, 1, textwidth, font, alignment, text);
  customtextsurface.DrawStringWrapped(2, 1, textwidth, font, alignment, text);
  customtextsurface.DrawStringWrapped(0, 2, textwidth, font, alignment, text);
  customtextsurface.DrawStringWrapped(1, 2, textwidth, font, alignment, text);
  customtextsurface.DrawStringWrapped(2, 2, textwidth, font, alignment, text);  
  SetGameOption(OPT_ANTIALIASFONTS, 1);
  customtextsurface.DrawingColor = color;
  customtextsurface.DrawStringWrapped(1, 1, textwidth, font, alignment, text);
  customtextsurface.Release();
  customtextoverlay = Overlay.CreateGraphical(x, y, customtextsprite.Graphic, true);
  return customtextoverlay;
  }

This should generate a custom text overlay with a 1-pixel outline (if you use high-res coordinates for the game, otherwise insert "customtextsurface.UseHighResCoordinates = true;" before the DrawStringWrapped calls).