Thursday, May 26, 2016

How to make a custom icon for Android

Theming icons with a pack is pretty awesome. But they can't do everything.

Icon packs have holes. Icon packs sometimes miss. And when you're theming your phone, maybe what you need isn't in an icon pack at all. That's OK. We don't need no stinkin' icon packs. We can edit together our own custom icons! It's easy. All you need is some kind of photo editor, be it the latest Photoshop or free cloud-based editor like Pixlr, and a little creativity.

Technically, we don't need to do anything to a image to make it an icon. You can take any image you find on the internet and set it as an icon, either using a launcher that supports custom icons like Nova Launcher or using apps like Awesome Icons. But if you set an icon this way, you'll quickly notice a few things: the icons are much larger than most since they take up the entire icon square, and since they lack transparency, there will be a border around the icon. We can edit our intended icons to make them look better on our home screen.

Once you have your base image in a photo editor, there are a few things we can do to improve the icon and make things easier on us when we go to set this icon in the launcher:

Transparency

Use the magic wand tool to select the image around your icon. If the rest of the image is a solid color, like this lovely March Magic logo from Disney Parks, then this should be a relatively simple endeavor; just tap on the area outside your desired image and hit delete. If your color is replace by black or white, in most cases either your image layer is locked or you're in an editor that doesn't support transparency. Make sure in the layers window (it's usually on the right side of the editor) that there isn't a lock next to the layer containing your icon. If there is, there should be a lock icon at the bottom of the layers window to remove it (or double-click the lock icon on the layer, that also sometimes removes it).

If you've got a full-spectrum image going on here, you might be better off lassoing your icon and copying that to a new layer. If that's a bit too tedious for you, or you're just too strapped for time, we have another option …

Borders and Outlines

Icons with borders may not look as clean, but they're easy to make, easy to set, and easy to keep uniform. There's a few ways you can create bordered icons:

  • Brushes: Photoshop brushes can be used to create borders around your icon.
  • Shape tool: The shape tool includes a great many borders that could be used for custom icons
  • Copy/Cut: You can turn any shape or brush outline into a icon stencil by copying the area around it using a magic wand and using Crtl+Shift+I in Photoshop to select the inverse of what you have selected. Now switch from the layer you based your border on to the layer your icon image is on, right-click inside the selected area, and select 'Layer via Copy'. Hide all layers beside the newly created icon, and you've got a cookie-cutter icon that you can resuse for as many icons as you want/need.

Icon Size

While in most cases bigger is better, when it comes to icons, there is a point of diminishing returns. Consider that even if your phone has a 2K display, or even a 4K display. Each of the icons on your screen is still really small. This doesn't mean you need to skimp on icon size while you're making them, but it does mean that saving your custom icons as 2000 pixel squares or saving it at 500 pixel squares will make very little difference on your home screen besides how many bytes of data it used.

And yes, no matter what the shape of your icon is, the canvas you save need to be square, because that's what your launcher is going to pull in: a square. A mostly transparent square, but a square nonetheless. If your icon is a rectangle when you're done with it, simply extend your canvas using the Canvas size setting. Also make sure your icon is centered within the square so you're not doing a lot of repositioning while setting the icon in the launcher.

Something else to remember when saving: this is a transparent image. That means the format you save in needs to support transparency. PNGs are your friends in the world of custom icons.

Get creative

Since you can make quite literally anything a custom icon, it can be a bit daunting finding inspiration for your icons. While they'll likely be theme-driven, here are some more ideas for custom icons or where to pull them:

  • Game elements: I have a friend who wanted a Dark Souls theme before Dark Souls 3 came out last month, so I found sheets of game icons in a wiki, divided the individual elements into square icons (the sheets were already transparent, making things a little easier), and then gave them to him as a few hundred custom icons.
  • Recoloring icons: If you like an existing icon's design but not its colors, you can download icon PNGs from some launchers (like Nova), recolor them to your heart's content, and then set them as custom icons. If you want to color-match your icons to a particularly color-toned theme, this method might be right up your alley.
  • Emoji: Emoji are already square images that are mobile friendly and can be seen as an otherworldy code by a large portion of the population. Using emoji as custom icons means you can disguise apps by how they make you feel, what they remind you of, or one of the hundred of symbols that you feel represent the app in your eyes. I made the Google emoji Trident my app drawer icon on a Little Mermaid theme I used a few months back and it was tasteful yet fun.
  • Music: If you want to show off your intense love of your favorite group or band, make their albums into custom icons for your home screen. ABBA's SOS for the dialer? Metallica for Chome? Can You Feel The Love Tonight for Tindr? Wait, that one could be a problem…
  • Logos: Sports teams, name brands, heck even a lot of movies and bands have their logos online in transparent image form, ready to be set as a custom icon. If you're a sports fan, you team's logo is the easiest app drawer icon in the theming world, and in most cases it won't need any editing at all.

The only limits for custom icons are your own tastes and your imagination! What custom icons have you used in a theme? Got a great idea for some custom icons but don't quote know how you could pull it off? Leave your ideas in the comments below!



from Android Central - Android Forums, News, Reviews, Help and Android Wallpapers http://ift.tt/1TZotyc
via IFTTT

No comments:

Post a Comment