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 的资源交给工程师

具体的如下图:

Android界面设计入门

 

下面是一些解答你疑问的安卓术语啦!

为什么要选择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 inch,所以在画布上就是 2 / 72 inch,而画布是 72 dpi,所以在画布上就是 2 px,即手机上的 1 dp 对应画布上的 2 px。字体的计算一样,只是多一个在 72 dpi 上,1 pt = 1 px 的转换。

至此,都算清楚了,在这个画布上,px 到 dp,pt 到 sp 都是除以 2 的关系。

最后,给 320 dpi 做的图片,到 240 dpi,160 dpi 上就要分别缩小 1.5 倍和缩小 2 倍。

 

第二部分:常用的一些APP标注工具

第一个:马克鳗

马克鳗 APP标注工具

 

 

第二个:苦逼APPUI设计师的标注切图的利器—PxCook

 

PxCook虽然25学堂介绍了好几款移动APP的切图工具和标注的工具。

 

第三个:Sketch.app Measure 标注神器

Sketch.app-Measure-标注神器

这是一款Sketch设计软件的插件,只适合苹果电脑使用。

 

下载地址和安装步骤:

1、https://github.com/utom/sketch-measure 下载最新的版本, 并解压;

2、打开 Sketch.app, Menu (菜单) -> Plugins (插件) -> Reveal Plugins Folder… (显示插件文件夹…);

3、将解压的文件夹复制到 Plugins Folder(插件文件夹)

FROM25xue

转载请注明:优优ui设计网 » Android APP界面标注、尺寸换算和APP标注工具

已标记关键词 清除标记
韦东山老师为啥要录升级版嵌入式视频?<br /><br /> 200x年左右,嵌入式Linux在全世界、在中国刚刚兴起。<br /> 我记得我2005年进入中兴时,全部门的人正在努力学习Linux。<br /> 在2008年,我写了一本书《嵌入式Linux应用开发完全手册》。<br /> 它的大概内容是:裸机、U-boot、Linux内核、Linux设备驱动。<br /> 那时还没有这样讲解整个系统的书,<br /> 芯片厂家Linux开发包也还不完善,从bootloader到内核,再到设备驱动都不完善。<br /> 有全系统开发能力的人也很少。<br /> 于是这书也就恰逢其时,变成了畅销书。<br /> 我也根据这个思路录制了视频:裸机、U-boot、Linux内核、Linux设备驱动。<br /> 收获些许名声,带领很多人进入Linux世界。<br /><br /><strong>11年过去了,嵌入式Linux世界发生了翻天覆地的变化</strong><br /><br /> ① 基本系统能用<br /><br /> 芯片厂家都会提供完整的U-boot、Linux内核、芯片上硬件资源的驱动。<br /> 方案厂家会做一些定制,比如加上某个WIFI模块,会添加这个WIFI模块的驱动。<br /> 你可以使用厂家的原始方案,或是使用/借鉴方案商的方案,做出一个“能用”的产品。<br /><br /> ② 基础驱动弱化;高级驱动专业化<br /><br /> 基础的驱动,比如GPIO、UART、SPI、I2C、LCD、MMC等,有了太多的书籍、视频、示例代码,修修改改总是可以用的。<br /> 很多所谓的驱动工程师,实际上就是“调参工程师”。<br /> 我们群里有名的火哥,提出了一个概念:这些驱动就起一个“hardware enable”的作用。<br /> 高级的驱动,比如USB、PCIE、HDMI、MIPI、GPU、WIFI、蓝牙、摄像头、声卡。<br /><br /> 体系非常复杂,很少有人能讲清楚,很多时候只是一笔带过。<br /> 配置一下应用层工具就了事,能用就成。<br /> 这些高级驱动,工作中需要专门的人来负责,非常专业。<br /> 他们是某一块的专家,比如摄像头专家、音频专家。<br /><br /> ③ 项目为王<br /> 你到一个公司,目的是把产品做出来,会涉及APP到内核到驱动全流程。<br /> 中小公司玩不起华为中兴的配置,需要的是全面手。<br /> 大公司里,只负责很小很小一块的镙丝钉,位置也不太稳固啊。<br /> 所以,如果你不是立志成为某方面的专家,那就做一个全栈工程师吧。<br /><br /> ④ 调试很重要<br /> 都说代码是3分写7分调,各种调试调优技术,可以为你的升职加薪加一把火。<br /> 基于上述4点,我录制的全新视频将有这些特点:<br /> 1. 快速入门,<br /> 2. 实战项目,<br /> 3. 驱动大全,<br /> 4. 专题,<br /> 5. 授人以渔,<br /> 6. 要做任务<br /> 另外,我们会使用多款芯片同时录制,先讲通用的原理,再单独讲各个板子的操作。<br /> 这些芯片涵盖主流芯片公司的主流芯片,让你学习工作无缝对接。<br /><img src="https://img-bss.csdn.net/201911180753564269.jpg" alt="" /><br /><br /><br /><br /> 1.快速入门<br /> 入门讲究的是快速,入门之后再慢慢深入,<br /> 特别是对于急着找工作的学生,对于业余时间挑灯夜读的工作了的人,一定要快!<br /> 再从裸机、U-boot、内核、驱动这样的路线学习就不适合了,时间就拉得太长了。<br /> 搞不好学了后面忘了前面。<br /> 并且实际工作中并不需要你去弄懂U-boot,会用就行:U-boot比驱动还复杂。<br /><br /> 讲哪些内容?<br /><img src="https://img-bss.csdn.net/201911180754297078.png" alt="" /><br /><br /> 怎么讲呢?<br /><br /> 混着讲<br /> 比如先讲LED APP,知道APP怎么调用驱动,再讲LED硬件原理和裸机,最后讲驱动的编写。<br /> 这样可以快速掌握嵌入式Linux的整套开发流程,<br /> 不必像以前那样光学习裸机就花上1、2个月。<br /> 而里面的裸机课程,也会让你在掌握硬件操作的同时,把单片机也学会了。<br /><br /> 讲基础技能<br /><br /> 中断、休眠-唤醒、异步通知、阻塞、内存映射等等机制,会配合驱动和APP来讲解。<br /> 这些技能是嵌入式Linux开发的基础。<br /> 而这些驱动,只会涉及LED、按制、LCD等几个驱动。<br /> 掌握了这些输入、输出的驱动和对应的APP后,你已经具备基本的开发能力了。<br /><br /> 讲配置<br /> 我们从厂家、从方案公司基本上都可以拿到一套完整的开发环境,怎么去配置它?<br /> 需要懂shell和python等配置脚本。<br /><br /><br /> 效果效率优先<br /> 以前我都是现场写代码、现场写文档,字写得慢,降低了学习效率。<br /> 这次,效果与效率统一考虑,不再追求所有东西都现场写。<br /> 容易的地方可先写好代码文档,难的地方现场写。<br /><br /> 2.实战项目<br /> 会讲解这样的涉及linux网关/服务器相关项目(不限于,请多提建议):<br />  <img src="https://img-bss.csdn.net/201911180754541383.jpg" alt="" />            <br />       <br /> 定位为:快速掌握项目开发经验,丰满简历。<br /> 涉及的每一部分都会讲,比如如果涉及蓝牙,在这里只会讲怎么使用,让你能写出程序;如果要深入,可以看后面的蓝牙专题。<br /><br /> 3. 驱动大全<br /> 包括基础驱动、高级驱动。<br /> 这些驱动都是独立成章,深入讲解。<br /> 虽然基础驱动弱化了,但是作为Linux系统开发人员,这是必备技能,并且从驱动去理解内核是一个好方法。<br /> 在讲解这些驱动时,会把驱动的运行环境,比如内核调度,进程线程等概念也讲出来,这样就可以搭建一个知识体系。<br /> 没有这些知识体系的话,对驱动的理解就太肤浅了,等于在Linux框架下写裸机,一叶障目,不见泰山。<br /> 定位为:工具、字典,用到再学习。<br /><br /> 4. 专题<br /> 想深入学习的任何内容,都可独立为专题。<br /> 比如U-boot专题、内核内存管理专题、systemtap调试专题。<br />
相关推荐
©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页