How to Design App Icon in Adobe Photoshop for Google Play

Sharing is caring!

Are you looking for an attractive and eye-catching Icon or Logo for your Android Application? or Are you looking to Design App Icon? It is important for you to know that what an App Icon is? Why we need it? Actually these are Graphically designed symbols which are used to represent your Android Application on the Google Playstore.

you should also visit: How to Design Screenshots of Android App in Photoshop for Google Play

TechPushups have the solution for your problem. We are here to help you step by step instructions with a brief detail to design App Icon for your Android Application.
I am working as a Graphic Designer from the past 2 years. I have used Adobe Photoshop and Illustrator for designing App Icons and User Interface of Android Applications.
You should know the following things before Designing App Icon. All you need is to have these requirements before going to design App Icon.

1): Photoshop Intermediate Skills
2): App Name and Tagline
3): Theme of Colors
4): Size of Android App Icon

This tutorials is based on easy and simple steps of instructions which can even help beginners to Design App Icon. App Icons are usually designed in various raster or pixel based graphic software and applications. Adobe Photoshop is known universally for Graphic Design. Following are the steps you should follow to design App Icons;

Step 1: Create a New Document

Create a New Document by using the Shortcut keys Ctrl + N in Adobe Photoshop(I”ll prefer CC version) of 512*512 pixels which is recommended

Set width and height to 512*512 pixels with 72 Resolution

Step 2: Round Rectangle Tool

Design App Icon in Adobe Photoshop

Select Round Rectangle Tool from the ‘Right Side’ (Toolbar) of Adobe Photoshop. Set the Width and Height to 512*512 pixels with 90 degree Radius for each side. This will make a ‘Round’ Rectangular having 90 degree of radius like below;

Design App Icon in Adobe Photoshop

We will have to Delete the White Background. Press Delete Button to remove the background layer.

Step 3: Apply Blending Options

In this step, make a duplicate of the “Rounded Rectangle1” and resize the duplicate layer. Decrease the size of the bottom direction.
After that Apply Blending Options to the “Rounded Rectangle 1”. Bevel the layer, apply gradient and shadow as i did below.

Design App Icon in Adobe Photoshop

Step 4: Apply Gradient Strokes

Design App Icon in Adobe Photoshop

Apply Strokes and Choose Gradient of 01afec and 243b98 colors. After that Apply Inner Shadow to the same layer.

Step 6: Blend your Final Object (Design App Icon)

Here we are ready to import or place our own Application logo on our Icon to make it a complete design. I have import the “Tick Shield”.

Design App Icon in Adobe Photoshop
Design App Icon in Adobe Photoshop

So this is the final App Icon Design which is now ready to upload on Google Play while publishing your application. While submitting the App Icon Image to the client or any Android Developer, we have 5 various sizes for that which depend upon the screen densities. you can view them from IconHandBook.
These sizes are called mdpi( 48 × 48 ), hdpi( 72 × 72 ),
xhdpi( 96 × 96 ), xxhdpi( 144 × 144 ) and xxhdpi( 192 × 192 ).

Follow Him

Hammad Ali Shah

Editor at TechPushups
Hammad Ali Shah has keen interest to learn and talk about Science & Tech, student of Computer Sciences. A UI/UX designer, web & mobile application developer and a freelancer who always write blogs on Tech tutorials and news and updates. Hammad can be reached on Social Profiles!
Hammad Ali Shah
Follow Him