Final Fantasy Signature Tutorial
Welcome to this Final Fantasy Signature Tutorial. We will use the Filter Liquify tool to create some unique effect of flow, a light beam effect and we will grab two space stock pictures to achieve the final result. We used this render of the Final Fantasy Character Kain. The Space stock photos can be found on DeviantArt, links were provided below. More signature tutorials are coming soon, inspired by Roronis awesome work. Here’s the outcome of this Final Fantasy Signature Tutorial:
Start by creating a new signature, the size was set to 420pixels by 130 pixels.
We will use a spacestock as a background. Before you grab just about any picture, make sure the author has given permission for you to use it. You can find the Space Stock photo here. Resize it to fit somewhere nicely onto your canvas:
Place the Final Fantasy Render on your signature. Resize if needed:
We’re going to add some coloring. Grab a soft brush, and change the opacity and flow on the toolbar a little:
Brush toolbar:
Use the eyedropper tool to select a color on the canvas, and set it a little lighter. Brush into the direction that matches your render, in our case it follows the flow of his weapon:
Place the layer underneath the character. Optionally, you can set the blending mode to Color Dodge:
Now we’re grabbing another starry sky stock, and place this on top. You can find good Space Stock photos here.
Now change this layers’ blending mode to Lighten on your layer panel:
This should blend the stars into the background:
We’re going to be making some light beams with the elliptical marquee tool. Select the Elliptical Marquee Tool:
Make a selection somewhere near your character:
Now stroke this selection, by going Edit > Stroke, and set the color to white. Set the Width to about 3 pixels. Here are our settings:
Press OK, you should now have a white circle like selection going around:
Now apply an outer glow to this circle, by selection Layer > Layer Style > Outer Glow. Set the blend mode to Linear Dodge, and opacity to 100%, and select a bright color with the eyedropper tool:
Outcome:
We’re going to make some mor ebeams. Grab a soft brush:
And make two lines on your signature, following the flow of the character:
Apply the same Outer Glow to these lines:
Add some light brushing on top of the lines. We’re going to apply another outer glow to this to add some lighting:
Outer Glow settings ( Layer > Layer Style > Outer Glow):
This will give the beam a lighter touch. Optionally, you can set the blending mode to Color Dodge for a brighter result:
Finish up the beams, add some final glow and effects to the beams:
We’re going to use the Liquify function to create some “waves” around our character. First, Create a new layer, and apply the image (Image > Apply Image):
Now Select Filter > Liquify, and select the Forward Warp Tool in the top left corner:
Change the brush size in the top right corner to about 130 pixels, and start warping the layer to form some sort of beam:
Warp it into a shape that will fit around the character. Keep going untill you get an outcome you like:
Place the beam on your character, and erase the section covering the end of our Final Fantasy Kain character. This will make it seem as if the beam is going around our character.
Now Change this layers’ blending mode to Pin Light:
Time to fix some lighting. Apply the image on a new layer:
Now grab the burn or dodge tool, and start brushing and fixing some lighting:
Outcome:
Now we’re going to use the Liquify function once again, combined with the smudge tool to create some distortion in the bottom corner. Select the smudge tool:
Smudge, liquify warp forward tool until you like the outcome:
We’re going to apply a Selective Color. Obviously, you should select your own settings. However, here are our settings to illustrate a possible outcome. To create a selective color layer, select Layer > New Adjustment Layer > Selective Color:
Outcome:
We’re going to add some final finishing touches by applying a Color Balance adjustment Layer, and the dodge and burn tool to create some depth. First, add a color balance layer by selecting Layer > New Adjustment Layer > Color Balance:
I will not be displaying our settings, because our settings will not work unless you have the exact same colors. Just experiment with the settings.
Our outcome:
Optionally, you can use the smudge tool to distort the beam:
Add some text, finnishing touches, and you’re done!
We hope you’ve enjoyed this tutorial. Premium Members will now be able to download the PSD in the Premium Section. Join Now!
Responses to “Final Fantasy Signature Tutorial”
Trackbacks
Leave a reply
Advertisement
simple and nice
Wouldn’t call it simple, it took me long enough to figure out very advanced effects. The filter>Liquify > forward warp tool is an effect not often seen, Roroni did a good job trying to catch a unique effect and making full use of his options.
Yeah, it isn’t “simple”!
Its a great tag though.
Where the hell do I get the render.. Its a good one.
I wrote it down in the introduction of the tutorial. The render can be found here:
http://www.signaturestop.com/tutorials/finalfantasy/kainrender.png
good tut but my outcome was way better.
Haha well can’t wait to see it, please upload your outcome! I will be launching a competition soon where the best outcome will be rewarded with a premium membership!
@base: I will post my outcome too. Can the outcome just be similar [e.g. other color range] or is the nearest one the winner? anyway, here’s my sig: http://img503.imageshack.us/img503/5892/ffsig2coldblue.png
I have another version without some effects and a non-blue-render version:
http://i585.photobucket.com/albums/ss299/Dragonfly-Spamfather/FFsigblue.png
http://i585.photobucket.com/albums/ss299/Dragonfly-Spamfather/FFsig2.png
Dragonfly: I’m not sure how I’m going to pick the winner yet, however the purpose of the contest is Not to copy an outcome or image, but to create a good looking signature inspired by the tutorial, with for example the same filters or techniques used. With that said, I like your outcome
I will be launching the contest very soon, so be sure to enter your signatures! (every contestant can enter up to 3 times).
ok, base. can you send me the link then? I will try to make another one with another render and so on.
Cheers.
nice tutorial
i only did like 2 of the steps but heres my outcome XD
http://i392.photobucket.com/albums/pp5/Forgottenkings/seifer.jpg
For all the people saying it’s not a simple tut, maybe you should give up using photoshop/gimp
This is one of the most effective but simplest tut’s i’ve found in such a long time.
The outcome is great if you know how to use flow.
Great tut man, keep it up!
I’m having a hard time making Kain’s background transparent, because he comes in a black backround, and magic erasering everything is tedious. It seems you copied it on with the background already transparent, so is there a way I have to import the image?
I just copied it and pasted it into the canvas. :[
Also, when you add color in the 4th step, you seem to get this nice grainy feel, while I get this bold and stand-out outcome… I set the opacity and flow, and the color seems right, but I can’t blend it like you can.
One more question:
How did you apply the lighting on the beams? Didn’t work well for me.
Thanks!
Hey there Vincent,
I instructed in the render section that it’s best not to copy and paste the render, but to save file as, then open in photoshop. This way the image will remain transparant.
About the grainy feel, I’m not sure if you mean the Space Stock that was set to Lighten, or if you’ve just mistaken the low quality .gif file for a grainy effect
You’re going to have to give me a little more detail about the lighting on the beams, the beams in this signature were made exactly the way I explained it, use the a white brush and set an outer glow.
If there’s any more help you need please let me know
Nice Tut! I didn’t understand when you just said, use smudge and liquify.. But thanks for the nice tut
Encuentro que no sois derecho. Discutiremos. comprar cialis Un messaggio molto prezioso comprar cialis en andorra
is the competition up yet?
FML, used this as a base and worked on this for a good hour and a half, turned out great, probably my best ‘clean’ signature yet, and photoshop crashes. ._.
Very nice guide.
What font did you use? A download link would be helpful.
Though i’m quite new, I found the tutorial very helpfull and well written. Its good to know that the basic tools where usefull. Cause recently I’ve only been looking for “leet” brushes too make effects like these, and it didn’t turn out well. Anyway, thanks!
Keep posting your work, we love it!
In my photo, i’ve used both of the final fantasy signature tutorials as inspiration, and I am quite statisfied with my result. Though, I have been using your render (Kain, and Cp4-thingy)
Photo: http://i42.tinypic.com/neu8zr.jpg
for me, sigstop was down for a few months but now i’ll post my outcome. hope u guys like and i hope the competition will begin soon:
http://i585.photobucket.com/albums/ss299/Dragonfly-Spamfather/Spyrosig2hotred.png
http://i585.photobucket.com/albums/ss299/Dragonfly-Spamfather/Spyrosighotredtext.png
got 2 versions, i think the 1st one is better. base, plz tell me whether the competition is up.
Nice thanks for the tut here’s mine^^
http://i754.photobucket.com/albums/xx182/ZeroTypeX/Final-Fantasy.gif
Nice tutorial… t’was very helpful.
Outcome: http://img716.imageshack.us/img716/2701/squalldd012.png
Very Nice works kep it up
Hello, I was simply looking for a decent Signature to use in the Final Fantasy XIV online forums as the new 1.21 patch is about to release, giving the new job in particular of Dragoon. I love the Final Fantasy titles, and Dragoon was always my favorite class/job. I saw your sig lesson and fell in love with your finished product. Would you be offended or care if i used it? If you want you can remake one and put your name in it.. I in no way shape or form want to take credit for it. As, I’m simply looking for something to use so I don’t such a empty boring box when I post in the official forum threads.
Xel~
Here is my version. Thanks for the tutorial, helped a TON. I used Paint.NET and had to DL some effects and fonts, but all worked out pretty well I think!!!
http://fc09.deviantart.net/fs71/f/2013/123/f/b/signature__by_joshs3492-d63xw8o.jpg
My page for it is here, in case anyone cares haha.
http://joshs3492.deviantart.com/art/Signature-369417336?q=gallery%3Ajoshs3492&qo=0