The android design guidelines say that "Use a distinct silhouette. Three-dimensional, front view, with a slight perspective as if viewed from above, so that users perceive some depth." I am still fairly new with illustrator and I was just wondering if anyone could tell me how to turn a 2d flat image into something three dimensional with a slight perspective from above.

enter image description here

1 Answer 1


this question is already answered in relation to Inkscape here

"The effect you described is simply achieved by duplicating the shape, changing it to outline, moving it up a bit and putting it in the background."

So to make a shape in Photoshop; hit CTRL and U you are now on the shape tool, holding down on this icon in the tools panel a submenu will appear with alternative shapes to choose from including 'custom shape tool' which has a wide variety.

To duplicate the layer; right click on it in the layers palette and select 'duplicate'

To change it to an outline around your button; Simply alter the shade to your desired one or if you prefer a simple outline with some negative space then consider adding a stroke.

Move up slightly; Use the move tool (V) to move a selected layer, in the case you will want to have your button as the top layer and your duplicate as your bottom layer. Ensure that it is selected and hold SHIFT while moving it up to keep it aligned with the first layer.

The principle for making this in Inkscape, Illustrator or Photoshop is the same and is as described by KMSTR in the link and quote at the beginning of this answer. Though there are other methods this is probably the most straight forward one.

(I did not mark this as a duplicate as it seems from the comments on the 'duplicate' question that the OP was still having some trouble).

  • Thanks. I found the question that you posted, but I appreciate the detail you put into your answer. I was unsure of some of the "lingo" the other answer was using. Thank you!
    – EGHDK
    Jan 19, 2014 at 13:25
  • No problem, good luck with your project and don't forget different dpis on Android devices ;) developer.android.com/design/style/devices-displays.html and some tips developer.android.com/design/style/devices-displays.html
    – Jenna
    Jan 19, 2014 at 13:29
  • Feel free to comment on the original question for clarification too ;) I'll happily clarify.
    – KMSTR
    Jan 20, 2014 at 8:13
  • Will do :) I think it's quite clear, just some people mightn't know how to execute the instructions. I was confused with how to handle this. I wanted to add the instructions to your answer but this was the active question. What a dilemma :) I think it's exceptionally clear now, regardless of which answer a person lands on :)
    – Jenna
    Jan 20, 2014 at 9:12

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.