Design a Successful App Icon in 11 Steps
- by Juno Team
- in
As designers, we all know that app icon is a small figure representing an application program. However, designing an app icon is not just drawing the shapes inside a square. A desirable app icon should intuitively appeal to large consumers and briefly exhibits useful purpose of the app without words. In doing so, you need to figure out the concept and generate your app icon which is different from the others.
The strategies behind designing a successful and memorable icon involve a process which progresses through various stages of listening, research, development, feedback and changes. In this post, we will guide you all through 11 basic steps in order to achieve a successful app icon.
1. Ask the questions and understanding the target
Asking questions such as, How does your company differ from its competitors?, What keywords should best describe your new app icon?, or Please send us some app icon samples you like, will help you and your clients become more on the same page and set up for a successful deliverable. At Junoteam, each of our clients receives an interactive App icon brief that asks questions about their company and app project. Please check our app icon question list.
Especially, you need to ask the app UI design, whether it’s ready to make sure your app icon design will fit well the app UI style.
2. Research and Brainstorming
After receiving the answers and sometimes arranging phone/skype conversation to get additional details, we begin researching their app information and competitors to get a better feel for their market – this helps in the overall look and message the final icon conveys, all materials are useless if you understand them differently than your client. This is why understanding goals and vision is crucial in order not to waste valuable time.
3. Inspiration and Think Outside the Design Box
Often we’ll go through some app icon galleries to get the creative juices flowing. There’re some app icon galleries that we usually visit:
- Dribbble
- Behance
- IOS icon gallery
- App Store
- Google play
- More: please suggest more and drop us a message
In recent months, there have been a lot of icons that use single color backgrounds with a simple icon, flat design techniques, and long shadows. While these trends are going too overused, don’t get stuck inside the design box. Do something different with your icon.
If everyone else is working with square shapes, consider something more rounded. If they do flat, why didn’t you design with cartoonish or 3D style? Don’t feel like you must design your icon on what everyone else is doing, you don’t have to follow the trends.
Yes, flat app icons are beautiful. More than that, they’re elegant. But only in isolation. Taken together, they’re ubiquitous.
App icons design by Tuong Duong from Junoteam.
At Junoteam, we usually add the fun elements into our app icon design that makes our business stand out from the crowd.
4. Mind mapping and Sketching
Mind mapping helps in exploring and growing your topic. You can easily expand your ideas and keywords. We usually do mind mapping on our DIY while board and sometimes with the sticky notes.
Our designs, whether it’s icon, logos or websites, always start with paper and pencil. You have a project idea that feels right, it’s just the beginning. Sketch it out! It only takes a few seconds, and it gets the idea out of your head. Now sketch some more ideas. You won’t know whether your first idea is the best until you explore others. If you find something you like more, you’ll feel a rush of gratitude that you didn’t waste 4 hours in Illustrator/ Photoshop with the bad icon result.
App icon sketch by Kaizen Nguyen from Junoteam.
At Junoteam, we involve the client in all of the steps of the design. We show clients some sketches to show our idea, they help everyone get on the same page, quickly. When a course correction is needed, we spend a few seconds sketching a revision, rather than taking hours to move pieces around in Photoshop or Illustrator.
5. Start using the Design Software
After some icon sketches approved, we will take our chosen ideas to the computer. We choose Adobe Photoshop for creating icons. We’re using the pen tool in Photoshop to create vectors shape that is easily scalable and edit.
We’re using our own app icon guideline to design icons for clients and we would like to share this great guideline to you guys, please find the download link by clicking on the image below.
6. Client feedback
Our client usually approves the sketches before we move to the computer so the process usually flows fluently. We do our best to touch base with my clients frequently and get their feedback through various stages of the app icon design process.
7. Modification
After getting client feedback we tend to go back to the computer and modify or provide additional options. This helps us the chance to take in more ideas from the client and understand their vision more clearly after the initial feedback. Listening to your clients is the only way to guarantee you create a great design.
8. Color & Font
After finding out some best options, we play around with color combination and font variation. But we don’t usually use words in our app icon if it’s not really necessary, you can read the reasons in this article from Michael Flarup.
If you can’t get a way with no text, then try using a first letter of the logo or app name. Great examples are Vine, Snapguide, Facebook, Pinterest.
We typically provide my clients with at least 2 different app icon samples. Don’t send too many ideas, when you present your client with too many options, the process of choosing becomes much more difficult — it’s easier to choose one from two than one from twenty.
9. Final revisions
After the client tends to approve the best option for their app icon, we will make some additional minor changes that we feel are necessary. At this stage, we’ll also mock-up what their new app icon will look like on the app store and phone screen with different screen background color. This helps your clients see how the app icon works, not just a stand-alone symbol.
Sushi roll app icon design by Nguyen Doan from Junoteam.
10. Scalability
One of the most important aspects of an icon is scalability. Because the icon is not going to stay at 1024 x 1024px, it’s going to be shown in several places such as App Store, Google Play, on Retina devices and even in the Settings panel at several sizes. So make sure your icon design look good at any size.
Sushi Monster app icon design by Tuong Duong from Junoteam.
11. Delivering the files
We always deliver the icon for both IOS and Android with the all necessary sizes in PNG format and editable PSD files. We also deliver round shape for clients to demo and square shape to upload to the market.
Cow app icon design by Tuong Duong from Junoteam.
We hope you enjoyed and start to create your first app icon design. If so please send us your design we would be happy to see, please share it in the comments! To stay tuned for more tutorials and open source projects, just need to subscribe our newsletter box below.
Welcome to see the designs by Junoteam on Dribbble and Behance
