Skip to main content

Making Basic App Icons


I was so excited when I found the Asset Studio in Android Studio (right click in the file menu -> New -> Vector Asset).




I was dreading the process of making an app icon for my first app, Scorekeeper. I thought I would have to deal with the pain of creating an icon for each of the Android pixel density buckets (mdpi, hdpi, xhdpi, xxhdpi, and xxxhdpi) and since I haven't done a lot of work with images, I probably would have been trying to do it all in Microsoft Paint. I'd like to think maybe there is a chance I would've found a better solution, but I also know myself well enough to know I like things that are familiar, and Microsoft Paint and I are old friends.


Luckily, I was exploring Android Studio one day while working on Scorekeeper and stumbled into the Asset Studio, clicked the Clip Art button, and found myself facing a treasure chest of icons. 




It was like a whole new world had opened up to me! Well, that's hyperbole, but the vector assets have saved me A LOT of time that otherwise would have been wasted on fussing around with images.

The icon making process is pretty streamlined for me now. I simply set the ic_launcher_background.xml to be a plain color:



Then I get the vector path data I need for the ic_launcher_foreground.xml file:




And BAM! Just like that I've got an Android app icon:




My go-to places for finding vector drawables are: 



SVGCreator.com can turn any of my Paint masterpieces into an SVG file. I get the path data I need for a vector drawable from the SVG file. The SVG path data from that website does turn the image upside-down, but it's an easy fix: https://stackoverflow.com/questions/43782733/fliping-drawable-image-in-vector-drawable (TLDR: android:pivotY="half of your viewportHeight" and android:scaleY="-1").

This strategy has worked well for the 6 apps I've made so far. Maybe someday I'll dig in and learn more about graphic design and working with images, but for now this simple method is letting me focus on other aspects of my app and not worry too much about the icon.

Dec 11, 2018 Edit: I just found this excellent series on using vector assets in Android apps by Nick Butcher, a designer at Google: https://medium.com/androiddevelopers/using-vector-assets-in-android-apps-4318fd662eb9

Comments

Popular posts from this blog

Made My First NFT Sale on OpenSea!

About my journey so far: I created my OpenSea account about two weeks ago. It cost me about $100 to get started: $20 in transaction fees to get Etherium into my MetaMask wallet and then about $80 in Etherium gas fees to create my first collection. I used this website to watch gas prices for a couple of days to see when gas prices tended to be lowest: https://ethgasstation.info/ Since then I have been uploading a few panda NFTs every day. I have been working on my 1000 pandas project, so I have almost 100 panda images as a backlog ready to upload as NFTs. Once I've caught up with my backlog I will create the NFTs as I create the pandas. When I create an NFT, I have been creating a supply of 1000 for each item (add "?enable_supply=true" to the end of the create URL to be able to change the supply of your OpenSea NFTs). When I finally finish making all 1000 pandas and making 1000 NFTs of each, that will end up being 1 million panda NFTs! I did this so I could experimen

New App! Time Progress Bars

  On Google Play:  https://play.google.com/store/apps/details?id=com.amandafarrell.timeprogressbars A fun way to visualize time Includes a resizable home screen widget Available in over 100 languages Inspired by one of my favorite Twitter accounts:  https://twitter.com/year_progress

New releases! Days Until and Days Until with Widget!

  Countdown the days until the date and time you choose!  Simple design, no ads, no permissions. Small download size. Available in 100+ languages! Code is opensource:  https://github.com/amandaroos/DaysUntilAppFree Free version: Days Until app on Google Play:  https://play.google.com/store/apps/details?id=com.amandaroos.daysuntilappfree Upgrade version: Days Until with Widget on Google Play:  https://play.google.com/store/apps/details?id=com.amandaroos.daysuntilapp

Your First Andriod App: Getting Started with Android Studio

1. The first part is setting up your Android phone to get developer options. You can use the Android Studio emulator, but it's much faster to use a physical device. Go to Settings > About phone > tap Build number 7 times. Once you have developer options make sure that USB Debugging is turned on: 2. Next, download Android Studio:  https://developer.android.com/studio/ 3. Start a new project. There are template projects available or you can start with an empty project: 4. Switch to Project view: 5. Java files go in "java" folder, XML files (layout, styles, strings, etc.) go in the "res" file, and sometimes you edit the manifest and the Gradle files: After this, be prepared for downloading time as you might need to update Android Studio. If you want more help with a starter app, check out my counter app tutorial video: