android 平面图app_安卓app设计规范整理和Android APP设计篇-程序员宅基地

技术标签: android 平面图app  

随着安卓智能手机不停的更新换代。安卓手机系统越来越完美,屏幕尺寸也越来越大啦!比如最近小米的miui 6的发布和魅族手机系统的更新等等。

以小米MIUI6的安卓手机来说,MIUI6进行了全新设计,坚持“内容才是本质”的设计哲学,重新提炼内容,简化图标设计。

所以,我们在进行安卓APP设计时,需要好好调整之前的设计规范和设计细节。根据目前流行的安卓手机的系统体验来完成我们的安卓APP设计规范。应该说这是整理出最全面的安卓app设计规范。

25学堂站在不断更新和完善安卓app设计规范为宗旨!利用周末的时间整理了2014年Android APP设计规范教程。

1、安卓app设计规范之尺寸或分辨率

目前最新安卓手机的屏幕尺寸都是5.5英寸啦。我们都知道安卓机的尺寸很多很杂。而且不同的分辨率对应不同的dpi模式。

Android也支持多种不同的dpi模式:ldpi   mdpi   hdpi     xhdpi   xxhdpi    xxxhdpi(4K分辨率)

关于安卓APP设计的dpi详细解读请查看:

目前主流的安卓手机分辨率有以下3种:

hdpi,对应800*480的手机。主流机型,很多。如小米1 ,1s 三星 htc 等

xdpi,对应1280*720的手机。三星Galaxy系列和华为p6.

xxdpi,对应1080*1920的手机。小米手机,华为荣耀手机系列为主加上 htc one。

下面是当面流行的安卓手机的屏幕尺寸和分辨率:

小米 3和小米4 屏幕尺寸和分辨率:        5英寸 1920x1080像素

魅族MX2 屏幕尺寸和分辨率:                 4.4英寸 1280x800像

魅族MX3 屏幕尺寸和分辨率:                 5.1英寸 1800x1080像素

HTC  one屏幕尺寸和分辨率:               4.7英寸 1920x1080像素

华为荣耀6屏幕尺寸和分辨率:             5英寸 1920x1080像素

华为p6屏幕尺寸和分辨率:                 4.7英寸 1280x720像素

华为p7屏幕尺寸和分辨率:                  5英寸 1920x1080像素

在目前我们的安卓APP设计项目当中,我们并不会去为每一种分辨率去设计一套UI界面。这是一种追求完美和理想的状态。小公司肯定是耗不起这样的。

所以,这个时候我们需要学会变通。为了适应多分辨率,

1:在标准基础(xdpi:1280*720)上开始,然后放大或缩小,以适应到其他尺寸。

2:从设备的最大尺寸(xxdpi:1920x1080)开始,然后缩小,并适应到所需的最小屏幕尺寸。

有些时候我们也会在实际开发过程中,Android和IOS的设计稿若无太大差异,也可从IOS的分辨率(960*640)开始,再调整设计稿的比例,适应其他分辨率。但是这种方法在切图的时候 需要做一些图片的调整。如果不是矢量图的元件需要重新按照1280*720的尺寸设计下。

2、安卓app设计规范之字体和字体大小

我们必须知道的安卓设计常识:安卓4.0之后用的字体是Roboto。中文字体:方正兰亭黑体

今天跟大家讲解的是在720*1280的基础上的字体设计大小。

注释最小字体:               12sp  ==  24px

文本字体:                       14sp  ==  28px

文章标题或图标名称:   16sp  ==   32px

导航标题:                       18sp  ==   36px

SP的详细介绍如下:

sp和dp一样,是android开发里特有的单位,设计师在做UI设计的时候通常最初是建立320*480这个尺寸的画布开始的,这个尺寸的画布在android分辨率的分类中称为mdpi,在这个尺寸下,ps里的1px就等于android中的1dp,同样,这个时候1点的字就等于android中1sp,举个栗子:你建立画布的尺寸是320-480,里面的文字是30点,那么它就是30sp。

一般android设置长度和宽度多用dip,设置字体大小多用sp. 在屏幕密度为160,1dp=1px=1dip, 1pt = 160/72 sp  1pt = 1/72 英寸.当屏幕密度为240时,1dp=1dip=1.5px.

设计时候,我们还需要遵循48dp定律。

48dp作为安卓可触摸的UI元件的标准。

一般来说,48dp转化为一个物理尺寸约9毫米。建议的目标大小为7-10毫米的范围,这是一个用户手指能准确并且舒适触摸的区域。

如果你设计的元素高和宽至少48dp,你就可以保证:

(1). 触摸目标绝不会比建议的最低目标(7mm)小,无论在什么屏幕上显示。

(2). 在整体信息密度和触摸目标大小之间取得了一个很好的平衡。

而每个UI元素之间的空白通常是8dp.

下面是某个安卓APP设计师对android设计做出的一个设计信息图总结。

3、安卓app设计规范之切图

这块需要按照设计按照下面4篇文章来了解安卓app设计标注和切图的一些规范。这里不做详细解说了。

4、安卓app设计规范之适配和设计图测试预览

(1)尺寸标注工具 MarkMan(马克鳗)

(2)APP快速切图工具:Cutterman

(3)一个可视化的Android UI界面设计工具:DroidDraw

(5)设计图完成之后,预览工具和在线预览方法介绍:Ps play

(6)在线生成自定义APP图标字体利器:IconVault

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_39847556/article/details/111551450

智能推荐

白塞氏病遗传吗?-程序员宅基地

文章浏览阅读309次。很多人在白塞氏病的阴影下,迟迟的难以走出,原因就是得不到良好的治疗。这部分患者中有一些是年轻的夫妇,这给打算要孩子的他们无疑带来了很大的困扰。自己本已饱受白塞氏病之苦,如果此时打算要孩子会不会遗传给孩子,让孩子继续这痛苦和折磨?本章就由专家为大家讲解。首先,专家介绍说白塞氏病是一种自身免疫性疾病,临床上以口腔溃疡、生殖器溃疡、眼炎及皮肤损害为突出表现,但是并不会对患者的生殖系统内部产生影响,造成...

python image模块安装_Python库 - PIL 之 Image 模块-程序员宅基地

文章浏览阅读1.5k次。PIL Python包的安装:sudo pip install PillowImage 模块是 PIL 图像处理的一个类,其提供了很多函数,包括图片加载,创建新图片等.例如:图片旋转 45 度:from PIL import Imageimg = Image.open("test.jpg")img.rotate(45).show() #旋转创建缩略图(thumbnails):from PIL i...

2D人体姿态估计 - Numerical Coordinate Regression with Convolutional Neural Networks(DSNT)-程序员宅基地

文章浏览阅读1.5k次,点赞2次,收藏7次。参考 :【论文阅读笔记】Numerical Coordinate Regression with Convolutional Neural Networks_时光机゚的博客-程序员宅基地论文地址:Numerical Coordinate Regression with Convolutional Neural Networks代码地址:GitHub - anibali/dsntnn: PyTorch implementation of DSNT一、论文总结  本文提供了一种从图像中直接学._numerical coordinate regression with convolutional neural networks

最新的目标检测的方法_目标检测的新方法-程序员宅基地

文章浏览阅读1.1k次。最新的目标检测的方法I will start with a short introduction of different approaches to object detection. After both traditional and newer approaches are presented, you can read about the most important parts of ..._需要学习的新检测方式

将GIT仓库从Github导入到Git@OSC-程序员宅基地

文章浏览阅读84次。为什么80%的码农都做不了架构师?>>> ..._git仓库导入到gitosc

代码审计中应注意的命令执行函数以及命令-程序员宅基地

文章浏览阅读871次,点赞23次,收藏24次。在ob_start系统的callback函数中,如果指定的callback函数包含执行代码,那么也可能是执行代码的来源。类似于os.system(),subprocess.call()运行一个命令,等待它完成,然后返回返回码。该函数可以创建一个匿名(匿名)函数,但如果函数的代码是由用户输入构造的,可能会执行不安全的代码。这两个函数可以调用一个用户定义的函数,如果传递的是含有系统命令的字符串,可能被用来执行代码。更复杂的执行外部程序的方法,允许双向通信,读写进程的 STDIN 和 STDOUT。

随便推点

面试:史上最全多线程面试题 - (锁&内存模型&线程)_多线程锁面试题-程序员宅基地

文章浏览阅读1.1w次,点赞77次,收藏549次。多线程经典面试题59问。1.什么是活锁、饥饿、无锁、死锁?死锁、活锁、饥饿是关于多线程是否活跃出现的运行阻塞障碍问题,如果线程出现 了这三种情况,即线程不再活跃,不能再正常地执行下去了。死锁死锁是多线程中最差的一种情况,多个线程相互占用对方的资源的锁,而又相互等 对方释放锁,此时若无外力干预,这些线程则一直处理阻塞的假死状态,形成死锁。 举个例子,A 同学抢了 B 同学的钢笔,B 同学..._多线程锁面试题

ubuntu安装qt5或安装qtcreator及其环境配置_trojan qt5 for ubuntu-程序员宅基地

文章浏览阅读1.3k次。下载qt官网:http://download.qt.io/archive/qt/安装进入下载的.run所在位置输入如下指令 chmod a+x qt-opensource-linux-x64-5.12.5.run sudo ./qt-opensource-linux-x64-5.12.5.run然后输入账号密码(没有的话注册一个)按需求选择其他的,但gcc必须选,sources也可以按需求选,其他一般可以不选环境配置配置环境变量后才能直接使用qmake命令 sudo gedit /_trojan qt5 for ubuntu

CodeForces 805B 3-palindrome_codeforce palindrome sequence [2],[1,2,1,3]-程序员宅基地

文章浏览阅读872次。题目链接:http://codeforces.com/contest/805/problem/B 题意:让你构造一个长度为n的字符串,这个字符串只有abc构成,要求没有长度为3的回文子串,且c要尽可能的少 解析:aabbaabb这样子的貌似就没有长度为3的回文子串了,那就直接输出呗……#include using namespace std;int main(v_codeforce palindrome sequence [2],[1,2,1,3]

阿里云EMR2.0平台:让大数据更简单_emr 数据-程序员宅基地

文章浏览阅读1.1k次。作为国内开源大数据领域的引领者,EMR2.0在平台体验、数据开发、产品形态及数据分析等方面做了全面突破与创新,重新定义了新一代开源大数据平台。本文介绍如何利用EMR新平台实现更加低成本、高效率、智能化的大数据集群管控和应用开发。_emr 数据

复数混频发射机原理与仿真_实数混频和复数混频-程序员宅基地

文章浏览阅读2.3k次,点赞4次,收藏46次。1、复数混频发射机原理上图采用的是上变频复数混频的原理图。IQ链路有自己的混频支路,本振LO功分两路,两路的相位相差90°,两个独立输出随后在求和放大器中求和,产生所需的RF输出。若只输入I路信号x或者Q路信号x,那么输出只会产生LO频率±x的输出;另一路没有输入,输出为静音,最终结果为有信号的一路直接称为RF输出。乍一看没啥差异,其实上面两幅图中有一个相位差异在里面。上图可以观察到:LO频率加输入频率的信号是同相的(上边带),但L..._实数混频和复数混频

ios创建证书文件_创建ios证书文件-程序员宅基地

文章浏览阅读541次。在处理本文中这些操作之前你得有一个开发者账号(可以从苹果官网申请)1、打开钥匙串,在本地创建证书csr文件CSR文件:生成证书的过程中,有一步是需要我们上传CSR文件的。为什么必须要上传它?CSR文件是用于换取证书的公钥文件,导出CSR这个过程其实就是电脑向证书机构申请凭证的过程。证书是你用电脑制作的并且颁发给你的电脑的。但是这台电脑是否具有制作证书的能力,就是要这个CSR文件来凭证。_创建ios证书文件