Really cool Eclipse Effect in Photoshop
In this tutorial I will show you how I created the Abduzeedo's footer. Some of the techniques I used here I took from other tutorials and also from another tutorial I wrote some time ago for PSDtuts Mix Cool Retro Curves Into Your Photographs. Besides, the design is inspired by the amazing work of James White, so I highly recommend you to check his work out.
As I said before I used some techniques we saw before, from other tutorials. But one of the ideas of this tutorial is learn how to apply what we have learned from this tutorials, and create different effect.
Step 1
Open Photoshop and create a new document. I used for this tutorial the wallpaper size of 1900x1200 pixels. Right after that fill the background layer with black and with the Rectangular Marquee Tool(M) create a selection like the image below.
Step 2 - Brush
This is exactly what we saw on the other tutorial I wrote, there are just a few differences. But let's repeat the step here.
1 - Add a new layer and fill it with gray.
2 - Go to Edit>Define Brush Preset...
3 - Rename your brush to "Rec Brush".
Step 3
Now let's edit our brush, to do that go to the Brush Engine, Window>Brushes (F5). Basically we will use the Shape Dynamics, Scattering, Color Dynamics and Other Dynamics to create the efect we want. Just follow the image below for reference.
Step 4
With our custom brush let's create the effect, add a layer and paint some rectangles. After that let's add some Layer Style. Go to Layer>Layer Style>Drop Shadow. Use Color Burn for the Blend Mode, 80% Opacity, 120º Angle, 5px Distance, and 10px Size.
The last thing here is to repeat this step 2 more times. Like create another layer, paint some brush and add the Layer Style.
Step 5
Now let's resize the layer, just horizontally. You can go to Edit>Transform>Scale, or just press CMD+T(mac) or CRTL+T(pc). After that go to Filter>Blur>Motion Blur. Use 90º for the angle and 155 pixels for the distance.
Step 6
Select the Ellipse Tool (U) and create a big ellipse, it will be the dark planet. Use the image below for reference.
Step 7
Now let's make some adjustments. Let use Layer Masks to delete some parts of the image and to make others darker. So first select the ellipse layer and go to Layer>Layer Mask>Reveal All. Then select the Brush Tool(B) and big brush, the regular one rounded with 200 pixels, hardness 0%, and the color black. Now just delete some parts of the ellipse (1-4). After that select the rectangles and repeat add a layer mask exactly like we did before. Again select the brush tool, it will be the same preset as the last usage, this time however, change the opacity to 20% and paint some areas to maks some retangles. (5-11).
Step 8
Here let's add some color, I will use Abduzeedo's color. So go to Layer>New Fill Layer>Gradient. Change the angle to 90%, and scale to 80%. After that just change the Blend Mode to Overlay.
Step 9
Create a new layer and fill it with black, after that go to Filter>Render>Lens Flare, use 100% for the brightness and the 50-300mm zoom for the Lens Type. Change the blend mode to Screen. You will notice that the layer is too bright, there is too much gray. So go to Image>Adjustments>Levels. Then just change the Input Levels to 50, 1, 255.
Step 10
Now let's add a photo from sxc.hu, you can download it here http://www.sxc.hu/photo/986801. Place it in the center of our image. You will have to rotate, and rescale it. Then just change the Blend Mode to Screen too.
After that go to Layer>Layer Mask>Reveal all. Let's repeat the step 7 and delete some parts of the image, do that until you get the result like the image below.
Step 11
Now select the ellipse layer and go to Layer>Layer Style>Outer Glow. Change the Blend Mode to Hard Light, the opacity to 90% and select the Gradient Color. Use the default yellow and change the size to 60px.
Step 12
Create a new layer on top of the others, fill it with black and go to Filter>Texture>Grain. Change the Intensity to 66 and the Contrast to 60. After that change the layer's Blend Mode to Soft Light and 60%. You will notice that the image will get a bit darker.
Step 13
This step is not really necessary but the whole idea is add a bit of texture to the rectangles. So download the texture image from sxc.hu (http://www.sxc.hu/photo/1021346) and place it in the document, right on top of the ellipse layer and beneath the lights. After that reduce its just to make it a bit smaller. Then go to Image>Adjustments>Invert, change the Blend Mode to Overlay and the Opacity to 10%.
Conclusion
There are lots of ways to create this effect, and lots of good tutorials showing how to create that type of eclipse effect, the lines, and the other light effects. But the idea of this tutorial was to mix everything to get a nice result. I hope you like it and now it's all about playing with the tool. ;)

Click on the image for the full preview



















Nice, I like it. Clever use of the brush tool.
Thanks for the tut:)
well, i was kind of dissapoint it on this tut cause it looks sexy on the thumnail, cause what it makes it, is the nice effect on the pic from sxc.com i mean realy....
this is more a photomanipulation i will say, there are easiest ways to do the BG, no offense, this is just my opinion....
Thank you for putting this tutorial. When I grow up I want to be just like you! hehehe
the step were u say to put the outer glow i have a problem on it.
every time i try i get the outer glow on a box shape not on the planet
one of the best ones tuts :)
Nice one lol...
http://tropicalholidays.olympe-network.com
Qualé a Fonte...
..de tanto conhecimento cara??
tu representa a gauchada muito bem brother
meus parabéns...espero chegar no teu nível...
Great tutorial, keep them coming!
Thanks from Oz
I can't get step 11 to work, as in, i can get that thin yellow glow, but not that thicker oragne glow around that... have i done something wrong earlier on?
cool cool!
Really nice work..........
Regards,
GRAPHICS@SBL
Im stuck at the 4th step..... every time i use the brush instead of gray the rectangles are in all different colors.... How do i make them gray???
olha o resultado do tutorial na capa da Super Interessante.
http://super.abril.com.br/revista/sumario-edicao-255.shtml
cara, teus tuts rocks!
Parabens e grande trabalho.
This tutorial is realy amazing, If you realy interested in photoshop so there are number of nice videos tutorial of photoshop on http://codervods.com/Default.aspx?mode=default&category=Adobe%20Photosho...
Thanks
this is a good tutorial,i am really impressed wit it.one luv from femi from nigeria.
the part where u told the settings of the brush (STEP 3) is kind of confusing, I think there's a part which u got it wrong...
Did you saw the last issue of Superinteressante magazine?
Looks like the cover designer of this, visit the Abduzeedo tutorials :D
Cya
i have a problem creating the brush
i use photoshop elements and i cant find thoso options to create the brush.
Cna you help me PLEASE??!
look what you have done.
http://super.abril.com.br/imagem/capas/g/g_capa_255.jpg
ask for royalties =]
lol, nice tutorial!!
After this a real fan of your's, hope for more and more of such tutorials.
Thank you for this
It would be great to have a place where we can download the brush that you use for this and any other specialized PS tutorial to use on Photoshop Elements 5 or 6. Any suggestions?
wow, i searched a long time for a sort of this tutorial. Nice job. Looks really crazy :D
This is really nice effect!!!
Opa... olha só amigo!
Primeiramente... parabens pelo TUTO!
perfeito!
soh queria saber uma coisa!
Qual a fonte q vc usa no: ABDUZEEDO???? Igual ao q vc usou do resultado final do tutorial... escrito "ABDUZZEDO"!!!
obrigado desde jah amigo!
Nice tutorial, tnks dude for the impiration!!! cheers from Guatemala!
nice site
I dont understand how in step 3 the minimum roundness of your brush is set to 25 but the control is set to off? Can someone please explain this to me? Is this using a pen and tablet?
Thank you so much
Fantastic design!!! Keep going!!!I love it!!
Thanks again for a great tutorial. Check out my version over at flickr:
http://flickr.com/photos/kylesteeddesign/2592992233/
Cheers!
hi, ur really great, im a big fan of u and your design always inspire me in my works... keep the great works coming...
Thanks and regards....sajay
Wow! This is a Great Post!
Excellent tutorial.Thank you!
Great Tutorial! But I have one question: in step 13 when you say:
for me, it looks like you desaturated this image, because when I do Invert my image become blueish not grey, like yours. Or maybe I'm doing something wrong?
Cheers!
Very nice tutorial and outstanding effect!thanks a lot.
Excellent tutorial bro.. nice tips. Thank you
Wonderful tutorial like the style
WOW!
awesome man
Just open your eyes and say that
Life is Beautiful
This is my work thanks for tutorial http://cid-a801453caf2cec24.skydrive.live.com/self.aspx/Pictures/Kendi%2...
Like the style!
Man really looking forward to try this one out! Looks awesome
http://www.flickr.com/photos/bogdinamita/
very nice
Some helpful techniques!
Cool effect! :)
I already give it a try, here is my result.
http://kailoon.com/test/light.jpg
Thanks for the good sharing :)
Amazing!
That's a cool effect! I wish I didn't do so much work on newsprint, I don't think these effects would hold up on my pubs.
Excellent Fabio!
Crazy effect :.)
Amazing!
Thanks for the tutorial =)
And the correct Url is:
http://www.abduzeedo.com/files/Abduzeedo_s_footer_design/conclusion_lg.p...
Greetings From Chile =)!
very nice tutorial
come and visit my deviant
and also my flickr
amzing fab! :D
wow :o another amazing tutorial! that effect is crazy :D
___________________________________________________________________________
www.Silver-Solutions.co.uk - Award Winning Portfolio and Blog of Web Developer Anthony Woods
Post new comment