Got Icons, Yes We got Icons: Everything you need to know about Icons, that your mother never told you.

Your Buzztouch App Icon:

What’s an App icon?

To create a new BT app you’ll need a 72 x 72 icon.  Any icon will get the app on your phone for testing. You can update the icon later so don’t let this simple step stop you.

In the  BTv2.0 Control Panel choose a  .JPG or .PNG image to upload.

If you’re using BTv1.4 or BTv1.5 only a .jpg will work.

After uploading the image, you’ll be asked to “crop” the image to 72 x 72 pixels. If you upload an image that is exactly 72 x 72, “select it” before clicking the “Save” button. Choose “Done” now you’re finished.

Button Icons

To create the icons for buttons I normally use pictures & logos, but sometimes it’s nice to have an icon that spells out what is does.  For “text” icons use the “Simple Text” app.

Icons for Publishing

To publish your app on the Android/itunes market these are the icon sizes you’ll need.

App’s Icon for BT

72 x72 for the app’s icon (iOS & Android)

iOS Icons:

iOS App Store Icon
512×512 (scaled down to 175×175 for display in the store)

iOS Application Icon
114×114 (iPhone 4)
57×57 (older iPhones)
72×72 (iPad) Spotlight Search

Results and Settings Icon
58×58 (iPhone 4)
50×50 (Spotlight results for iPad) 29×29 (settings for iPad and older iPhones)

iOS Document Icon
This is a new icon type in iOS 4. It’s used if your app creates a custom document type. The iPad uses the document icon in two different sizes.
320×320 (iPad)
64×64 (iPad)
44×58 (iPhone 4)
22×29 (older iPhones)

iOS Custom Icon and Image Creation Guidelines

Android

Launch App Icon Sizes

high-density (hdpi): 72 x 72

medium-density (mdpi): 48 x 48

low-density (ldpi): 36 x 36

Additional Reading:

All the sizes of iOS app icons by Neven Mrgan.

Designing for iPhone 4’s Retina Display

Free Icons:

iconarchive.com

openiconlibrary

Screen Size (iOS):
iphone 3: 3.5-inch 320×480 pixels
iPhone 4: 640×960 pixels
iPad:

Points vs. Pixels

Starting in iOS 4, dimensions are measured in “points” instead of pixels.

iphone: 3.5-inch 320×480 points
iPad:

For every image in your app, add a second version that’s twice the size, adding @2x to the name. For a low-resolution image named image.png, for example, you would add a second file namedimage@2x.png. The new image will be picked up automatically by iPhone 4. When your code requests image.png image@2x.png will be used.

Since the resolution of the iPhone is 960 ×640, that’s the size your photo needs to be. If it’s smaller it either won’t fill the screen, or it will be upsized (which will decrease the quality). If it’s bigger it will either overflow the screen, or it will be downsized.

A pixel is a pixel, but a pixel is not always .5 centemeters. On different displays the size of the pixel is different based on the DPI and resolution.

With Flash you can use vector graphics.
With SVG = vector, no need for Flash.


Posted from WordPress for Android by Fredt4

Advertisements

One thought on “Got Icons, Yes We got Icons: Everything you need to know about Icons, that your mother never told you.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s