ios和Android APP设计规范要点
android,ios设计规范
android,ios设计规范
在Android和iOS中，设计规范是非常重要的。
这个规范指导着开发人员和设计师如何创建高质量的用户界面和体验。
以下是Android和iOS的设计规范的一些关键要点。
1. Material Design：这是Google为Android设计推出的新规范。
它强调材料和真实感，通过阴影、深度、反射和运动来模拟真实的物体。
这个规范提供了一组可扩展的设计模板和指南，以帮助设计师和开发人员创建一致的应用程序体验。
2. Design for Android：这是为Android设计的老规范，它提供了一组最佳实践和设计指南。
这些指南包括如何设计指令、如何使用标准图标和如何设计用户界面。
3. 安卓适配性方案：由于Android的硬件和软件规范的多样性，应用程序需要适应不同的屏幕尺寸、分辨率和设备特性。
Google提供了一些适配性方案和工具，以帮助开发人员创建适应性强的应用程序。
二、iOS设计规范
2. iOS设计资源中心：这是一个面向开发人员和设计师的网站，提供了许多iOS设计资源，包括模板、图标和样式表。
总结：
设计规范对于应用程序的成功至关重要。
它可以帮助开发人员和设计师创建一致、易于使用的用户界面和体验。
Android和iOS的设计规范都是基于最佳实践和设计原则的。
开发人员和设计师应该尝试遵循这些规范，以帮助他们创建高质量的应用程序。
APP设计规范汇总
APP设计规范汇总1.响应式布局：设计应该适应不同屏幕尺寸和分辨率，以确保在各种设备上显示正常，并提供良好的用户体验。
2.一致的颜色和字体：应用程序中使用的颜色和字体应基于一套设计准则，并保持一致性。
这可以提高可读性和用户体验。
3.导航和菜单结构：在应用程序中，导航和菜单的结构应该简单明了，易于理解和使用。
用户应该能够轻松地找到他们所需的功能。
4.图标和按钮设计：图标和按钮应该具有一致的风格和设计语言，以便用户能够快速识别和操作。
5.图片和媒体素材：在应用程序中使用的图片和媒体素材应具有高质量和适当的分辨率，以确保它们在不同屏幕上显示正常。
6.键盘输入和文本输入：在设计输入字段和文本输入框时，应考虑到不同的输入方式和设备。
应该确保输入体验简单、流畅，并遵循文本输入的最佳实践。
7.错误处理和反馈机制：当应用程序出现错误时，应该提供清晰的错误提示和反馈机制，以帮助用户快速解决问题。
8.手势和交互设计：应该考虑到不同设备上的手势和交互方式，并确保它们易于使用和理解。
9.数据和隐私保护：设计应该确保用户数据的安全性和隐私保护，包括适当的安全措施和隐私政策。
10.文档和帮助：为应用程序提供清晰的文档和帮助指导，以帮助用户了解如何使用和解决问题。
11.可访问性和无障碍设计：设计应该考虑到残障人士和特殊需求用户的使用情况，并采取相应的无障碍设计措施。
12.应用程序性能和优化：设计应该考虑到应用程序的性能和优化，以确保应用程序在各种条件下都能流畅运行。
总之，APP设计规范是确保应用程序具有一致性、易于使用和良好用户体验的关键因素。
通过遵循这些规范，设计师和开发人员可以创建出优秀的移动应用程序。
手机APP的用户界面设计原则与规范
手机APP的用户界面设计原则与规范手机APP已经成为我们日常生活中不可或缺的一部分。
一个好的用户界面设计可以提升用户体验，增加用户粘性，使用户更愿意使用和推荐这个APP。
本文将介绍手机APP的用户界面设计原则与规范，帮助开发者们设计出更好的用户界面。
一、简洁明了手机屏幕相对较小，用户界面设计必须简洁明了，避免过多的文字和复杂的图标。
保持页面干净整洁，突出核心功能，减少用户的操作步骤。
界面元素的布局要紧凑合理，避免拥挤和混乱。
二、一致性用户界面设计应该保持一致性，使用户在不同页面之间能够直观地找到相同的功能和操作方式。
统一的颜色、字体、按钮样式等可以帮助用户养成使用习惯，并提高用户的操作效率。
同时，符合平台的设计规范也是提高一致性的重要手段。
三、易用性用户界面设计应该注重易用性，使用户能够轻松地完成任务并且愉快地使用APP。
采用直观的图标和标签，提供明确的反馈，避免模糊的操作提示和歧义的词语。
合理设置大小适中的点击目标，避免用户操作的困难。
四、可访问性用户界面设计应该考虑到不同用户的需求和特殊情况，提供良好的可访问性。
比如，支持字体大小调整，提供语音识别或图像识别的辅助功能，以帮助视力或听力有障碍的用户正常使用APP。
同时，要保持对色盲、弱视等视觉问题的关注，避免过于依赖颜色作为界面信息的区分。
五、视觉吸引力用户界面设计不仅要实用，还要具备一定的视觉吸引力。
选择合适的颜色、图片和图标来营造良好的用户体验，避免单调和枯燥的界面。
注意使用相应的配色和设计风格，使整个APP的界面风格统一，给用户一种整体的美感。
六、反馈机制用户界面设计要及时提供反馈机制，让用户了解他们的操作是否成功，并且给予必要的提示和指导。
比如，在用户点击按钮后添加合适的动画或弹窗，显示加载进度或错误信息，避免用户的困惑和焦虑。
同时，及时的推送通知也是提高用户参与度的重要手段。
七、易学性用户界面设计应该易于学习，即使是新用户也能够快速上手。
app设计规范简述-精
一、Android：
确定GUI需求——手机屏幕的大小 象素尺寸是目前较常见的手机屏幕尺寸，在设计时
可以根据实际产品要求进行设计，更大的屏幕可以 有更多的交互表现和视觉元素的支持，较为自由。 128×160 176×220 240×320（较多） 480×320
480×800（三星Galaxy S II，Andriod多用) 960×640（iPhone4: 3.5英尺 分辨率330dpi）
2-2 iphone4 –规范
3、IOS 文字规范:
2-2 iphone4 –规范
3、IOS 文字规范:
2-2 iphone4 –规范
3、图片/头像/缩略图数据参考：
头像
相册
头像
商品列表 商家图片 日志图片
格子铺 商家优惠 活动礼券
未知数
小
中
大 做略图
全屏
缩略图 小
缩略图 小
缩略图 缩略图 缩略图
2-1界面设计规范
导航栏：
高宽： 8 8 * 6 4 0 P X 坐标： 0 . 4 0 字体大小：按钮中文字24px / 导航标题3 4 p x 说明：位于“状态栏”下方，进入某些卡片后显示其当前位置的区域，包含2个控件（左右） 不能改变其高度以及样式轮廓（如“返回”样式轮廓是向左侧的三角，改变它的特征将会降 低iPhone使用者对己熟悉样式轮廓的对应操作理解）。并且需要注意“导航栏外观、导航栏 按钮”的视觉元素必须始终保持一致性，在其他卡片中时。 注:导航栏在例如“网页”状态时，则会改变其高度，或其特殊设计时，此时高度为120px
大 缩略图 缩略图
小 banner
80*80
124*124
140*140 200*150 960*640
APP UI 设计规范
SP与DP介绍
dp：device independent pixels(设备独立像素)。 sp：scaled pixels(放大像素)， 主要用于字体显示best for textsize。 由此，根据 google 的建议，TextView 的字号最好使用 sp 做单位，而 且查看TextView的源码可知 Android 默认使用 sp 作为字号单位。
401 ppi 326 ppi 326 ppi 326 ppi
54 px 40 px 40 px 40 px
132 px 88 px 88 px 88 px
Байду номын сангаас146 px 98 px 98 px 98 px
ppi（pixels per inch）即每英寸像素，也叫像素密度。
图标尺寸
设备
APP store
IOS ＆ Android APP UI设计规范
iOS 篇
iOS 界面尺寸
设备
分辨率
PPI
状态栏高度 导航栏高度 标签栏高度
Iphone6 plus Iphone6/6s
Iphone5/5c/ 5s Iphone4/4s
1080x1920 px
750x1334 px
640x1136 px
640x960 px
保证在双平台上大部分机型开发中不会 出现模糊的变形的问题；而且只需设计一套 设计稿，减少设计师的工作量，提高工作效 率。
图标网络
Apple使用黄金分割在它们的一些图标上。这让图标保持良好的比例，同 时确保了美感。虽然这是一个很好的规范，但它不是严格要求。甚至Apple 在很多图标上也省略了它。
标准色
sp和dp一样，是android开发里特有的单位，设计师在做UI设计的 时候 通常最初是建立320*480这个尺寸的画布开始的，这个尺寸的画布 在android分辨率的分类中称为mdpi，在这个尺寸下，ps里的1px就等于 android中的1dp，同样，这个时候1点的字就等于 android中1sp，举个 例子：你建立画布的尺寸是320-480，里面的文字是30点，那么它就是 30sp。
UI设计规范
一.APP设计规范(ios)————设计稿一般不使用Android的尺寸（因为Android的五花八门）1. iphone界面的设计尺寸（设计稿默认iphone6）（1）iphone6 plus设计版[iPhone7 plus]（@3x）分辨率1242x2208px ppi:401 状态栏：60px 导航栏：132px 标签栏：146px（2）iphone6 plus放大版（@3x）分辨率1125x2001px ppi:401 状态栏：54px 导航栏：132px 标签栏：146px（3）iphone6 plus物理版（@3x）分辨率1080x1920px ppi:401 状态栏：54px 导航栏：132px 标签栏：146px（4）iphone6 [iPhone7]（设计稿默认）（@2x）分辨率750x1334px ppi:326 状态栏：40px 导航栏：88px 标签栏：98px（5）iphone5 - 5c -5s（@2x）分辨率640x1136px ppi326 状态栏：40px 导航栏：88px 标签栏：98px（6）iphone4 – 4s（@2x）分辨率640x960px ppi:326 状态栏：40px 导航栏：88px 标签栏：98px（1）iphone & ipod Touch第一、二、三代（@1x）分辨率320x480px ppi:163 状态栏：20px 导航栏：44px 标签栏：49px2. iphone图标设计尺寸（1）iphone6 plus （@3x）App store：1024x1024px 程序应用：180x180 主屏幕：152x152 Spotlight搜索：87x87px 标签栏：75x75px 工具栏和导航栏：66x66px（2）iphone6（@2x）App store：1024x1024px 程序应用：120x120 主屏幕：152x152 Spotlight搜索：58x58px 标签栏：75x75px 工具栏和导航栏：44x44px（3）iphone5-5c-5s（@2x）App store：1024x1024px 程序应用：120x120 主屏幕：152x152 Spotlight搜索：58x58px 标签栏：75x75px 工具栏和导航栏：44x44px（4）iphone4-4s（@2x）App store：1024x1024px 程序应用：120x120 主屏幕：114x114 Spotlight搜索：58x58px 标签栏：75x75px 工具栏和导航栏：44x44px（5）iphone & ipod Touch第一、二、三代（@1x）App store：1024x1024px 程序应用：120x120 主屏幕：57x57 Spotlight搜索：29x29px 标签栏：38x38px 工具栏和导航栏：30x30px3. ipad界面设计尺寸（1）ipad3 – 4 - 5 – 6 – Air – Air2 – mini2分辨率2048x1536px ppi:264 状态栏：40px 导航栏：88px 标签栏：98px（2）ipad1 – 2分辨率1024x768px ppi:132 状态栏：20px 导航栏：44px 标签栏：49px（2）ipad Mini分辨率1024x768px ppi:163 状态栏：20px 导航栏：44px 标签栏：49px4. ipad图标设计尺寸（1）ipad3 – 4 - 5 – 6 – Air – Air2 – mini2App store：1024x1024px 程序应用：180x180 主屏幕：144x144 Spotlight搜索：100x100px 标签栏：50x50px 工具栏和导航栏：44x44px（2）ipad1 – 2App store：1024x1024px 程序应用：90x90 主屏幕：72x72 Spotlight搜索：50x50px 标签栏：25x25px 工具栏和导航栏：22x22px（3）ipad MiniApp store：1024x1024px 程序应用：90x90 主屏幕：72x72 Spotlight搜索：50x50px 标签栏：25x25px 工具栏和导航栏：22x22px5. ios字体大小规范iPhone 上的字体英文为：HelveticaNeue 至于中文，Mac下用的是黑体-简，Win下则为华文黑体，所有字体要用双数字号。
APP界面UI设计规范
UI设计规范一、APP界面设计规范（一）界面尺寸1、IOS界面尺寸：常见为（宽度640px、高度1136px）2、Android界面尺寸：常见为（宽度720px、高度1280px）其他尺寸：ldpi（240*320）、mdpi（320*480）、hdpi（480*800）3、Web Mobile尺寸：常见为（宽度640px、高度960px）（二）导航尺寸1、IOS导航尺寸：高度60px，留白7px2、Android导航尺寸：高度64px或48px，留白8px（三）标签尺寸1、IOS标签尺寸：高度98px2、Android标签尺寸：高度96px（四）工具栏尺寸1、IOS工具栏尺寸：高度88px2、Android工具栏尺寸：高度96px（五）列表高度1、IOS列表高度：高度88px2、Android列表高度：高度96px（六）资源状态对于资源通常设计弹起、点击、点击后、不可用四种状态，通常弹起、点击、点击后用不同颜色表示、不可用状态用低度灰色表示。
（七）字体1、IOS默认英文为HelveticalNeue，中文为黑体2、Android列表高度：默认为Droidsans fallback（八）字号字号通常按照标题及征文级别递减为42、36、34、30、24 （九）ICON1、IOS常用尺寸有1024*1024、512*512、120*120、60*602、Android常用尺寸有512*512、200*200、72*72、48*48 （十）资源插图1、长方形插图高度一般不超过背景宽度的二分之一2、缩略图两张并列高度一般不超过200px，宽度要适中有留白3、图文混排中图片一般不高过150*110。
安卓app设计规范
安卓app设计规范安卓App设计规范是指在开发安卓App时遵循的一系列设计准则和规范，旨在提高App的用户体验，统一界面风格，提升应用的可用性和易用性。
本文将详细介绍一些常见的安卓App设计规范。
1. 布局规范：使用线性布局和相对布局等常见的布局方式，确保界面简洁、直观，并且适应不同屏幕尺寸和设备方向的变化。
2. 导航规范：使用标准的导航栏和工具栏，并保持其位置和行为的一致性。
在移动设备上，通常将导航栏放置在屏幕的顶部，工具栏放置在底部。
3. 字体规范：使用易读的字体，字号适中，避免使用过小或过大的字体。
同时，确保字体颜色与背景色有足够的对比度，以提高可读性。
4. 图标规范：使用标准的图标，保持外观和行为的一致性。
图标应该具有简单明确的意义，并且在不同尺寸和分辨率下能够清晰可见。
使用统一的配色方案，确保界面整体的一致性。
遵循Material Design的颜色原则，使用原色、辅助色和弱化色来进行配色。
6. 输入规范：对于用户输入，应提供明确的输入字段和输入提示。
同时，根据不同的输入类型，使用合适的输入控件（如文本框、下拉列表等）。
7. 图片规范：使用高质量的图片，确保图像在不同尺寸和分辨率下都能够清晰显示。
对于长图片，可以使用合适的裁剪方式来保持其可见区域。
8. 动画规范：运用适度的动画效果，以提高用户体验。
动画应该流畅、自然，并且不应过度使用，以免分散用户注意力。
9. 按钮规范：使用标准的按钮样式和行为，在按下时有合理的反馈效果（如变色、变形等）。
按钮的位置和大小应合理，以便用户轻松点击。
对于重要的提示和错误信息，应使用明确的文字和图标来进行标识。
同时，可以结合合适的动画效果，使其更加显眼和易于注意。
综上所述，安卓App设计规范涉及到的方面很多，包括布局、导航、字体、图标、颜色、输入、图片、动画、按钮和消息等等。
这些规范能够帮助开发者设计出更加符合用户习惯和期望的App，提高用户的满意度和使用体验。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
相信很多人都在开发设计APP时会遇到很多界面上的问题，要以多大尺寸来设计？分辨率是多少？该怎么切图给开发等等
下面的文字就给出一点点技巧总结，但也要给合团队在开发时的习惯。
每个工程师们所使用的控件，书写布局习惯来实际移交的图是不一样的，但八九不离十，都是遵循一个原则，便捷开发、自适应强的开发模式
IOS篇
一、尺寸及分辨率
iPhone界面尺寸：320*480、640*960、640*1136
iPhone6：4.7英寸(1334×750)，iPhone6 Plus：5.5英寸(1920×1080)
设计图单位：像素72dpi。
在设计的时候并不是每个尺寸都要做一套，尺寸按自己的手机来设计，比较方便预览效果，一般用640*960或者640*1136的尺寸来设计，现在iphone6和plus出来后有很多人会使用6的设计效果。
如果是我来做的话，我会使用640×1136，对plus做单独的修改适配，因为plus的屏幕实在是大了，遵循屏大显示更多内容的原则这里本应该是需要修的了。
有更好办法的话希望大家可以分享一下。
Ps：作图的时候确保都是用形状工具(快捷键：U)画的，这样更方便后期的切图或者尺寸变更。
二、界面基本组成元素
iPhone的app界面一般由四个元素组成，分别是：状态栏(status bar)、导航栏(navigation)、主菜单栏(submenu)、内容区域(content)。
这里取用640*960的尺寸设计，那我们就说说在这个尺寸下这些元素的尺寸。
状态栏(status bar)：就是我们经常说的信号、运营商、电量等显示手机状态的区域，其高度为：40px
导航栏(navigation)：显示当前界面的名称，包含相应的功能或者页面间的跳转按钮，其高度为：88px
主菜单栏(submenu，tab)：类似于页面的主菜单，提供整个应用的分类内容的快速跳转，其高度为：98px
内容区域(content)：展示应用提供的相应内容，整个应用中布局变更最为频繁，其高度为：734px
至于我们经常说的iPhone5/5s的640*1136的尺寸，其实就是中间的内容区域高度增加到910px。
PS：在最新的iOS7的风格中，苹果已经开始慢慢弱化状态栏的存在，将状态栏和导航栏合在了一起，但是再怎么变，尺寸高度也还是没有变的，只不过大家在设计iOS7风格的界面的时候多多注意下~
三、字体大小
iPhone上的字体英文为：HelveticaNeue 。
至于中文Mac下用的是黑体，Win下则为华文黑体(最新字体称为黑体-简)。
下图是百度用户体验做过的一个小调查，可以看出用户可接受的文字大小。
四，切图
切图是APP设计中的一个重要过程，关系到APP的界面实现，及各种适配性还有各种性能
IOS在没6plus前，我们只需要提供两种图，普通图及视网膜屏幕图。
以640×1136（640×960是一样的）做的设计图的话就会好办一点。
直接出设计图上的原大小图标，比如我们命名一个图片叫 img-line.png，我们给开发的图就要改变这个名字叫 img-line@2x.png 就是在后缀名前加上@2x表示视网膜屏的图，iPhone4的还需要把这个图尺寸按比例缩小50%，得到正真的img-line.png。
然后把这两个图移交给开发，iPhone6的图在规范里是与5s使用的是一样的，也是@2x图。
有些UI则需要做适当的适配，比如拉长，拉高，这个开发会去做。
对于IPhone6 plus的话范里给出的是@3x相信大家也知道是怎么回事，但如果要使用PS放大的话，大家做图的时候就需要使用形状工具来做，放大后还需要仔细微调，这里就不多做讲解
温馨提示：在出可按的图片切图时需要注意图片的可按区域大小，有时图标很小，实际切出来的放在上面，用手指是按不到的，我们就需要对图片单独处理，拓宽图片的有效区域，这里是拓宽非放大，就是改变画布大小使图片尺寸面积扩大，使图片四周拓宽多余的透明区域，从而改变可按大小。
五，颜色值问题
IOS颜色值取 RGB各颜色的值比如某个色值，给予IOS开发的色值为 R:12 G:34 B:56 给出的值就是 12,34,56(有时也要根据开发的习惯，有时也用十六进制)；Android开发的色值则使用十六进制 #0c2238
ANDROID篇
一、尺寸及分辨率
Android界面尺寸：480*800、720*1280、1080*1920
Android比iPhone的寸尺多了很多套，建议取用720*1280这个尺寸，这个尺寸720*1280中显示完美，在1080*1920中看起来比较清晰，切图后的图片文件大小也适中，应用的内存消耗也不会过高。
二、界面基本组成元素
Android的app界面和iPhone的基本相同：状态栏、导航栏、主菜单、内容区域。
Android中我们取用的720*1280的尺寸设计，那我们就说说在这个尺寸下这些元素的尺寸。
状态栏高度为：50px
导航栏高度为：96px
主菜单栏高度为：96px
内容区域高度为：1038px(1280-50-96-96=1038)
Android最近出的手机都几乎去掉了实体键，把功能键移到了屏幕中，当然高度也是和菜单栏一样的：96px
Android为了在界面上区别于iOS，Android4.0开始提出的一套HOLO的UI风格一些app的最新版本都采用了这一风格，这一风格最明显的变化就是将下方的主菜单移到了导航栏下面，这样的方式解决了现在很多手机去除实体键后再屏幕中显示而出现的双底栏的尴尬情景。
三、字体大小
Android 上的字体为：Droid sans fallback，是谷歌自己的字体，与微软雅黑很像。
同样，百度用户体验的调查中，可以看出用户可接受的文字相应问题。
具体大小，还是那句话，找自己喜欢的app界面，手机截图后放进PS自己对比调节字体大小，切记，一定是高清截图
四，切图
Android设计规范中单位是dp，dp在安卓机上不同的密度转换后的px 是不一样的，所以按照设计图的px转换成dp也是不一样的，这个可以使用转换工具转换，开发一般会有，也有些开发会使用px做单位，因为做了前期的转换工作
五，颜色值问题
Android颜色值取值为十六进制的值比如一绿色的值，给开发的值为 #5bc43e。