Create A 3d Website Environment Using Adobe

Add 3D models to your website layout in Adobe Photoshop.

More and more websites are adding 3D content and models to the artwork and graphics on their site. These 3D models give the site a feeling of depth and reality that conventional 2D graphics can’t provide. You might think you would need a specialized modeling program and an expert with a great deal of experience to add 3D content to your Web-page layout. However, if you have Photoshop CS3 Extended or better, you can easily do it yourself.


1. Go online to sites like Renderosity, Daz3d and Animotions. Search their free content to find models you might want to use in your design. Make sure your models are in Wavefront OBJ, 3DS or Lightwave format. Download any you need. If you choose, you can search their marketplace to purchase other models. Save all of these models to the same folder on your desktop.

2. Open Photoshop. Select “File” from the menu and choose “Open.” In the dialog box that appears, open a Web-page layout that you want to add 3D content to.

3. Go to the menu and choose “Layers.” From the options, choose “3D Layer” and click “New Layer from 3D File.” In the dialog box that appears, go to the folder that you saved your models to and select the first model you want to use. It will appear on its own layer in the “Layers” palette.

4. Right-click on the new layer and from the options that appear, choose “Transform.” A group of 3D manipulation tools will appear. Use them to resize, rotate or position the model where you want it in the overall layout. You can also drag the model layer behind other layers.

READ  Turn Off A Graphics Card

5. Select “File” from the menu and choose “Save.”