Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos.  Home Photoshop Web Layout Technical Interface

Technical Interface


This is not your average tech-interface...

Create a document with, on a new layer, an orb

Cut on both sides some orbs out of it

Click to enlarge

Follow my Smooth Tutorial to get the desired shape

Click to enlarge

Get the Rounded Retangle-Tool and set the radius to 60 pixels

Create long shapes like below

Click to enlarge

Create a few around the shape;

Click to enlarge

Give all these objects these blending-options;

image 1

image 2

image 3

image 4

image 5

image 6

It should look like this (Note: if you want different colors, just use different shades of green)

Click to enlarge

Press CTRL and select all the layers;

Go to SELECT>MODIFY>EXPAND and expand it by 5 pixels;

Fill the selection with black and place that layer after pressing CTRL+D beneath the other layers;

Click to enlarge

Give this layer these blending-options;

image 7

image 8

image 9

Click to enlarge

If you want you can also add a shine

Click to enlarge

And after adding your text, your interface is done and you can place it in your website:

Technical Interface
Click to enlarge


Author's URL: MickM.com
Final results of our readers
New!
Passed through all the steps? Share your result!
Your result will be premoderated.
Please make sure you choose the right image.
 
 



Captcha

*Required fileds
Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos. More Web Layout Tutorials: Featured Materials | Fresh Materials | TutorialKit New Photoshop Tutorials

No comments yet...
Add comments to "Technical Interface"

Captcha