How to Achieve a 3D Effect in Photoshop and Illustrator

Rebecca

13 years ago

The latest trends in web designing are seeing a complete overhaul and many web designers are revolutionizing their web pages by incorporating a lot of 3D technology. This attracts more attention and helps in creating a powerful visual experience for their visitors. Such effect can be achieved by designing your web pages in Adobe Illustrator and Photoshop.

Create Simple and Effective Designs With illustrator

With Adobe Illustrator, it is very easy to create 3D, animated and visually pleasing images. Here are a few simple tips:

Open Adobe illustrator and create an A4 canvas measuring 21×29.7 inches or 8.27×11.69 inches. Create your basic layout with tools appearing in the tool Box such as ellipse tool. You can use the Pen tool to create additional shapes. Holding the Alt key with the Pen tool will result in getting square shaped structures. Click on the point from where you want to determine your vertex.

To add color to the shape, select the shapes created and go to the Gradient panel with the selection tool. You can create radial gradients of your choice by using various combinations on this panel. The panel is in the CMYK pattern. You can also make use of strokes to give added effect. A radial gradient makes your designs look soft and appealing.

To give further effects to your page, go to Effect, select Blur and use any of the options available, such as Gaussian Blur, Radial blur or smart Blur. You need to set a radius so as to get proper shadowing effect. You can get reflections by setting the opacity to the required percentage in a shape just outside your main drawing using the transparent panel.

Using Adobe Photoshop to get the Anaglyph Effect

Follow these useful tricks and you’ll achieve a stunning effect:

Open adobe Photoshop and create a canvas measuring 550×550 px with a 72 dpi. Copy the picture you created in illustrator by using the Copy/ Paste method (Ctrl+C/Ctrl+V). Paste it as a Smart Object to make working easier for yourself. This allows you to scale the picture without getting a pixilated effect.

Create a background of your choice with all the frills using the Gradient tool in Photoshop. Now select your picture pasted from illustrator and create new layers with various effects using the options in Photoshop. You need to create at least two to three layers with different effects on the same picture to get great effects. Save the Layers in various Groups. Now apply the Blending Mode option to the groups one by one according to your desire.

To get a 3D effect, you need to take extra care in applying the effects. Select each Group, one at a time and go to Blending modes option and click Multiply. This will give a darker image effect of the chosen object. Repeat the procedure for all the groups.
Now place the Groups in an overlapping fashion, one slightly out of the center than the other and so on, by using the Selection tool. This will achieve the desired 3D effect.
You can also get some depth effects by using the Free Transform tool. Add text boxes, animated objects and photos wherever you wish and design the page layout. Using Adobe Dreamweaver, you can make your web page active and fully functional.

The final result is an amazing web page, designed with all the special effects you desired and is bound to attract a lot of visitors. Adobe Illustrator and Adobe Photoshop can be thus used in synergy to bring out beautifully designed web pages.

Just have a look at these beautiful websites designed with 3D technology and ensure by yourselves.