Android and IOS applications programmer always look for a graphics designers who can make the best flat icon, emblem or logos for their applications. They develop their applications by spending a days and nights and want to make their application is also unique and beautiful. So they lease graphics designers and spend a lot of money but their requirements have not been fulfilled. I think there is no need to hire graphic designer anymore. Because in this tutorial we are going to teach you custom design for flat types of Apps Icons in Photoshop for Android and IOS operating systems.
So be attentive and read out every step wisely. After understanding this tutorial, you’ll be able to design attractive icons for your applications easily.
Custom Design for Flat Types of Apps Icons Step By Step
Message App Icon
Step 1: Create Icon Document
First of all create a new document related to your message application Icon size. Go to File -> New a new window will open having further options associated with a new document. First change the document name as Flat Icon with default name Untitled-1 and set the value of Preset as Custom. After that adjust the size of an icon by giving Width and Height values. Set Width 100 Pixels and Height 100 Pixels, after this put the resolution as 72 Pixels / Inches and Color Mode RGB 8bit. At the last set the Background Contents as Transparent from the drop down menu.
Now values have been set just click on an Ok button a new document will appear in front of your screen which will seem like below picture.
Now it is ready for flat icon designing. Before making a design first build a structure in your mind and implement it step by step in the icon sheet. Get the some ideas related to flat icons here https://www.behance.net/gallery/20382043/Flat-iOS-App-Icons.
Step 2: Round Message Icon
Now we are going to make a messages icon, for this purpose you’ve needed a circle with the help of Ellipse Tool. Draw round shape with Fill and Stroke #f5b144 into a transparent sheet.
A round shape has drawn now it’s time to give some special figure associated with Message identification. So go to custom shape tool and select the Talk 2 diagram from Shape Combo Box. Now draw this figure with Fill and Stroke #ffffff.
Flat message app icon is ready for Android and IOS applications. Just save it in PNG image format. So go to File -> Save and save it in PNG extension into your computer. You can design many of icons for your mobiles applications by this simple way.
Flight Application Icon
Step 1: Create Flight Icon Document
First of all you’ve needed a new document so repeat the step again go to File -> New or press command Ctrl + N from your keyboard. A new window will open Fill the option like Width 100 Pixels, Height 100 Pixels and Background Contents as Transparent, just like below picture.
After filling all options press the OK button to create a new document. The first view of a new document can be seen in a below picture.
Now sheet is ready for designing, it’s your art how can you design flat icons for mobiles applications. Now we are going to design Flat Icon for flight application.
Step 2: Elliptical Flight Icon
Here you’ve needed an Ellipse Tool, select from Tool Bar and draw it with Fill and Stroke #21bbc7. Set the Circle Diagram like below image.
Here is an essential need to set the round diagram. So Select the Pen Tool from Tool Bar and hold Ctrl and Left Click on the edges of a shape. Nodes will appear around the shape, just modify the diagram by holding Ctrl Key + Left Click and arrange it as below picture.
Round Shape has properly adjusted, at this stage give some effect to an around diagram by visiting Add Layer Style -> Drop Shadow from layer section. A new window will open containing lot of options. Set the values as Opacity 80%, Angle 90°, Distance 5px, Size 5px and click Ok button.
Now draw an airplane diagram into an icon so select the Airplane figure from Custom Shape Tool and draw it with Fill and Stroke #453768.
Flat Icon for Flight application is ready, just save it in PNG image format go to File -> Save and save it with the extension of PNG into your computer. Enjoy this tutorial and try it with your effort to design more beautiful icons for your mobiles applications.
Call Applications Icon
If you are developing a call related application for any mobiles operating system and you don’t know how to design a beautiful call app icon than see below steps.
Step 1: Create Call Icon Document
For designing a call application icon, you must create a new document. Just go to File -> New a new window will open set the appropriate values like below picture.
After setting the values of new document click OK button. The new transparent sheet will appear on your front sheet.
Step 2: Rectangular Call Icon
The sheet is ready for designing, so select the Round Rectangular Tool and draw the shape with Fill and Stroke Color #f18058.
Now give some effect to layer so go to Layer -> Lifestyle -> Drop Shadow a new window will open related to Drop Shadow options. So set the values as Opacity 75%, Angle 120°, Distance 10px and Size 2px.
After pressing the Ok Button, a shadow will appear like below the diagram, which is looking awesome.
Round Rectangular Diagram has completed now there is a need to add some circle shape in the middle of an icon with Fill and Stroke Color #84c2b7. After filling the circle now add some figure related to Phone so go to Custom Shape Tool and pick the Phone 2 shape from the Drop down menu and Drop it in the middle of a circle like below picture.
At last Flat Call application icon has completed just need to save it in PNG format into your computer.
Enjoy this tutorial and make the drill of this tutorial step by step, in the end you’ll be able to create beautiful icon or logo for the company, website or phone applications own your efforts.
We have learned to design Flat Icons for Android and IOS applications in Photoshop. We made three type of icons in the above tutorial, 1st a Round Message Icon, 2nd Elliptical Flight Icon in Round Rectangular Shape and 3rd Call Icon in Square shape. All flat Icons dissimilar with each other and have particulate designs. You can make many more icons from these ideas for your mobile applications.