Post Reply

[RESOURCES] Useful Android Design Resources thread

OP Androguide.fr

17th April 2013, 12:21 AM   |  #1  
Androguide.fr's Avatar
OP Recognized Contributor
Flag Lyon, France
Thanks Meter: 6,984
 
2,053 posts
Join Date:Joined: Jul 2012
Donate to Me
More
Hey guys, I've recently been working hard on redesigning my app and here's a compilation of resources I found useful along the way.
Please post yours so I can add them to the OP.


Online Tools

Android Asset Studio by Roman Nurik


This is an awesome tool which allows you to generate pixel-perfect drawables for your app, directly downloadable and resized for all screen resolutions (xxhdpi/xhdpi/hdpi/mdpi/ldpi) including :All icons can be created either from an image, from the provided cliparts, or even from text
This tool is open source, too : http://code.google.com/p/android-ui-utils


-----------------------------------------------------------------------------------


Android Action Bar Style Generator by Jeff Gilfelt


This great tool allows you to generate all the necessary resources (xml, drawables, nine patches, you name it) for your custom ActionBar theme. The Holo guidelines recommend to style the ActionBar with your branding color as an accent for example, well it's never been so easy with this tool.
You can choose the color for all the components of the ActionBar :
  • ActionBar color & style (solid/transparent)
  • Stacked Color
  • Popup Color
  • Accent Color
  • Contextual Action Bar background color and highlight color

Oh, and it's compatible with ActionBarSherlock, too!


-----------------------------------------------------------------------------------


Android Holo Colors Generator by Jérôme Van Der Linden


This nifty tool allows you to generate a custom style for all the most usual UI components such as :
  • EditText
  • AutoComplete
  • Button
  • Colored Button
  • CheckBox
  • RadioButtons
  • Spinner
  • Colored Spinner
  • ProgressBar
  • SeekBar
  • RatingBar (normal/small/big)
  • Toggle
  • ListSelector
  • Fast Scroll
  • Switch

Just like the other Asset Studio-based tools, it generates a zipped res folder that you can directly merge into your app


-----------------------------------------------------------------------------------


Android DPI Calculator by Martin Cohen


A very useful tool, I use it all the time. Simply input a width and/or height and it will convert it for you to all screen resolutions (even tvdpi)


-----------------------------------------------------------------------------------


UX Metaphor Equivalents for iOS & Android by Kintek

If you're an iOS developer/designer and are converting your existing apps or making the switch to Android (or the other way around), this tool will allow you to compare both platform SDKs's native UI widgets and find the right equivalents for each component.


-----------------------------------------------------------------------------------




Offline Tools
  • The Photoshop Android Design Kit by Taylor Ling : a great tool to design mockups and wireframes for you app, and now, since last update, it even includes some popular custom views such as Google Now cards, Croutons, undo-bar etc...


Custom Views & Libraries

I'm not going to make a list of all the awesome open source libraries the android community has created, this would be impossible.
But I'm going to give you links to external websites and even apps who try to achieve this goal, really go take a look, this is very inspirational :


Websites & Blogs


Videos
  • Android Design in Action : an awesome weekly show held by Android engineers Roman Nurik, Adam Kosh & Nick Butcher. They often do redesigns of existing apps, give many great advices. They usually focus on one specific type of apps in each episode, maybe your type of app has already been treated!
  • Dev Bytes : Held by Android engineer Chet Haase (and sometimes Nick Butcher), Dev Bytes is a great series of short episodes showing you how to implement some nice animations and transitions to jazz up your apps
  • The App Clinic : Held by Android engineers Reto Meier & Ian Ni-Lewis, this is a weekly show which takes a look at existing apps and talk about what's good and bad in their UI/UX approach

Guides
Last edited by Androguide.fr; 17th June 2013 at 02:35 PM.
The Following 46 Users Say Thank You to Androguide.fr For This Useful Post: [ View ]
19th April 2013, 08:47 PM   |  #2  
dragonhustler's Avatar
Senior Member
Flag Trowbridge
Thanks Meter: 98
 
204 posts
Join Date:Joined: Nov 2012
More
Really awesome but is this for framework-res only?
19th April 2013, 08:50 PM   |  #3  
Androguide.fr's Avatar
OP Recognized Contributor
Flag Lyon, France
Thanks Meter: 6,984
 
2,053 posts
Join Date:Joined: Jul 2012
Donate to Me
More
Quote:
Originally Posted by dragonhustler

Really awesome but is this for framework-res only?

This is for app development. The res folder of an app's sources holds the image drawables, as well as xml layouts, strings, style declarations etc...
But I guess it could also be used to mod the android framework, idk, I'm not really into rom theming.
The Following User Says Thank You to Androguide.fr For This Useful Post: [ View ]
20th April 2013, 11:53 AM   |  #4  
Junior Member
Flag The Hague
Thanks Meter: 1
 
1 posts
Join Date:Joined: Nov 2012
More
This is awesome! Thanks a lot!
The Following User Says Thank You to Batsh*tCrazy23 For This Useful Post: [ View ]
21st April 2013, 05:08 PM   |  #5  
Androguide.fr's Avatar
OP Recognized Contributor
Flag Lyon, France
Thanks Meter: 6,984
 
2,053 posts
Join Date:Joined: Jul 2012
Donate to Me
More
Added two new entries :
29th April 2013, 12:26 PM   |  #6  
el_bhm's Avatar
Senior Member
Thanks Meter: 37
 
143 posts
Join Date:Joined: Jan 2011
  1. ActionBar Sherlock not linked?! PREPOSTEROUS!
  2. No mention of Android Design in Action on androiddevelopers youtube channel?EVEN MORE PREPOSTEROUS!
  3. There's also AmbilWarna, Apache licensed, colour picker compatible with 2.1+ (I think). It's super nice.
  4. For super nice colour schemes visit http://www.colorschemer.com/ or www.colourlovers.com/.

Pro tips for guys on Linux.
  1. Install gPick. This way you can easily pick colours off the screen and plug them into the tools from above.
  2. There is also Agave app that will create a colour scheme off of a one or more colours.
  3. Create a custom launcher for ever website from Asset Studio.
    1. Create a file with with desktop extension in
      Code:
       ~/.local/share/applications
      with these contents
      Code:
      [Desktop Entry]
      Name=Android Asset Studio Launcher Icon Generator
      Exec=google-chrome --app=http://android-ui-utils.googlecode.com/hg/asset-studio/dist/icons-launcher.html#foreground.space.trim=1&foreground.space.pad=0&foreColor=33b5e5%2C0&crop=0&backgroundShape=none&backColor=ffffff%2C100 
      Terminal=false
      Version=1.0
      Type=Application
      It will launch it as it was an app.
  4. If you are more of a Photoshop guy, try Pixlr for online image editing
Last edited by el_bhm; 29th April 2013 at 12:29 PM.
29th April 2013, 03:16 PM   |  #7  
Androguide.fr's Avatar
OP Recognized Contributor
Flag Lyon, France
Thanks Meter: 6,984
 
2,053 posts
Join Date:Joined: Jul 2012
Donate to Me
More
Quote:
Originally Posted by el_bhm

  1. ActionBar Sherlock not linked?! PREPOSTEROUS!
  2. No mention of Android Design in Action on androiddevelopers youtube channel?EVEN MORE PREPOSTEROUS!
  3. There's also AmbilWarna, Apache licensed, colour picker compatible with 2.1+ (I think). It's super nice.
  4. For super nice colour schemes visit http://www.colorschemer.com/ or www.colourlovers.com/.

Pro tips for guys on Linux.
  1. Install gPick. This way you can easily pick colours off the screen and plug them into the tools from above.
  2. There is also Agave app that will create a colour scheme off of a one or more colours.
  3. Create a custom launcher for ever website from Asset Studio.
    1. Create a file with with desktop extension in
      Code:
       ~/.local/share/applications
      with these contents
      Code:
      [Desktop Entry]
      Name=Android Asset Studio Launcher Icon Generator
      Exec=google-chrome --app=http://android-ui-utils.googlecode.com/hg/asset-studio/dist/icons-launcher.html#foreground.space.trim=1&foreground.space.pad=0&foreColor=33b5e5%2C0&crop=0&backgroundShape=none&backColor=ffffff%2C100 
      Terminal=false
      Version=1.0
      Type=Application
      It will launch it as it was an app.
  4. If you are more of a Photoshop guy, try Pixlr for online image editing

I believe you should re-read the OP, Android design in action is mentioned, and as I said I'm not making a list of libraries, but ActionBarSherlock is featured on maybe 50% of the sites I linked.
The assets studio icons generator is featured too.

The size 7 was pretty unnecessary too
29th April 2013, 03:25 PM   |  #8  
el_bhm's Avatar
Senior Member
Thanks Meter: 37
 
143 posts
Join Date:Joined: Jan 2011
Quote:
Originally Posted by Androguide.fr

I believe you should re-read the OP, Android design in action is mentioned, and as I said I'm not making a list of libraries, but ActionBarSherlock is featured on maybe 50% of the sites I linked.
The assets studio icons generator is featured too.

The size 7 was pretty unnecessary too

I never said ASIG wasn't in there. Speaking of reading the OP?
Android Design in Action - fair.

Sherlock Actionbar should be here. Why? Because for once, it should be a one stop shop. Second, people still don't use it and use old look. Third, there are applications that are branded as Holo and are not compatible backwards as they don't use SAB, but latest API. As in there are still people not using it for no good reason.
android_owl
30th April 2013, 02:00 PM   |  #9  
Guest
Thanks Meter: 0
 
n/a posts
The first useful post for real app development on this board.
The Following User Says Thank You to For This Useful Post: [ View ]
25th May 2013, 01:45 PM   |  #10  
nikwen's Avatar
Recognized Contributor
Thanks Meter: 1,371
 
2,760 posts
Join Date:Joined: Feb 2013
More
These two videos from the Google I/O 2013 are related to Android UI design:

https://www.youtube.com/watch?v=s0HIP8EdlnE
https://www.youtube.com/watch?v=Jl3-lzlzOJI

The Following 2 Users Say Thank You to nikwen For This Useful Post: [ View ]
Post Reply Subscribe to Thread

Tags
android, design, libraries, resources, user interface
Previous Thread Next Thread
Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes