CC'ing the mailing list so that we can have this archived.
On Tue, Jun 3, 2014 at 12:50 PM, Bernd Sitzmann bsitzmann@wikimedia.org wrote:
Hi Vibha and Moiz,
I think we should look at the icons a bit more for the full release. The icon we have for editSave is from the Android Icon Pack https://developer.android.com/design/downloads/index.html, which is great but the other icons we have are much thicker, like the one for ToC. So, for beta having consistency within the app is good enough, but eventually we should get closer to the platform icon style. The Iconography Guide for Android http://developer.android.com/design/style/iconography.html also calls for less opacity in the action bar icons.
(1) Table of Contents icon: [seems very thick and fuzzy compared to the editSave from Android Icon Pack below. I think it has too much padding and by our code scaling it up to 48dp it becomes fuzzy. We should scale our fake action bar icons to just 32dp BTW.]
[image: Inline image 1]
(2) editSave from Android Icon Pack:
[image: Inline image 4]
(3) our editSave icon: [too much padding --> seems too small]
[image: Inline image 3]
Here is the latter with the rest of the screen:
I also think that the *launcher icon* should either not have any rounded border at all. At least, we should use a different icon for the action bar, like shown here (using the same icon as in the search fragment: search_w):
The Iconography Guide for Android http://developer.android.com/design/style/iconography.html states that the launcher icon should be a distinct silhouette. See also Android Design in Action: Football Apps + Launcher Icons https://developers.google.com/live/shows/97567912, you can skip to minute 22, when launcher icons are covered. Thank you, Bernd
Just resolved this with Yuvi, here is the summary
All iconography will use the wikifont https://github.com/munmay/WikiFont/blob/master/Screenshot-current.png, so our visual language is consistent. Small variations if needed on platform are ok (for instance the 'more' icon can be vertically oriented on Android, but will be horizontal on IOS). Stroke weights will be consistent so iconography looks like its part of a set. In some cases this means, replicating an Android icon in a heavier stroke weight and making it part of wikifont. We will do that as necessary. Visual metaphors will be 99% consistent.
Android uses SVG's. We will submit 'Action Bar' icons with 32 px square canvas and 24 dp focus area to a dropbox folder. Sizes may be different for other things.
IOS uses Wikifont directly.
Please let me know if you have any concerns.
Thanks Vibha
---- Vibha Bamba Senior Designer | WMF Design
On Tue, Jun 3, 2014 at 1:04 PM, Tomasz Finc tfinc@wikimedia.org wrote:
CC'ing the mailing list so that we can have this archived.
On Tue, Jun 3, 2014 at 12:50 PM, Bernd Sitzmann bsitzmann@wikimedia.org wrote:
Hi Vibha and Moiz,
I think we should look at the icons a bit more for the full release. The icon we have for editSave is from the Android Icon Pack https://developer.android.com/design/downloads/index.html, which is great but the other icons we have are much thicker, like the one for ToC. So, for beta having consistency within the app is good enough, but eventually we should get closer to the platform icon style. The Iconography Guide for Android http://developer.android.com/design/style/iconography.html also calls for less opacity in the action bar icons.
(1) Table of Contents icon: [seems very thick and fuzzy compared to the editSave from Android Icon Pack below. I think it has too much padding and by our code scaling it up to 48dp it becomes fuzzy. We should scale our fake action bar icons to just 32dp BTW.]
[image: Inline image 1]
(2) editSave from Android Icon Pack:
[image: Inline image 4]
(3) our editSave icon: [too much padding --> seems too small]
[image: Inline image 3]
Here is the latter with the rest of the screen:
I also think that the *launcher icon* should either not have any rounded border at all. At least, we should use a different icon for the action bar, like shown here (using the same icon as in the search fragment: search_w):
The Iconography Guide for Android http://developer.android.com/design/style/iconography.html states that the launcher icon should be a distinct silhouette. See also Android Design in Action: Football Apps + Launcher Icons https://developers.google.com/live/shows/97567912, you can skip to minute 22, when launcher icons are covered. Thank you, Bernd
