The previous versions of android had the battery indicator as a dynamic illustration along with a provision to view the battery in percentage in the status area of the phone.

Also in lollipop, we have to swipe down twice to see the battery percentage.

Android (till KitKat)


download bmml source – Wireframes created with Balsamiq Mockups

Wouldn't it be much better if they come up with a design which provides both battery icon and the percentage as a single icon,

My Design:


download bmml source

there by saving the space of one icon in the already crowded status area?

Also the bottom rectangle can illustrate the health of the battery using different colors.

Also plugged status can be provided like the the lightning symbol behind the charge percentage. [I couldn't create that mock-up of that in the online editor :) ]

EDIT: For few who feel that it will take more space, I suggest we either use slim font or remove the percentage symbol like,


download bmml source

  • 1
    That looks close to one of the styles available in Cyanogenmod (select "icon portrait" and check "show battery status percent") except it uses a varying degree of fill and just two colours (default or red) along with the text. – Jon Hanna Apr 9 '15 at 10:13
  • @JonHanna Haven't used Cyanogenmod to be frank. So no idea – Siva-Dev-Wizard Apr 9 '15 at 10:15
  • 2
    You should take a look. I prefer its circle icon myself though; while not looking like a dry cell doesn't say "battery" as immediately, it's got good clarity-for-space value. – Jon Hanna Apr 9 '15 at 10:26
  • 1
    I suppose some people like to look at their battery icon to quickly evaluate their battery life instead of reading (which isn't that much slower). I only have the battery text, without the icon ( CM11S). – Vince Caregnato Apr 9 '15 at 13:00
  • 1
    @VinceCgto Devs like us will prefer the text. Think of the average users who constitute the maximum users :) – Siva-Dev-Wizard Apr 9 '15 at 13:40

On my personal preference it's sometimes (or most of the time) convenient to just get an idea of battery status by having a look of filled or empty status of battery indicator (Like the one with default battery indicator ).

Though, I am supportive to your idea of saving the space and moving the % inside battery icon but then we will have to take care of few points:

  • Making the default battery icon little big ( big enough to hold the 1-100% at legible font )
  • If we are to go with the coloured indicator like the one you have suggested (Red for Low, Green for Full etc. ) then we will have to vary the % color accordingly to make the % readable with varying battery indicator colors.
  • 2
    I think we can go for slim font or even cut the "%" symbol – Siva-Dev-Wizard Apr 9 '15 at 6:49
  • @Siva-Dev-Wizard yeah cutting the % can be an option – exexzian Apr 9 '15 at 6:58
  • So we are only away from calling Google :) – Siva-Dev-Wizard Apr 9 '15 at 6:59
  • @Siva-Dev-Wizard haha yeah I suppose so... make it happen dude :) – exexzian Apr 9 '15 at 7:00
  • @Siva-Dev-Wizard Additionally, to avoid the extra character, change what would be 100 to a tick sign or something similar. – Prinsig Apr 9 '15 at 8:16

In order to create an icon like that that would still fit into the notification area it would mean the text of your proposed icon would have to be even smaller than it currently is, this would make it incredibly difficult for those with poorer eye sight/smaller screen devices/lower resolutions to see what the value is.

The advantage of the current display is that the text appearance shows a more detailed display of the battery level whilst the icon can give a quicker visual display. The added colour when running low on power also allows for a quick indication regardless of visual worries mentioned above.

  • 1
    But the displays are becoming more advanced and of higher resolution. So I don't think there will be a problem in fitting the text in the icon. Should be clear – Siva-Dev-Wizard Apr 9 '15 at 10:03
  • @Siva-Dev-Wizard - ᵗʰᵉʳᵉ ʷⁱˡˡ ˢᵗⁱˡˡ ᵇᵉ ᵖᵉᵒᵖˡᵉ ᵗʰᵃᵗ ˢᵗʳᵘᵍᵍˡᵉ ᵇᵉᶜᵃᵘˢᵉ ᵒᶠ ᵖᵒᵒʳᵉʳ ᵉʸᵉˢⁱᵍʰᵗ ᵒʳ ᵉᵛᵉⁿ ᵗʰᵒˢᵉ ᵗʰᵃᵗ ʲᵘˢᵗ ʰᵃᵛᵉ ᵖʰᵒⁿᵉˢ ʷⁱᵗʰ ˢᵐᵃˡˡᵉʳ ˢᶜʳᵉᵉⁿˢ – Sayse Apr 9 '15 at 10:28
  • I really like the way you presented it. Since the design also has the change of color to indicate the health of the problem I guess that should help them. – Siva-Dev-Wizard Apr 9 '15 at 10:30
  • 1
    @Siva-Dev-Wizard - That doesn't help those that are colour-blind all that much though :) (another reason the display shows both) – Sayse Apr 9 '15 at 13:17
  • You think to the extremes Sayse. :) – Siva-Dev-Wizard Apr 9 '15 at 13:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.