Lesson 6 - Optimize Your Icons, Screenshots and Videos
The visual elements of your app are important because they are the first thing that people see when they view your app on iTunes or Google Play. Many times you only have a second or two to catch their attention.
So your visual elements have to look amazing and quickly convey important information about your app. This lesson will show you examples of excellent visuals, how to figure out what to use for your app and how to test your designs.
The Characteristics Of A Good Icon
There are so many icon design possibilities that it can be difficult to figure out where to start. To make things simpler, we recommend that you begin by considering two design categories: branded or descriptive.
If you want to go the branded route, then that makes things a little easier. For the first version of your icon, just use your company logo and colors.
But do not be afraid to experiment with variations of this design after the first version. There are many things that you can do with a branded logo.
One excellent example is Nike. They have several different apps and the app icons all prominently display the swoosh.
But they design each icon a little differently, depending on the focus of the individual app.
If you want to go the descriptive route, then that may be a little more difficult. But it is helpful to start simple and focus on one key feature of your app.
If you have a functional app, you should highlight the most important feature. Notice how these icons are simple and you instantly understand the function of the app.
If you have a game, focusing on one character makes a good app icon. Here are a few excellent examples.
You want to avoid having too many things in your app icon. Remember that your icon will be displayed on a variety of different devices.
It needs to be recognizable, even when it is really small.
The following icons may not necessarily be bad, they may work well. Again, it all comes down to testing and figuring out what works for your app.
But when you compare them to the icons above, they are considerably more cluttered. When we shrink the icons down to a size that you might see on a mobile phone, they are not as eye-catching.
So make sure that your icon is simple and makes it easy for people to understand what your app is about. If you need some inspiration, browse the App Store or Google Play on a mobile phone. You should use a mobile phone because is where the icons will be the smallest.
Take note of which app icons catch your eye quickly and why. Also notice icons that are not appealing and take a minute to figure out how they could be improved. With a little research, you will understand what a good app icon looks like.
Bonus Tip: One of our customers gave us another good suggestion for creating noticeable app icons. She takes screenshots of people’s device home screens, with their app mixed in with other apps. This is so that she can see if their icon stands out in everyday use. Doing this can help your app get noticed in app store search and get opened more once it is downloaded.
The Characteristics Of A Good Screenshot
Screenshots are another way to make your app appealing to prospective users. The most common approach to screenshots is to simply use the screenshot function on a mobile device and upload the screenshot as-is. Here is an example.
Notice why this might not be the best screenshot strategy.
This is a beautiful screenshot. But does it tell you anything more than this is a camera app? Not really.
While this might work fine for some apps, we highly recommend that you take a slightly different approach to optimize your screenshots. This is based on the thousands of screenshots we have seen and the design trends that we have observed.
Basic screenshot guidelines:
- Always use all available screenshot slots
- Your best screenshot should be displayed first
- Each individual screenshot should communicate one benefit of your app
- Use additional text to highlight the benefit that is displayed on each screenshot
- Keep screenshots clean, bright and easy to read
- For additional emphasis, magnify or point to certain areas with an arrow
Now let’s take a look at two examples.
The first one is from Clash of Clans. It is an excellent example of using text to highlight a benefit of the game. This screenshot is also interesting and easy to understand.
The first screenshot for the Camera+ app does a great job of highlighting the biggest benefit of the app. They also include a great quote from the Wall Street Journal for social proof.
A great way to find good screenshots is to browse a category that you are not familiar with. Since you are not familiar with the apps, you will have to rely more on the screenshots to tell you what the apps are about.
See which screenshots help you quickly identify the benefits of the app. Figure out how you can incorporate those concepts into your screenshots.
The Characteristics Of A Good Video
App promo videos have been available on Google Play for awhile, but they will also be available in iTunes with the launch of iOS 8. So you should take advantage of this benefit to give your app the best chance at being downloaded.
The first thing to remember is to keep your video as short as possible. Just like with your screenshots, be sure to point out the the biggest benefits of your app.
Make your video interesting by adding music or anything that will keep people watching. If you don’t have a “radio voice” you can also find someone on a site like Fiverr or Elance to do a voiceover for you.
This is a good example from the Square Register app. The video is less than a minute in length and shows exactly how Square works.
If you want to create a longer video, telling a story (or multiple stories) can also be effective. Here is a good example that Pinterest uses to highlight the guided search feature in their app.
Just like with icons and screenshots, the best way to find good ideas is see what other app publishers are doing.
Browse the app stores and YouTube. Watch as many videos as you can.
Take notes on what you like and what you don’t like. Then apply what you learned to your promo video.
How To Test
The measure of success of any of these changes will be how much it improves your downloads.
Create your new visual elements and leave them in place for at least a month to get a baseline downloads reading. Then you can start tweaking each element to see if you can improve your results.
When you are ready to test new variations, the best thing to do is to measure one variable at a time. So if you are doing an update to change your icon, you ideally want to wait until the results from that change stabilizes before making another change.
You can make multiple changes at the same time, but there will be no way to tell how much of an effect each element had on the results.
There may be times when it is necessary to update multiple elements of your app at the same time. Sometimes that can’t be helped.
But whenever possible, test one thing at a time so you understand the effect that each individual change had.
Where To Get Help
If you aren’t a professional graphic designer (like most of us), then you will have to find someone to help you out. Don’t worry, there are sites that can help you find a great designer that fits your budget. Take a look at sites like Upwork, Elance or Dribbble.
Before you hire someone, be sure to look at their portfolio and ratings carefully. Even if a designer has good ratings, their style might not suit your needs.
Next, interview the candidates on Skype or Google Hangouts and get a feel for how easy they are to work with. You will usually end up with two very good candidates.
Choose one and explain your desired design. Remember that the more specific you can be about your design, the faster you will get what you want.
Measuring Your Results
Now take a look at the number of downloads you got before and after the change. If your downloads actually went down, switch it back to what you had before, or try something new.
Again, if at all possible, remember to change one thing at a time and see how it affects your downloads.
So that is how to test and evaluate the visual elements of your app. This is not quite as scientific as keyword optimization, but when you find something that works, you will definitely know it.
Next, we will look at how to write your app description. This will continue what you learned in Lesson 2.
If you found this lesson useful, feel free to share it with a friend who would benefit from this information.