界面标注流程.pdf

Android APP 界面标注、尺寸换算和 APP 标注工具 众所周知，对追求高还原的移动 APP 产品来说，移动 APP 设计稿上的精确尺寸 标记是必不可少的的一步。很多设计师都抱怨 APP 程序员做的效果太差，跟设 计图相差太多，你有没有提供最规范的 Android APP 界面标注 尺寸呢？ 有没有 提供设计师的 UI 设计规范给程序员呢？ 其实，作为一名移动 APP 设计师，这些我们都应该在于 Android 程序员沟通好 的基础上，尽最大的努力为他们提供最全的设计规范和设计标注、测量等信息。 下面是某安卓设计师的实践和工作总结。值得参考，也可以说是设计 Android APP 的最佳实践 ： 1. 画布大小定位 720 x 1280 ，72 dpi 2. 只使用偶数单位的尺寸，比如 96 px 的列表项高度， 16 px 的边距， 64 px 的图标边长 3. 只使用 24 pt ，28 pt ，36 pt 和 44 pt 的字体 4. 设计完成以后，所有尺寸的 px 值除以 2 作为 dp 数值交给工程师 5. 所有字体的 pt 值除以 2 作为 sp 数值交给工程师 6. 所有切图变成三份，分别是原始大小、缩小 1.5 倍，缩小 2 倍，分别作为 xhdpi ，hdpi ，mdpi 的资源交给工程师 具体的如下图： 下面是一些解答你疑问的安卓术语啦！ 为什么要选择 720*1280 来作为设计稿，而且分辨率设置为 72 因为 320 dpi 屏幕的分辨率最常见的是 720 x 1280 ，以这个尺寸作为画布尺 寸，是最带感的，这样的设计稿就和应用在最多数的 320 dpi 的机器上运行起 来的样子一样。 而且挑密度最大的，因为图片缩小比放大好，放大会失真，选 320 dpi 作为目 标屏幕，为其他屏幕提供图片时，只需要缩小。 72 dpi 是 Photoshop 的默认设置，不要改就好，这个数字和后面的换算有关 系。 Android 4.0 以后的设计规范中建议只使用四种字号，分别是 12 sp ，14 sp ， 18 sp 和 22 sp ，这也是 Android framework 用到的全部字号。 下面 25 学堂根据前辈的一些经验，分享 2 个安卓字体的换算方式： 有两种算法： 算法一 根据 dp 的定义 「在 160 dpi 的屏幕上， 1 dp 大约等于 1 px 」，那么在 320 dpi 的屏幕上，1 dp 约等于 2 px ，我们就是为 320 dpi 做的设计，所有 px 值 除以 2 就是 dp 值。字体略复杂一点， 1 pt = 1 / 72 inch ，即在 72 dpi 的 画布上，1 pt = 1 px ，我们的画布就是 72 dpi ，又有 1 sp 约等于 2 px （同 dp 的定义），所以 1 sp = 2 pt ，所有 pt 值除以 2 就是 sp 值。 算法二 可以想象是把一个 320 dpi 的手机屏幕放大到了 Photoshop 里，放大倍数是 320 / 72 ，即手机上的 1 dp ，在画布上就是 320 / 72 dp ，而 1 dp = 1 / 160