10 09/2014

android 图标设计需求

最后更新: Wed Sep 10 2014 12:39:11 GMT+0800

android.com 如果被咔嚓，可以访问下面这个

http://developer.android.com.nyud.net/design/style/iconography.html

为适应各种分辨率，android 分为（高中低分辨率）：LDPI ,MDPI ,HDPI ,XHDPI ,XXHDPI ,XXXHDPI

啥叫 dp

Density-independent pixel —— 分辨率无关的像素

启动图标大小

启动图标大小是：48dp 也就是：

以下单位为像素 px

LDPI 36 x 36
MDPI 48 x 48
HDPI 72 x 72
XHDPI 96 x 96
XXHDPI 144 x 144
XXXHDPI 192 x 192

换算办法：

LDPI is MDPI x 0.75
HDPI is MDPI x 1.5
XHDPI is MDPI x 2
XXHDPI is MDPI x 3
XXXHDPI is MDPI x 4

web 站点（google play）的图标是 512x512

图标样式指南

Pictographic, flat, not too detailed, with smooth curves or sharp shapes. If the graphic is thin, rotate it 45° left or right to fill the focal space. The thickness of the strokes and negative spaces should be a minimum of 2 dp.

图片，平面化设计，不需要太多细节，可以圆角。如果太窄（扁），可以旋转 45 度。边框最细和留边不得低于 2dp。

白是 #ffffff
黑是 #333333
透明 30 60 80 %

菜单区图标

android icon

32dp ，内容最大 24dp（剩下的留白）

通知区图标

24dp 内容最大 22dp

内容区的(小)图标

16dp ，内容最大 12dp（剩下的留白）

设计技巧

原文件做成矢量图
图形原始大小推荐 864x864 大小
位图不能放大（糊了）

命名规则

Asset Type	Prefix	Example
Icons	ic_	ic_star.png
Launcher icons	ic_launcher	ic_launcher_calendar.png
Menu icons and Action Bar icons	ic_menu	ic_menu_archive.png
Status bar icons	ic_stat_notify	ic_stat_notify_msg.png
Tab icons	ic_tab	ic_tab_recent.png
Dialog icons	ic_dialog	ic_dialog_info.png

开发源文件中保存原始 psd 文件

art/...
  mdpi/...
      _pre_production/...
          working_file.psd
      finished_asset.png
  hdpi/...
      _pre_production/...
          working_file.psd
      finished_asset.png
  xhdpi/...
      _pre_production/...
          working_file.psd
      finished_asset.png

注意：每个目录的 finished_asset.png 的文件名是一样的！！

成品 app 中的目录结构是

res/...
drawable-ldpi/...
    finished_asset.png
drawable-mdpi/...
    finished_asset.png
drawable-hdpi/...
    finished_asset.png
drawable-xhdpi/...
    finished_asset.png

成品 app 中的 png 优化（甭把分层的原始 png 直接打包），减少尺寸。推荐工具为 OptiPNG 和 Pngcrush

郭爽点评

万恶的巩骚吹嘘的 native，原来就是这样处理图片的。嗯，web responsive 何在啊？

At last，android 项目的目录结构

MyProject/
  src/  
      MyActivity.java  
  res/
      drawable/  
          icon.png  
      layout/  
          main.xml
          info.xml
      values/  
          strings.xml
      animator/
      anim/
      color/
      menu/
      raw/
      xml/

更多信息：如何在 project 中保存原始设计文件

获取分辨率（dp）

DisplayMetrics metrics = new DisplayMetrics();
Display display = activity.getWindowManager().getDefaultDisplay();
display.getMetrics(metrics);

Digest of guoshuang