Rosehill's Graphics Galore - Currently closed!

This forum is for art shops

Moderator: Hall of the Arts Moderators

Re: Rosehill's Graphics Galore - sig set tutorial up!

Postby Rosehill » April 22nd, 2011, 3:13:53 pm

No finished requests yet, but here's the signature set tutorial. I'll put it on the first page as well if I can fit it on some post... :wat:

Here are also a couple of links to some userbar and antipixel generators if you want those kinds of graphics and want to create them yourself (faster than waiting for someone else to do them, in some cases also cheaper :derr: ). The userbars and antipixel buttons that I do are done manually, but the generators do scaringly similar ones (and sometimes even better XD).

Antipixel button generator, makes "flat" basic antipixel buttons
Antipixel button generator, has more options than the other one, does pretty similar to what I do
Userbar generator (click "Start generator" from the top left to acces the generator)

Here's the signature set made during the tutorial:

Image
Text and creatures
And links
And banners
And enough
Other stuff here.
So they
Will push
The lower image
To the bottom.
Image



Signature set Tutorial
I use Adobe Photoshop CS3 to make all my graphics so this tutorial is for that one as well. The process itself is quite simple so I see no reason why the steps described here wouldn't work on GIMP or Paint Shop Pro or other graphics programs with layer and brush capabilities, though you might need to use tools with different names or something. I'm not that familiar with other graphics programs. :P

The images are a bit too big for the thread so I've included links to the same images is you want to view them separately.

1) Preparation
Image
(Link to picture)

I create a new document with width of 620px and height of 300px and transparent background. I color the background with #e4e4b4 which is the colour of Magistream's threads' background. The background layer won't be included in the final signature set, but I like to have it in the working phase as I can then see how the set will look like in an actual post.

I create a few guides to help me with the positioning of elements. Most of my signature sets are a standard size: side bars are 300px tall and 120px wide and top and bottom bars are 50px tall and 360px wide, so I create vertical guides at 120px and 500px (these line the side bars). I also make a second set of vertical guides at 130px and 490px. These line the top and bottom bars. As you notice, there is a 10px gap between the guides. I do this in order to make the set fit. If I just cut the image from the 120px and 500px guides, the top and bottom bars would be pushed under the side bars and wouldn't show up on the signature. I've used gaps of 5px as well, but I prefer the 10px. Then I make two horizontal guides, at 50px and 250px to finish lining the top and bottom bars. The 50px height is just my preference, I've made sets with taller as well as shorter horizontal bars.

The 620x300 set will show correctly on posts. If you want to make a set that will show correctly on PMs and signature preview as well, start with a document of 490px x 300px. The horizontal bars I have on the smaller signature sets are 240px wide, so the guides would be at 120px, 125px, 365px and 370px vertical and 50px and 250px horizontal. Of course, these are again just preferences, the sig sets can be virtually any size as long as they stay within the size limits of the signature area.


2) Putting the creatures in
Image
(Link to picture)

I open the image of the creature I want to use, copy it and paste it onto my working document into a new layer. I position it the way I figure I want it in the set and then either place a different creature on the other side or the same one (on a new layer, again), only flipped the other way around so the creatures are mirroring each other.

I then open the image of the creature I want to use on the top and bottom bars (if I want to, sometimes I won't put a creature there) and again position the image or images the way I want (each creature on its own layer). Sometimes the positioning changes throughout the process if I feel like the creature images should be in another way, so consider the first positioning as the sketching phase.

(You might notice that my bottom guide is on a bit higher than it was on the first picture. This is due to the Amphista hatchling sprite being 53px tall so it wouldn't fit inside my 50px area, so I made the bottom area 55px tall.

3) Putting all other stuff in
Image
(Link to picture)

Now we'll get to the real action! I create a new layer under the creature layers but on top of the background layer. I pick a couple of colours, usually by using the eydropper tool on a zoomed in picture of the creature. That way I can keep to the colour theme of the creature and the style of the signature set stays consistent on that part.

I choose a brush I feel suits the creature and the feel I want for the set and plop the brush down under the left side creature. I may then change the dimensions of the brush or rotate it or flip it to get it fit like I want it to.

4) I repeat step 3 as many times as I feel like with different colours and different brushes every time on a new layer until I'm satisfied with how the left side of the set looks like.
Here's an animation of what kind of brush layers the Amphista sig set's sides have from bottom to the top:
Image
(Link to picture)

5) If I want the same kind of sides I duplicate all the layers made in steps 3 and 4, flip them horizontally and drag them to the right side. If I want a different kind of right side I'll repeat steps 3 and 4 until I have the right side done as well.

6) Using the same method as described in steps 3 and 4 I make the bottom or top bar, whichever I feel like doing first and then either duplicate it and flip it over or make the other one manually if I want it to be different than the other one.

7) Once I'm done with all the brush planting I take a look of the overall look of the signature set and do some final tweakings or repositionings if necessary.
Image
(Link to picture)

8) Breaking the picture in pieces
Image
(Link to picture)
Image
(Link to picture)

Now I have a finished signature set, but it's all in one big picture and can't be used like that. I make the background layer invisible so the actua thread background colour can be seen as the background once the set is in use and use the crop tool to cut the pieces according to the guides I've made. I save each separate piece as its own .png document to maintain the transparency.


9) Once I have all the four pieces of the signature set I upload them to my photobucket. Since the image addresses are so long I use bit.ly to shorten the image addresses and then place the short addresses to the correct places on the text frame I have for a signature set. All done! Hooray!

The text frame:
Code: Select all
[imgleft]left side image url here[/imgleft][imgright]right side image url here[/imgright]
[center][img]top image url here[/img]
Normal signature stuff is here
[img]bottom image url here[/img][/center]
Official MS Twitter | Official MS Facebook page

Meet Mr. Rufous Scrimgeour -->
User avatar
Rosehill
CreaturesTrade
Coder
Member of The Herbalist's Guild
Posts: 7299
Joined: July 24th, 2009, 4:03:51 am
Location: Northern Europe
Gender: Female

Re: Rosehill's Graphics Galore - sig set tutorial up!

Postby Noodles » April 22nd, 2011, 4:27:51 pm

OH MY GOSH. Thanks. Soooo much. (Where do you get your brushes, by any chance?)

Image
Image
Thank you...
PaleoMageEzibuttrandomnameHiddenMystic
Tanya9771beckyh2112P3PPYc0rnRilian
KetrillascreamyourselftinnidawgKyrare
GwinniFinlandiaBreAngelWolfwing
...for making Christmas a dream come true!

Image
User avatar
Noodles
CreaturesTrade
Member of The Herbalist's Guild
Posts: 5055
Joined: July 14th, 2010, 11:56:24 am
Location: Your Bed
Gender: Male

Re: Rosehill's Graphics Galore - sig set tutorial up!

Postby Rosehill » April 22nd, 2011, 4:36:04 pm

maginoodlesyum wrote:OH MY GOSH. Thanks. Soooo much. (Where do you get your brushes, by any chance?)


I have a list of the brush resources on the first page in this post (open the spoiler for "Credit and Resources"). I mostly use Obsidian Dawn's brushes (and patterns for other graphics), but may also use other brushes if I need something specific or if some brushes are especially pretty. I also have a couple of self-made brushes that I use occasionally. ^_^
Official MS Twitter | Official MS Facebook page

Meet Mr. Rufous Scrimgeour -->
User avatar
Rosehill
CreaturesTrade
Coder
Member of The Herbalist's Guild
Posts: 7299
Joined: July 24th, 2009, 4:03:51 am
Location: Northern Europe
Gender: Female

Re: Rosehill's Graphics Galore - sig set tutorial up!

Postby Noodles » April 22nd, 2011, 4:42:35 pm

Okay! Thanks! I'm making a sig set right now. (Or attempting. Failing miserably.) Can you take a look when I'm done?

Image
Image
Thank you...
PaleoMageEzibuttrandomnameHiddenMystic
Tanya9771beckyh2112P3PPYc0rnRilian
KetrillascreamyourselftinnidawgKyrare
GwinniFinlandiaBreAngelWolfwing
...for making Christmas a dream come true!

Image
User avatar
Noodles
CreaturesTrade
Member of The Herbalist's Guild
Posts: 5055
Joined: July 14th, 2010, 11:56:24 am
Location: Your Bed
Gender: Male

Re: Rosehill's Graphics Galore - sig set tutorial up!

Postby Feathersun » April 22nd, 2011, 8:54:36 pm

How to you make the quid lines??? Are the "brushes" just shapes/swirls that you recolor?? (I have never understood brushes)

If you see me on here, smack me and tell me to go write something

- Looking to take in ANY Osaths -
- Paying aprox 500g per birdy -
- I will take frozen, lineaged, named, adult, hatchling, 1,000,000 gen, or anything -
- I will gladly help hatch as well! Just send me the codes -

- ImageImageImageImage -
User avatar
Feathersun
CreaturesTrade
Member of Society of the Trident
Posts: 6106
Joined: October 20th, 2010, 8:13:44 pm
Location: On my awesome planet (my planet is in PST, BTW).
Gender: Kraken

Re: Rosehill's Graphics Galore - sig set tutorial up!

Postby Noodles » April 22nd, 2011, 11:45:59 pm

Feathersun wrote:How to you make the quid lines??? Are the "brushes" just shapes/swirls that you recolor?? (I have never understood brushes)

A lot of usermade brushes are simply stamps of squiggly lines, which makes it easy. You just stamp this shape, stamp that shape in a different color, etc.

Image
Image
Thank you...
PaleoMageEzibuttrandomnameHiddenMystic
Tanya9771beckyh2112P3PPYc0rnRilian
KetrillascreamyourselftinnidawgKyrare
GwinniFinlandiaBreAngelWolfwing
...for making Christmas a dream come true!

Image
User avatar
Noodles
CreaturesTrade
Member of The Herbalist's Guild
Posts: 5055
Joined: July 14th, 2010, 11:56:24 am
Location: Your Bed
Gender: Male

Re: Rosehill's Graphics Galore - sig set tutorial up!

Postby Feathersun » April 23rd, 2011, 12:11:38 am

I've been having some problems with the brushes...I'm not very good at this! :lol: No idea how to open them, or download them :sweat:

If you see me on here, smack me and tell me to go write something

- Looking to take in ANY Osaths -
- Paying aprox 500g per birdy -
- I will take frozen, lineaged, named, adult, hatchling, 1,000,000 gen, or anything -
- I will gladly help hatch as well! Just send me the codes -

- ImageImageImageImage -
User avatar
Feathersun
CreaturesTrade
Member of Society of the Trident
Posts: 6106
Joined: October 20th, 2010, 8:13:44 pm
Location: On my awesome planet (my planet is in PST, BTW).
Gender: Kraken

Re: Rosehill's Graphics Galore - sig set tutorial up!

Postby Rosehill » April 23rd, 2011, 3:48:28 am

Feathersun wrote:I've been having some problems with the brushes...I'm not very good at this! :lol: No idea how to open them, or download them :sweat:

Most brush sets come either as a zipped folder or as a file with .abr extension. Usually when you click a link that says "download this brush" or something similar asmall window pops up and asks if you want to save the file or open it (at least with firefox) or it saves it automatically on a certain folder.

Obsidian Dawn has some detailed tutorials how to install brushes to make them work. (The tutorials are for Photoshop and GIMP so if you have some other program you might want to google "install brushes [your program's name here]").

Unzipping zipped brushes
Installing brushes

Hopefully these help a bit. ^_^
Official MS Twitter | Official MS Facebook page

Meet Mr. Rufous Scrimgeour -->
User avatar
Rosehill
CreaturesTrade
Coder
Member of The Herbalist's Guild
Posts: 7299
Joined: July 24th, 2009, 4:03:51 am
Location: Northern Europe
Gender: Female

Re: Rosehill's Graphics Galore - sig set tutorial up!

Postby BMF » April 23rd, 2011, 10:18:55 am

Rosehill wrote:
Feathersun wrote:I've been having some problems with the brushes...I'm not very good at this! :lol: No idea how to open them, or download them :sweat:

Most brush sets come either as a zipped folder or as a file with .abr extension. Usually when you click a link that says "download this brush" or something similar asmall window pops up and asks if you want to save the file or open it (at least with firefox) or it saves it automatically on a certain folder.

Obsidian Dawn has some detailed tutorials how to install brushes to make them work. (The tutorials are for Photoshop and GIMP so if you have some other program you might want to google "install brushes [your program's name here]").

Unzipping zipped brushes
Installing brushes

Hopefully these help a bit. ^_^


MythicalDragon gave me the code to your epic Amphista signature set,thank you so much for designing it! I put credits ihn my signature! ^_^
User avatar
BMF
CreaturesTrade
 
Posts: 1522
Joined: October 31st, 2009, 8:50:07 pm
Gender: Male

Re: Rosehill's Graphics Galore - sig set tutorial up!

Postby Noodles » April 23rd, 2011, 6:27:45 pm

Hey Rosehill, since your favorite creature is the Narwhal (and I wasn't sure Light or Dark), I made you a signature set with 'em. Of course, they could never be as amazing as yours, but what the hey. I just learned (and from your tutorial, too). Can you comment/critique, too? :D


Image
Thank you so much Rosehill
for making everyone awesome
graphics for free!
This is a little
present I made
for you. Hope
you enjoy it!
I know it's not as good
as yours, but you're going
to have to deal with my suckiness.
Image

Code: Select all
[imgleft]http://bit.ly/f1ftSq[/imgleft][imgright]http://bit.ly/gBJIfN[/imgright]
[center][img]http://bit.ly/eZAf0f[/img]
Thank you so much Rosehill
for making everyone awesome
graphics for free!
This is a little
present I made
for you. Hope
you enjoy it!
I know it's not as good
as yours, but you're going
to have to deal with my suckiness.
[img]http://bit.ly/hSJyOL[/img][/center]


Also, I made this for Nebulasparks. Can you take a look too?

Image
Text and creatures
And links
And banners
And enough
Other stuff here.
So they
Will push
The lower
Image
To the bottom.
Image

Image
Image
Thank you...
PaleoMageEzibuttrandomnameHiddenMystic
Tanya9771beckyh2112P3PPYc0rnRilian
KetrillascreamyourselftinnidawgKyrare
GwinniFinlandiaBreAngelWolfwing
...for making Christmas a dream come true!

Image
User avatar
Noodles
CreaturesTrade
Member of The Herbalist's Guild
Posts: 5055
Joined: July 14th, 2010, 11:56:24 am
Location: Your Bed
Gender: Male

PreviousNext

Return to Seller's Gallery

Who is online

Users browsing this forum: No registered users and 3 guests