Song Fight! Style Guide

Let us know when something isn't working correctly, or if you find a typo. Do not post complaints or suggestions here.

Moderator: Mods

Lunkhead
Owney
Posts: 5442
Joined: Sat Sep 25, 2004 12:14 pm
Instruments: many
Recording Method: cubase/reason/mac/tascam4x4
Submitting as: Berkeley Social Scene, Merisan, Tiny Robots
Location: Berkeley, CA
Contact:

Song Fight! Style Guide

Postby Lunkhead » Mon Jan 16, 2012 1:31 pm

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.
User avatar
Spud
Scrappy Dappy
Posts: 4742
Joined: Fri Sep 24, 2004 10:25 am
Instruments: Bass, Keyboards, eHorn
Submitting as: Octothorpe
Location: Seattle
Contact:

Re: Song Fight! Style Guide

Postby Spud » Mon Jan 16, 2012 2:24 pm

See BLT, this is why I usually keep quiet. Now I have more work to do.
"I only listen to good music. And Octothorpe." - Marcus Kellis
Song Fight! The Rockening
User avatar
Manhattan Glutton
Hachikō
Posts: 1521
Joined: Tue Feb 15, 2005 12:10 pm
Instruments: Angst
Recording Method: REAPER
Location: Madison, WI
Contact:

Re: Song Fight! Style Guide

Postby Manhattan Glutton » Mon Jan 16, 2012 6:04 pm

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.
If I had a dollar for every one of my songs j$ has called a 90s pastiche, I'd have $1 for every song I've written.

Nur Ein Archives | The New Ugly Podcast
Lunkhead
Owney
Posts: 5442
Joined: Sat Sep 25, 2004 12:14 pm
Instruments: many
Recording Method: cubase/reason/mac/tascam4x4
Submitting as: Berkeley Social Scene, Merisan, Tiny Robots
Location: Berkeley, CA
Contact:

Re: Song Fight! Style Guide

Postby Lunkhead » Mon Jan 16, 2012 7:13 pm

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.
User avatar
Manhattan Glutton
Hachikō
Posts: 1521
Joined: Tue Feb 15, 2005 12:10 pm
Instruments: Angst
Recording Method: REAPER
Location: Madison, WI
Contact:

Re: Song Fight! Style Guide

Postby Manhattan Glutton » Mon Jan 16, 2012 7:43 pm

You're such a programmer. :)
If I had a dollar for every one of my songs j$ has called a 90s pastiche, I'd have $1 for every song I've written.

Nur Ein Archives | The New Ugly Podcast
User avatar
Spud
Scrappy Dappy
Posts: 4742
Joined: Fri Sep 24, 2004 10:25 am
Instruments: Bass, Keyboards, eHorn
Submitting as: Octothorpe
Location: Seattle
Contact:

Re: Song Fight! Style Guide

Postby Spud » Mon Jan 16, 2012 9:03 pm

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?
"I only listen to good music. And Octothorpe." - Marcus Kellis
Song Fight! The Rockening
User avatar
fluffy
Boo
Posts: 9429
Joined: Sat Sep 25, 2004 10:56 am
Instruments: sometimes
Recording Method: Logic Pro X
Submitting as: Sockpuppet
Location: The Plaidlands (also, Seattle)
Contact:

Re: Song Fight! Style Guide

Postby fluffy » Mon Jan 16, 2012 9:24 pm

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?
Lunkhead
Owney
Posts: 5442
Joined: Sat Sep 25, 2004 12:14 pm
Instruments: many
Recording Method: cubase/reason/mac/tascam4x4
Submitting as: Berkeley Social Scene, Merisan, Tiny Robots
Location: Berkeley, CA
Contact:

Re: Song Fight! Style Guide

Postby Lunkhead » Mon Jan 16, 2012 11:10 pm

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.
User avatar
Billy's Little Trip
Odie
Posts: 12000
Joined: Mon Nov 13, 2006 2:56 pm
Instruments: Guitar, Bass, Vocals, Drums, Skin Flute
Recording Method: analog to digital via Presonus FireBox, Cubase and a porn machine
Submitting as: Billy's Little Trip, Billy and the Psychotics
Location: Cali fucking ornia

Re: Song Fight! Style Guide

Postby Billy's Little Trip » Mon Jan 16, 2012 11:47 pm

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
User avatar
fluffy
Boo
Posts: 9429
Joined: Sat Sep 25, 2004 10:56 am
Instruments: sometimes
Recording Method: Logic Pro X
Submitting as: Sockpuppet
Location: The Plaidlands (also, Seattle)
Contact:

Re: Song Fight! Style Guide

Postby fluffy » Mon Jan 16, 2012 11:53 pm

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.)
User avatar
Billy's Little Trip
Odie
Posts: 12000
Joined: Mon Nov 13, 2006 2:56 pm
Instruments: Guitar, Bass, Vocals, Drums, Skin Flute
Recording Method: analog to digital via Presonus FireBox, Cubase and a porn machine
Submitting as: Billy's Little Trip, Billy and the Psychotics
Location: Cali fucking ornia

Re: Song Fight! Style Guide

Postby Billy's Little Trip » Mon Jan 16, 2012 11:57 pm

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! :P
User avatar
Spud
Scrappy Dappy
Posts: 4742
Joined: Fri Sep 24, 2004 10:25 am
Instruments: Bass, Keyboards, eHorn
Submitting as: Octothorpe
Location: Seattle
Contact:

Re: Song Fight! Style Guide

Postby Spud » Tue Jan 17, 2012 12:16 am

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.
"I only listen to good music. And Octothorpe." - Marcus Kellis
Song Fight! The Rockening
User avatar
jb
Scrappy Dappy
Posts: 3559
Joined: Sat Sep 25, 2004 10:12 am
Instruments: Guitar, Cello, Keys, Uke, Vox, Perc
Recording Method: Logic X
Submitting as: The John Benjamin Band
Location: WASHINGTON, DC
Contact:

Re: Song Fight! Style Guide

Postby jb » Tue Jan 17, 2012 6:24 am

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

(I contend it's better than that phpbb logo that was there.Harrumph.)
User avatar
jast
Hachikō
Posts: 1153
Joined: Tue Jul 29, 2008 7:03 pm
Instruments: Vocals, guitar
Recording Method: REAPER, Steinberg UR44
Submitting as: Jan Krueger
Location: near Aachen, Germany
Contact:

Re: Song Fight! Style Guide

Postby jast » Tue Jan 17, 2012 8:42 am

Here's an alternative logo for the forum, just for the heck of it. I had to cheat to make it fit, though.
forum-logo.png
forum-logo.png (2.38 KiB) Viewed 1900 times
most of my music
Song Fight-related stuff I host: ZIP archives // Circle of Titles
Lunkhead
Owney
Posts: 5442
Joined: Sat Sep 25, 2004 12:14 pm
Instruments: many
Recording Method: cubase/reason/mac/tascam4x4
Submitting as: Berkeley Social Scene, Merisan, Tiny Robots
Location: Berkeley, CA
Contact:

Re: Song Fight! Style Guide

Postby Lunkhead » Tue Jan 17, 2012 9:17 am

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
User avatar
fluffy
Boo
Posts: 9429
Joined: Sat Sep 25, 2004 10:56 am
Instruments: sometimes
Recording Method: Logic Pro X
Submitting as: Sockpuppet
Location: The Plaidlands (also, Seattle)
Contact:

Re: Song Fight! Style Guide

Postby fluffy » Tue Jan 17, 2012 9:37 am

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.
User avatar
Manhattan Glutton
Hachikō
Posts: 1521
Joined: Tue Feb 15, 2005 12:10 pm
Instruments: Angst
Recording Method: REAPER
Location: Madison, WI
Contact:

Re: Song Fight! Style Guide

Postby Manhattan Glutton » Tue Jan 17, 2012 9:52 am

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

*this post and linked logo have not been approved by anyone
User avatar
Billy's Little Trip
Odie
Posts: 12000
Joined: Mon Nov 13, 2006 2:56 pm
Instruments: Guitar, Bass, Vocals, Drums, Skin Flute
Recording Method: analog to digital via Presonus FireBox, Cubase and a porn machine
Submitting as: Billy's Little Trip, Billy and the Psychotics
Location: Cali fucking ornia

Re: Song Fight! Style Guide

Postby Billy's Little Trip » Tue Jan 17, 2012 12:56 pm

:P........
Attachments
song dong.jpg
song dong.jpg (27.19 KiB) Viewed 1885 times
User avatar
Manhattan Glutton
Hachikō
Posts: 1521
Joined: Tue Feb 15, 2005 12:10 pm
Instruments: Angst
Recording Method: REAPER
Location: Madison, WI
Contact:

Re: Song Fight! Style Guide

Postby Manhattan Glutton » Tue Jan 17, 2012 1:03 pm

It's not Song Penis. It's Dong Fight.
If I had a dollar for every one of my songs j$ has called a 90s pastiche, I'd have $1 for every song I've written.

Nur Ein Archives | The New Ugly Podcast
User avatar
Billy's Little Trip
Odie
Posts: 12000
Joined: Mon Nov 13, 2006 2:56 pm
Instruments: Guitar, Bass, Vocals, Drums, Skin Flute
Recording Method: analog to digital via Presonus FireBox, Cubase and a porn machine
Submitting as: Billy's Little Trip, Billy and the Psychotics
Location: Cali fucking ornia

Re: Song Fight! Style Guide

Postby Billy's Little Trip » Tue Jan 17, 2012 1:16 pm

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! Image
User avatar
Spud
Scrappy Dappy
Posts: 4742
Joined: Fri Sep 24, 2004 10:25 am
Instruments: Bass, Keyboards, eHorn
Submitting as: Octothorpe
Location: Seattle
Contact:

Re: Song Fight! Style Guide

Postby Spud » Tue Jan 17, 2012 1:42 pm

I know what a fucking style guide looks like.
"I only listen to good music. And Octothorpe." - Marcus Kellis
Song Fight! The Rockening
Lunkhead
Owney
Posts: 5442
Joined: Sat Sep 25, 2004 12:14 pm
Instruments: many
Recording Method: cubase/reason/mac/tascam4x4
Submitting as: Berkeley Social Scene, Merisan, Tiny Robots
Location: Berkeley, CA
Contact:

Re: Song Fight! Style Guide

Postby Lunkhead » Tue Jan 17, 2012 2:19 pm

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...?

Return to “Quality Control”

Who is online

Users browsing this forum: No registered users and 1 guest