The Song Fight Bulletin Board

This thread could be a place where the Fightmasters lay out a style guide with information about how the logo works, the official Song Fight! colors/fonts/etc.

Here are some bits of info from Spud in another thread:

Spud wrote:[logo color]... Should be C60000

Spud wrote:If you study the original logo, you will see that the aspect ratio on the word "SONG" is different than the aspect ratio on the word "FIGHT!", in order to fit one over the other. This is part of what gives the logo its character (no pun intended).

Care to enlighten us about the font settings for "SONG" and "FIGHT!" when placed one on top of the other?

Spud wrote:When you string the[m] out into one long line (which I do NOT prefer for this reason, among others) ... No solid rules here. Just make it look good.

Spud wrote:On the other hand, I am not saying that every time the words SONG FIGHT! appear in cover art, they should be in IMPACT at C60000. Use your judgement. Often, that would just not work with the art, and that's fine.

See BLT, this is why I usually keep quiet. Now I have more work to do.

Lunkhead wrote:Care to enlighten us about the font settings for "SONG" and "FIGHT!" when placed one on top of the other?

I did it for the SFBase logo, but I forgotted. I think you just use Impact font and stretch. Pretty easy to figure out if you have a layered image program. Inkscape (free vector graphics program) works great for this if you have to do even more font finagling. But I'm pretty sure I just used Paint.net.

Personally I think it would be much more user friendly if the logo, at least on the Web, were done just using text and CSS. Then anybody could just "Inspect Element" in their favorite browser and instantly see how it's set up. No guesswork required. And if someone needs to make an image out of it, they can just reuse the font settings from the CSS in their image editor.

You're such a programmer.

Lunkhead wrote:Personally I think it would be much more user friendly if the logo, at least on the Web, were done just using text and CSS. Then anybody could just "Inspect Element" in their favorite browser and instantly see how it's set up. No guesswork required. And if someone needs to make an image out of it, they can just reuse the font settings from the CSS in their image editor.

Show me such an implementation. Does every target device have Impact, or does everyone who supports the logo have to deliver it on the fly?

Also CSS doesn't provide a device-independent way to size text in the way that's necessary to reproduce the logo correctly.

Isn't the best way to reproduce it just, you know, save the image?

http://lmgtfy.com/?q=web+safe+fonts+impact

I could try to reproduce what you're doing in your image editor if you or anybody else would ever actually get around to putting some specific details about exactly what font settings you're using on here.

Spud wrote:See BLT, this is why I usually keep quiet. Now I have more work to do.

What makes you think I'd even be reading this lame ass thread? I have WAY more important things to do! porn

Lunkhead wrote:http://lmgtfy.com/?q=web+safe+fonts+impact

I could try to reproduce what you're doing in your image editor if you or anybody else would ever actually get around to putting some specific details about exactly what font settings you're using on here.

I'm pretty sure that the way you reproduce the SF logo is to have two lines of text, one reading

SONG

and one reading

FIGHT

and then you scale the line that says SONG to make its width match the line that says FIGHT.

And CSS still doesn't provide any way of safely and device-independently scaling text horizontally to match their horizontal-extents. (In fact the only thing I see is the CSS3 font-stretch selector which is both an optional component and leaves it up to the font rendering engine to make an appropriate font selection before it tries to do an actual stretch, which is probably not what you want. And it doesn't allow for numeric stretching anyway.)

Spud didn't need to make a recipe for creating the text because it's something he did visually, once, for the site. That image itself IS the template for how to make it yourself if you need it at a higher resolution for some reason.

(Also I take a very slight issue with Spud's use of RGB hex codes for the text color because that assumes things about the color space and so on, and doesn't map to offset printing where you'd want to use Pantone colors or something. But assuming sRGB is good enough.)

fluffy wrote:

Lunkhead wrote:http://lmgtfy.com/?q=web+safe+fonts+impact

I could try to reproduce what you're doing in your image editor if you or anybody else would ever actually get around to putting some specific details about exactly what font settings you're using on here.

I'm pretty sure that the way you reproduce the SF logo is to have two lines of text, one reading

SONG

and one reading

FIGHT

and then you scale the line that says SONG to make its width match the line that says FIGHT.

And CSS still doesn't provide any way of safely and device-independently scaling text horizontally to match their horizontal-extents. (In fact the only thing I see is the CSS3 font-stretch selector which is both an optional component and leaves it up to the font rendering engine to make an appropriate font selection before it tries to do an actual stretch, which is probably not what you want. And it doesn't allow for numeric stretching anyway.)

Spud didn't need to make a recipe for creating the text because it's something he did visually, once, for the site. That image itself IS the template for how to make it yourself if you need it at a higher resolution for some reason.

(Also I take a very slight issue with Spud's use of RGB hex codes for the text color because that assumes things about the color space and so on, and doesn't map to offset printing where you'd want to use Pantone colors or something. But assuming sRGB is good enough.)

What about !? That changes everything!

Actually fluffy, I think it is the other way around. You squash the FIGHT! to fit under the SONG, but don't worry, I am documenting it.
The only reason that I don't create a full-fledged style guide is that JB wouldn't follow it. I mean really. The SFBB The Song Fight Network? What's that???

p.s., regarding colorspace, I was talking about the web there, and operating on a "close enough" level of tolerance. There was a clear difference between what BLT posted and the color of the logo on the site. There have never been any print standards, since this whole operation started out in web space, but I could make some up if anyone is planning on printing something.

Yeah! I go my own crappy half-assed way!

(I contend it's better than that phpbb logo that was there.Harrumph.)

Here's an alternative logo for the forum, just for the heck of it. I had to cheat to make it fit, though.

You guys are so funny sometimes. If there is in fact "horizontal scaling" involved, and not just changing some font setting (like letter spacing) until things look right, that would be a problem. I guess I assumed the "scaling" was done with a font setting and that therefore it might be possible to reproduce the font setting using CSS font settings. That's unfortunate.

Anyway, for fun here are some links to examples of other company's branding/logo guidelines:

http://support.twitter.com/entries/77641
https://www.facebook.com/brandpermissions/
http://www.dropbox.com/developers/reference/branding
http://www.android.com/branding.html
http://www.apple.com/legal/trademark/gu ... rties.html

Lunkhead wrote:You guys are so funny sometimes. If there is in fact "horizontal scaling" involved, and not just changing some font setting (like letter spacing) until things look right

That is what everyone was saying, yes.

For you, Sam.
http://xtravar.org/sf/songfight.svg

*this post and linked logo have not been approved by anyone

........

It's not Song Penis. It's Dong Fight.

Manhattan Glutton wrote:It's not Song Penis. It's Dong Fight.

NO! That doesn't roll off the tongue good. snickers

.....plus it makes me picture something painful like this!

I know what a fucking style guide looks like.

fluffy wrote:

Lunkhead wrote:You guys are so funny sometimes. If there is in fact "horizontal scaling" involved, and not just changing some font setting (like letter spacing) until things look right

That is what everyone was saying, yes.

That is what you were saying fluffy, not everyone. The words Spud used that I quoted in the original post in this thread were about "the aspect ratio" which to me isn't 100% clear as to whether that means horizontal scaling of rasterized text or some font property that controls scaling or letter spacing. Spud is the primary source of definitive information on that, as far as I understand things, so what I think is really important is his description of how it works.

Spud wrote:I know what a fucking style guide looks like.

I don't think anybody said you didn't...? Are you responding to me putting links to other company's style guides in the thread? I found reading those pages informative, personally. Sorry if including them was insulting to you for some reason. My posting them really had nothing to do with you personally. I was trying to provide some helpful context for people who might read this thread. Sorry...?