You are viewing our Forum Archives. To view or take place in current topics click here.
Forum Sig Knowledge Thread | How To Rate | Standard Sizing
Posted:
Forum Sig Knowledge Thread | How To Rate | Standard SizingPosted:
Status: Offline
Joined: Jul 07, 201014Year Member
Posts: 11,827
Reputation Power: 567
Created 8/14/11
[ Register or Signin to view external links. ]
stickied in 7 hours by TTG_Ranger, thanks a ton man 8)
Well hello there. Seems everyone in the graphics board is now in love with forum signatures, the new fad just like 8-bit was. Well, ill be the first to tell you, I aint the best at them, but its ridiculous to see how many people dont know what makes a good forum signature. So this thread is dedicated to users who wanna take some time and learn the basics of what makes a good forum sig. If you have any input to add, please post as I know I am no expert in these but I am making this to educate some of the newer users attempting them
What to look for in a forum signature:
I am going to cover each one of the subjects above. These are in no specific order needed in the creation process, I am merely listing them as I did in the above list. For simple demonstrations I will be using a generic render with no background or the like, but for more in depth demonstrations I will pull work from professionals, so my credit goes to them here.
Lighting:
Focal Points
Depth:
This will probably be shorter than the other sections simply because depth is almost equivalent to the focal point in attaining them. Blurring is the main way to attain depth imo. It adds a great feel to the signature and allows the render to stand apart from the background.
To achieve this via blurring, you can use any of the different blur types, but the most effective are the Gaussian Blur and Radial Blur. Gaussian Blur blurs all the background but keeps the image in tact but adjusts the focus on it as if you were adjusting a camera lens. Radial Blur accomplishes the same thing with focus, but it adds a spinning effect to it. The blurred portions seem to be in a radial pattern, hence the name Radial Blur.[/spoil]
Placement:
Font Choice:
Render Choice:
And so concludes my tutorial (if you wanna call it that, more of a knowledge thread) on forum signatures. I hope this clears up some confusion and can expand the knowledge of you interested in forum signatures. They are a tough hill to climb, but once you get the hang of them, they come easier and easier.
Feel free to add anything in if you want, post it and ill edit this thread and give you credit. I am open to any criticism you have with this post.
I also would like to add in these things that can be most helpful to some of you members here thanks to Ranger for the ok on editing these in here:
How to properly rate someones work
Constructive Criticism
The Difference Between Constructive Criticism and Flaming
Sizing for graphic design
Avatars
Signatures
Banners
Desktop Backgrounds
Web Design
Enjoi :coffee:
[ Register or Signin to view external links. ]
stickied in 7 hours by TTG_Ranger, thanks a ton man 8)
Well hello there. Seems everyone in the graphics board is now in love with forum signatures, the new fad just like 8-bit was. Well, ill be the first to tell you, I aint the best at them, but its ridiculous to see how many people dont know what makes a good forum signature. So this thread is dedicated to users who wanna take some time and learn the basics of what makes a good forum sig. If you have any input to add, please post as I know I am no expert in these but I am making this to educate some of the newer users attempting them
What to look for in a forum signature:
-Lighting
-Focal Points
-Depth
-Placement (Rule of Thirds)
-Font Choice
-Render Choice
-Focal Points
-Depth
-Placement (Rule of Thirds)
-Font Choice
-Render Choice
I am going to cover each one of the subjects above. These are in no specific order needed in the creation process, I am merely listing them as I did in the above list. For simple demonstrations I will be using a generic render with no background or the like, but for more in depth demonstrations I will pull work from professionals, so my credit goes to them here.
Lighting:
Lighting, though you may not think it is VERY important to a signature. Lighting gives a feel of realism to a sig and can bring it to life. If you look at a render, there will be hints of a previous light source from before the render was cut out.
The previous light source hints can be a great help in determining the placement of where to put your light source. The light source should be placed in the position that would be indicate where the traces of light are on the render for example:
The lighting of this render is on the right side of his shoulder and arm (you can see this in the gradual increase from left to right on lightness, ie: left is dark, right is light):
[ Register or Signin to view external links. ]
Now where would you place the light source? You may be asking yourself this. Well to get the most out of the realism, you would want to place the light source somewhere in the right side, whether it be bottom right, middle, top right (thats what I would suggest for this one, the brightest point is on his head, implying the light source is from above) is up to you. Just keep in mind the realism you want to get with the lighting.
How to create lighting is now up
There are a few ways, but the most common would be to use a foreground to transparent gradient (foreground usually being white) or a soft brush around 75-100px with a lowered opacity depending on how light you want it to show.
Examples would be:
Soft brush
[ Register or Signin to view external links. ]
Gradient
[ Register or Signin to view external links. ]
The previous light source hints can be a great help in determining the placement of where to put your light source. The light source should be placed in the position that would be indicate where the traces of light are on the render for example:
The lighting of this render is on the right side of his shoulder and arm (you can see this in the gradual increase from left to right on lightness, ie: left is dark, right is light):
[ Register or Signin to view external links. ]
Now where would you place the light source? You may be asking yourself this. Well to get the most out of the realism, you would want to place the light source somewhere in the right side, whether it be bottom right, middle, top right (thats what I would suggest for this one, the brightest point is on his head, implying the light source is from above) is up to you. Just keep in mind the realism you want to get with the lighting.
How to create lighting is now up
There are a few ways, but the most common would be to use a foreground to transparent gradient (foreground usually being white) or a soft brush around 75-100px with a lowered opacity depending on how light you want it to show.
Examples would be:
Soft brush
[ Register or Signin to view external links. ]
Gradient
[ Register or Signin to view external links. ]
Focal Points
I see this a lot, there are a ton of signatures that have potential, but lack a solid focal point. Even in my own designs I lack in a focal point. Reason being, they are extremely hard to determine where to put and how to get it just right for beginners in forum signatures.
Focal points are the main piece of the signature, what you want the focus and attention to be on. Just keep that in mind.
What can you do to make sure you have a good focal point? Lighting actually helps in this so if you read over the lighting section of this thread, keep that in mind. Proper lighting makes focal points easier to attain.
Another aspect is blurring. This goes hand and hand with depth of a forum signature. My preference when making a forum signature and going for depth and the focal point for a sig would be to blur the layers behind the render layers that you want to stick out. I would suggest using Filter<Blur<Radial Blur<Zoom and Best with the amount up to you.
When you do this, you end up with a focal point on the render like so:
[ Register or Signin to view external links. ]
Focal points are the main piece of the signature, what you want the focus and attention to be on. Just keep that in mind.
What can you do to make sure you have a good focal point? Lighting actually helps in this so if you read over the lighting section of this thread, keep that in mind. Proper lighting makes focal points easier to attain.
Another aspect is blurring. This goes hand and hand with depth of a forum signature. My preference when making a forum signature and going for depth and the focal point for a sig would be to blur the layers behind the render layers that you want to stick out. I would suggest using Filter<Blur<Radial Blur<Zoom and Best with the amount up to you.
When you do this, you end up with a focal point on the render like so:
[ Register or Signin to view external links. ]
Depth:
This will probably be shorter than the other sections simply because depth is almost equivalent to the focal point in attaining them. Blurring is the main way to attain depth imo. It adds a great feel to the signature and allows the render to stand apart from the background.
To achieve this via blurring, you can use any of the different blur types, but the most effective are the Gaussian Blur and Radial Blur. Gaussian Blur blurs all the background but keeps the image in tact but adjusts the focus on it as if you were adjusting a camera lens. Radial Blur accomplishes the same thing with focus, but it adds a spinning effect to it. The blurred portions seem to be in a radial pattern, hence the name Radial Blur.[/spoil]
Placement:
This is killer. So many signatures have great aspects to them, but are off in the rule of thirds, which put simpler is placement. Its easier to show the rule of thirds rather than to try to write a written explanation for it.
This picture demonstrates the rule of thirds:
[ Register or Signin to view external links. ]
The intersecting lines are where the positioning is best and is most appealing. Where the lines intersect creates the main focal positions of a signature. Now lets build on that focal point and depth piece I had brought up earlier. If you will notice the placement is bad in the previous one, it follows one of the gridlines, but it is at no intersecting point.
[ Register or Signin to view external links. ]
Now lets apply the rule of thirds and get it at a more appealing location. Using grids (these were just thrown on for quick demonstration, they are not measured out which I recommend they be for optimal location correctness) we can see better positioning as to where it was and where it is now, making the render placement just more appealing in general.
[ Register or Signin to view external links. ]
Now you can see the placement is more professional than it was before. The rule of thirds is commonly overlooked, but is key in making an appealing signature.
This picture demonstrates the rule of thirds:
[ Register or Signin to view external links. ]
The intersecting lines are where the positioning is best and is most appealing. Where the lines intersect creates the main focal positions of a signature. Now lets build on that focal point and depth piece I had brought up earlier. If you will notice the placement is bad in the previous one, it follows one of the gridlines, but it is at no intersecting point.
[ Register or Signin to view external links. ]
Now lets apply the rule of thirds and get it at a more appealing location. Using grids (these were just thrown on for quick demonstration, they are not measured out which I recommend they be for optimal location correctness) we can see better positioning as to where it was and where it is now, making the render placement just more appealing in general.
[ Register or Signin to view external links. ]
Now you can see the placement is more professional than it was before. The rule of thirds is commonly overlooked, but is key in making an appealing signature.
Font Choice:
This is a tough subject for me to explain because each designer has a different preference in fonts and what they think will blend well with the design. However I can tell you the way you want to use text in a signature can dictate what you should use.
If you are looking to put text in as a simple watermark or placeholder, I suggest using a simple font like Arial, Georgia, Times New Roman, Myriad Pro, etc on white or black (depending on the colors of the background) font color with the opacity turned down to somewhere around 10-30%, this gives it just enough to be visible, but also does not interfere with the design.
If you however are using it to be a piece of the signature, whether as a title of the signature that goes along with the design or w/e you are going to want to use a font that blends naturally with the feel of the sig and then also blend the text.
If you want to blend the text, make it match the background effects. Per say, you have a background flow or the smudging flow goes one way, your going to want your text to go that way too, so apply a blur or a smudge to go the same way. My favorite would have to be a motion blur on the text (Filter<Blur<Motion Blur). The angle and distance depends on how much you want it to be noticeable and which way the flow goes. Try to match the flow as much as possible.
If you are looking to put text in as a simple watermark or placeholder, I suggest using a simple font like Arial, Georgia, Times New Roman, Myriad Pro, etc on white or black (depending on the colors of the background) font color with the opacity turned down to somewhere around 10-30%, this gives it just enough to be visible, but also does not interfere with the design.
If you however are using it to be a piece of the signature, whether as a title of the signature that goes along with the design or w/e you are going to want to use a font that blends naturally with the feel of the sig and then also blend the text.
If you want to blend the text, make it match the background effects. Per say, you have a background flow or the smudging flow goes one way, your going to want your text to go that way too, so apply a blur or a smudge to go the same way. My favorite would have to be a motion blur on the text (Filter<Blur<Motion Blur). The angle and distance depends on how much you want it to be noticeable and which way the flow goes. Try to match the flow as much as possible.
Render Choice:
Render choice is a topic not much touched when constructive criticism is given on this board. Why? Because changing the render would result in redoing the whole signature. Sooooo its important to chose a nice render before you start.
What makes a good render?
-Action
-Catchy
-Easy to apply work to
-etc
Now these can all be summarized into whether the render is vulnerable to manipulation that fits or not. Good signatures contain renders that are of characters if you will, that are in motion, not just standing still or are in a boring position.
No bias intended but here is an example of a good and a bad render choice:
This is a boring render as there is not much to work with, its not a great choice because there is not much going on, making the subject less likely to be manipulated well.
[ Register or Signin to view external links. ]
This is a good render, as it is full of action and lighting, smudging, focal points, add ins, etc can be added very easily and can turn out very nicely.
[ Register or Signin to view external links. ]
What makes a good render?
-Action
-Catchy
-Easy to apply work to
-etc
Now these can all be summarized into whether the render is vulnerable to manipulation that fits or not. Good signatures contain renders that are of characters if you will, that are in motion, not just standing still or are in a boring position.
No bias intended but here is an example of a good and a bad render choice:
This is a boring render as there is not much to work with, its not a great choice because there is not much going on, making the subject less likely to be manipulated well.
[ Register or Signin to view external links. ]
This is a good render, as it is full of action and lighting, smudging, focal points, add ins, etc can be added very easily and can turn out very nicely.
[ Register or Signin to view external links. ]
And so concludes my tutorial (if you wanna call it that, more of a knowledge thread) on forum signatures. I hope this clears up some confusion and can expand the knowledge of you interested in forum signatures. They are a tough hill to climb, but once you get the hang of them, they come easier and easier.
Feel free to add anything in if you want, post it and ill edit this thread and give you credit. I am open to any criticism you have with this post.
I also would like to add in these things that can be most helpful to some of you members here thanks to Ranger for the ok on editing these in here:
How to properly rate someones work
Rating, it seems, has been something this board doesnt properly comprehend. I see, everywhere I go, an animated avatar that consists of a text layer and a black bg, get rated 9/10-10/10. There is no way in hell that it would be rated that high. Simple things like that are not hard to make, the fact that its getting rated that high is also demeaning to the creator. Constructive criticism, also known as CnC, helps build up the will to be a better designer. If someone rates a 10/10 on a piece, the designer takes nothing out of the piece that he/she can take away and look back on to improve for the next design.
Now for the rating scale, we should be realistic with it. Not ANYONE deserves a perfect 10. Why you ask? No im not just trollin. I say this because EVERY piece always has room for improvement. There is no such thing as perfection. Not in designing, not in ideas, no where in life is there perfection.
The scale should go in my opinion from 1 being the worst youve ever seen, to 10 the best youve seen. And when I say seen, I mean seen on the site, or any other site. And also that being said, that means you should realistically only have 1 piece rated as a 1/10 and only 1 piece rated as a 10/10.
Now for the rating scale, we should be realistic with it. Not ANYONE deserves a perfect 10. Why you ask? No im not just trollin. I say this because EVERY piece always has room for improvement. There is no such thing as perfection. Not in designing, not in ideas, no where in life is there perfection.
The scale should go in my opinion from 1 being the worst youve ever seen, to 10 the best youve seen. And when I say seen, I mean seen on the site, or any other site. And also that being said, that means you should realistically only have 1 piece rated as a 1/10 and only 1 piece rated as a 10/10.
Constructive Criticism
Constructive criticism is the basis of a lot of the learning process. You do a design, get feedback, correct the errors people find in it and start the process over again. The only way you can develop as a designer.
Constructive criticism is meant to help, not harm. This would mean giving tips on the design, like lower the opacity to 73%, add a slight inner shadow, or increase the tone around the focal point, seems a tad dull. Things like that are perfect CnC because the focus on the specific things that can be fixed or improved upon.
When giving constructive criticism, try to be as specific as possible
Constructive criticism is meant to help, not harm. This would mean giving tips on the design, like lower the opacity to 73%, add a slight inner shadow, or increase the tone around the focal point, seems a tad dull. Things like that are perfect CnC because the focus on the specific things that can be fixed or improved upon.
When giving constructive criticism, try to be as specific as possible
The Difference Between Constructive Criticism and Flaming
As I have seen MANY times, there is a huge difference between CnC and flaming. It is not a blurred line with neutral zones either, its a fine line dividing the two. They are opposites and should not be confused with each other.
CnC- The helping hand in the learning process from others. This helps the designer develop with a positive attitude that keeps them loving what they do all while improving at the same time.
Flaming- The degrading of the designer via insults and other hurtful methods. This does NOT help the designer develop at all. If anything, it hurts the learning process as it lowers the designers self esteem and confidence in their work. Flaming causes a lot of stress in a designer and can cause them to not love what they do.
CnC- The helping hand in the learning process from others. This helps the designer develop with a positive attitude that keeps them loving what they do all while improving at the same time.
Flaming- The degrading of the designer via insults and other hurtful methods. This does NOT help the designer develop at all. If anything, it hurts the learning process as it lowers the designers self esteem and confidence in their work. Flaming causes a lot of stress in a designer and can cause them to not love what they do.
Sizing for graphic design
Avatars
There is no set size for avatars on TheTechGame and most other sites because the site will automatically resize them.
For designing purposes, if you want to view the design with the most detail and also close to the size of the avatar, I suggest your canvas be 150x150 (my personal preference)
For designing purposes, if you want to view the design with the most detail and also close to the size of the avatar, I suggest your canvas be 150x150 (my personal preference)
Signatures
Signatures here on TTG are different than standard signatures. The TTG size is 340x40
Standard forum signature sizes (off sites, other than ttg) are 350x125 (someone comment if I am wrong and I will fix it)
Standard forum signature sizes (off sites, other than ttg) are 350x125 (someone comment if I am wrong and I will fix it)
Banners
The size of the TTG banner size is 468x60
Desktop Backgrounds
Web Design
Functional pages are enhanced when coded, but for mock designs, it is all up to the users preference. I like anything around 700x500 horizontal (so thatd be 500x700 vertical for all you guys) to 900x700 horizontal (700x900 vertical)
Those are my preferences for mock designs, yours may vary from mine, there are no set standard for what your preference is.
Those are my preferences for mock designs, yours may vary from mine, there are no set standard for what your preference is.
Enjoi :coffee:
Last edited by Bap ; edited 1 time in total
The following 97 users thanked Bap for this useful post:
RepBandit (01-08-2017), Dreux (10-09-2016), Joyner (09-29-2016), Skates (09-06-2016), Arkani (08-19-2016), Tremonti (07-26-2016), TheNewWorld (05-15-2016), Lifting (01-26-2016), Effective (01-18-2016), Preferred (01-03-2016), GnR (10-10-2015), TwistedDesigns (09-17-2015), Strokes (09-12-2015), Abby (08-15-2015), QT (08-12-2015), FunctionEsports (08-08-2015), ItsMuskrat (06-28-2015), Banq (06-24-2015), Aspi (06-24-2015), FortyTwo (05-10-2015), CJ (05-09-2015), bdgr (04-29-2015), zuLUQS2j8G (04-17-2015), Lia (03-27-2015), Skittle (02-18-2015), Spire (02-12-2015), Sys (02-07-2015), NoDoubt (02-02-2015), Zef (01-18-2015), Josh (01-07-2015), Pulsation (12-31-2014), Bru (12-19-2014), Reversing (12-08-2014), imagine- (11-15-2014), Tend (11-14-2014), Giga (10-31-2014), Slots (10-25-2014), BIur (10-22-2014), j0sh (09-11-2014), Contrabvnd (08-16-2014), Cartier (08-12-2014), Crim (08-08-2014), Tom (07-30-2014), squidgy (07-12-2014), PUR3V3NUM (07-11-2014), Fabel213 (06-13-2014), Kaspur (05-03-2014), Adamu (03-27-2014), Mazur (03-21-2014), x99 (03-08-2014), Katsumi (03-02-2014), -Jonesyy (02-21-2014), Slade_Wilson (01-24-2014), Daki (11-16-2013), Scorched (11-13-2013), lel (10-17-2013), Vera (10-15-2013), Disequality (09-26-2013), Kyzroh (09-10-2013), Krieg (07-27-2013), HopeDesign (05-29-2013), Zyphr (04-30-2013), Herz (04-21-2013), Zynx (03-21-2013), Emazed (02-17-2013), Cent (12-06-2012), x1NV1S1BL3x (11-28-2012), Tyler (11-04-2012), Mythic- (09-17-2012), xRancid (07-01-2012), Rodgers (06-05-2012), Vino (05-10-2012), Clear (04-07-2012), Zeqo (03-31-2012), Fib (03-29-2012), Hacz (03-15-2012), Combust (02-05-2012), Madiz88 (01-22-2012), Cute_Frag (01-18-2012), TTG-Drizzy (11-26-2011), Prowler (11-21-2011), KingNitro (10-21-2011), Haunted (09-20-2011), MangoMods (09-11-2011), WSMFP (09-01-2011), Kugryshev (08-18-2011), Sea (08-16-2011), Phoram (08-16-2011), iPatobo (08-15-2011), AngryHobo (08-14-2011), Nyan (08-14-2011), Zach (08-14-2011), corgi (08-14-2011), Nuka (08-14-2011), gusta (08-14-2011), Personalize (08-14-2011), Mosaic (08-14-2011)
#2. Posted:
Status: Offline
Joined: Oct 09, 201014Year Member
Posts: 3,227
Reputation Power: 183
Status: Offline
Joined: Oct 09, 201014Year Member
Posts: 3,227
Reputation Power: 183
Amazing topic this deserves a sticky,
Mosaic
Mosaic
- 12useful
- 0not useful
#3. Posted:
Status: Offline
Joined: Mar 19, 201014Year Member
Posts: 3,395
Reputation Power: 174
Status: Offline
Joined: Mar 19, 201014Year Member
Posts: 3,395
Reputation Power: 174
Definitely deserves a sticky...
- 4useful
- 0not useful
#4. Posted:
Status: Offline
Joined: Jan 30, 201113Year Member
Posts: 964
Reputation Power: 75
Great post man maybe we will see less Sh*ty forum sigs. I hope this gets a sticky.
- 2useful
- 1not useful
#5. Posted:
Status: Offline
Joined: Jun 12, 201113Year Member
Posts: 843
Reputation Power: 36
Status: Offline
Joined: Jun 12, 201113Year Member
Posts: 843
Reputation Power: 36
Great post! deserves sticky but i think some of the pictures are not working.
- 2useful
- 0not useful
#6. Posted:
Status: Offline
Joined: Feb 23, 201113Year Member
Posts: 2,514
Reputation Power: 143
Status: Offline
Joined: Feb 23, 201113Year Member
Posts: 2,514
Reputation Power: 143
Amazing topic.
This should get sticky.
EDIT: Very glad this got sticky.
Last edited by Personalize ; edited 1 time in total
This should get sticky.
EDIT: Very glad this got sticky.
Last edited by Personalize ; edited 1 time in total
- 3useful
- 0not useful
#7. Posted:
Status: Offline
Joined: Jul 07, 201014Year Member
Posts: 11,827
Reputation Power: 567
thanks for the feedback guys. its much appreciated.
Buried already? spent an hour and a half on this... guess this board is fine with mediocrity. oh well, doesn't affect me 8)
Buried already? spent an hour and a half on this... guess this board is fine with mediocrity. oh well, doesn't affect me 8)
- 3useful
- 0not useful
#8. Posted:
Status: Offline
Joined: Aug 02, 201113Year Member
Posts: 842
Reputation Power: 35
Very Helpful Topic This Can Help Many People Including Me When Making Forum Sigs. This Indeed deserves a sticky.
Signal
Signal
- 1useful
- 0not useful
#9. Posted:
Status: Offline
Joined: Mar 21, 201014Year Member
Posts: 1,100
Reputation Power: 51
Status: Offline
Joined: Mar 21, 201014Year Member
Posts: 1,100
Reputation Power: 51
Are the pics working for everyone else? They seem to be bad. Anyways, very helpful dude. Maybe make a section on smudging since thats a big part of sigs?
- 1useful
- 0not useful
#10. Posted:
Status: Offline
Joined: Dec 03, 201013Year Member
Posts: 1,763
Reputation Power: 82
Fantastic Bro. This deserves a sticky
Matthewx
Matthewx
- 1useful
- 0not useful
You are viewing our Forum Archives. To view or take place in current topics click here.