PDA

View Full Version : [tut] Reflection/web2.0 in fireworks[fireworks]



Hypertext
15-02-2008, 06:26 AM
My second tut of the night, ok this focuses on alot more screenshots, as I cba with text ;))

Create new doc with below info.

http://img408.imageshack.us/img408/3491/49677557vv9.jpg
Type your favorite text with the below info, including text formatting.

http://img262.imageshack.us/img262/9500/31733997xa0.jpg

Use the below aligning info. make sure "To Canvas" is selected

http://img87.imageshack.us/img87/695/55819480zv7.jpg

Use the below gradients of your favorite choice, best to choose light blue/blue etc, eg red, light red or pink or w.e
http://img403.imageshack.us/img403/4845/14877852kd3.jpg

Use the below INNER SHADOW stats

http://img525.imageshack.us/img525/5200/23617760zv0.jpg

Use the below GLOW effects to create a solid "tube" around your text.

http://img209.imageshack.us/img209/1685/60697484xb8.jpg

Use the below DROP SHADOW to create a black aura around your glow. Now at this we have an *awesome* looking web 2.0 graphic.. Personally I like to leave it there, but sometimes you have to go that step farther, now you should probably head over to photoshop, as I will warn you this isn't going to look amazing in fireworks.. but heregoes note: this is still in fireworks but possible to follow these instructions using photoshop

http://img208.imageshack.us/img208/3816/29610737mu2.jpg

Select your text and hit CTRL+C, then Click Modify -> Transform -> Vertical Flip as shown below!

http://img525.imageshack.us/img525/3429/32067510xh2.jpg

Move your duplicate text down so the top is aligned with the bottom of your original text. Now click Commands -> Creative -> Fade Image

http://img185.imageshack.us/img185/6748/79710174zw6.jpg

Choose the highlighted option for your "Fade Image".

http://img408.imageshack.us/img408/4029/10fa9.jpg

The result.. is a not amazing piece of work.. but it looks not too bad.

Remember this isn't photo shop if you want web 2.0, photo shops yourr program.. but we all should show some adaptability.

http://img262.imageshack.us/img262/4229/11hu2.jpg


Thanks for reading my SECOND tut of the night (depending where you are)I hope this was usefull to you.

TOMORROW: Web 2.0 BADGE tutorial!!!!!!

Pazza
15-02-2008, 10:31 AM
Nice tut,

+rep

e5
15-02-2008, 10:40 AM
Nice tut :)!

Chippiewill
15-02-2008, 11:50 AM
That takes longer than the 5 commands that you would need for paint shop pro :P

kk.
15-02-2008, 11:57 AM
nice tut
although, you can make reflective text on ms word easier than that (I'm not at all saying ms word is better than fireworks or ps)

theJOSH
15-02-2008, 12:22 PM
Why Fireworks?
The majority of Web 2.0 gfx, is done in Photoshop.
A Microsoft Certified person, should know that.

Good tut anyway though.

Chippiewill
15-02-2008, 12:34 PM
he might not have ps :rolleyes:

theJOSH
15-02-2008, 12:55 PM
he might not have ps :rolleyes:

So?
All I'm saying is the most used Web 2.0 graphic program is Photoshop.
And he does have it.

Hypertext
15-02-2008, 01:28 PM
I do have ps. - I did it for compatibility with editablility for slicing images etc.. either way works, I was just providign an alternative for the unfortunate users without ps :P.

theJOSH
15-02-2008, 01:47 PM
I do have ps. - I did it for compatibility with editablility for slicing images etc.. either way works, I was just providign an alternative for the unfortunate users without ps :P.

I see, well good tut :)
(See, I'm not all negative.)

kk.
15-02-2008, 01:53 PM
its pretty much the same anyway for photoshop isnt it?

theJOSH
15-02-2008, 02:06 PM
its pretty much the same anyway for photoshop isnt it?

Not really.

Bojangles
15-02-2008, 05:52 PM
Nice tut :)

kk.
15-02-2008, 05:58 PM
yeh it is.. i mean the tut not the programs.
you use the same features to do it on ps?

theJOSH
15-02-2008, 06:40 PM
yeh it is.. i mean the tut not the programs.
you use the same features to do it on ps?

No, not at all,
Photoshop is much more advanced

Hypertext
15-02-2008, 09:56 PM
not good enough for tuts section again?? :rolleyes:

theJOSH
15-02-2008, 10:08 PM
not good enough for tuts section again?? :rolleyes:

It's fine,
:)

Hypertext
15-02-2008, 10:39 PM
Maybe mods havn't seen it ;P

jesus
15-02-2008, 10:42 PM
Great tutorial - thanks!

kk.
15-02-2008, 10:45 PM
No, not at all,
Photoshop is much more advanced
once again, i didnt say the programs are the same, i said that you can pretty much use the tut on photoshop, you just need to know the different names for them.

Invent
15-02-2008, 10:53 PM
once again, i didnt say the programs are the same, i said that you can pretty much use the tut on photoshop, you just need to know the different names for them.Yeah I agree with you there.

By learning one method, you can use your knowledge and adapt it to another program. Sort of like learning a coding language like PHP then using some of your knowledge to help you if you start to learn another language like C#. In this situation you're knowledge will help you as the syntaxes are similar, sort of like in a PS program in a way that the techniques of doing things are similar.

Hypertext
15-02-2008, 11:06 PM
Congrats on platinum Simon.

Codings easier to transfer to different platforms/languages as mostly it's all procedural methods, until you get to things like PHP ad O.O.P., where you start to use Objects and classes. But overall ;)))) Check out my new tut!

Want to hide these adverts? Register an account for free!