APP界面切图命名和文件整理规范(06)

合集下载

APP命名规范

APP命名规范命名规范1. 包命名project+项目名称+模块名称，全部单词用小写字母。

com.project.projectname2. 类和接口命名使用大驼峰规则，用名词或名词词组命名，每个单词的首字母大写。

以下为几种常用类的命名：activity类，命名以Activity为后缀，如：LoginActivityfragment类，命名以Fragment为后缀，如：ShareDialogFragment ?service类，命名以Service为后缀，如：DownloadServiceadapter类，命名以Adapter为后缀，如：CouponListAdapter 工具类，命名以Util为后缀，如：EncryptUtil模型类，命名以Model为后缀，如：CouponModel接口定义类，命名以I为前缀，如IUserService接口实现类，命名以Impl为后缀，如：UserServiceImpl3. 方法命名用动词命名，第一个单词的首字母小写，其他单词的首字母大写。

以下为几种常用方法的命名：初始化方法，命名以init开头，例：initView按钮点击方法，命名以onClick开头，例：onClick设置方法，命名以set开头，例：setData具有返回值的获取方法，命名以get开头，例：getData通过异步加载数据的方法，命名以load开头，例：loadData通过异步加载回调的方法或者，命名以Callback结尾，例：userLoginCallback ?布尔型的判断方法，命名以is开头，例：isEmpty4. 常量命名全部为大写单词，单词之间用下划线分开。

描述+}意义描述+类型描述的组合，用驼峰式，首字母小写。

5. 控件id命名控件缩写_意义，范围可选，只在有明确定义的范围内才需要加上。

tv_name btn_cancle et_name8. layout命名组件类型_功能以下为几种常用的组件类型命名：activity_功能，为Activity的命名格式~~~~~Activity匹配的layoutfragment_功能，为Fragment的命名格式~~~~~~~~Fragment匹配的layout ?dialog_功能，为Dialog的命名格式~~~~~~~~~~~Dialog匹配的layoutitem_list_功能，为ListView的item命名格式item_grid_功能，为GridView的item命名格式header_list_功能，为ListView的HeaderView命名格式footer_list_功能，为ListView的FooterView命名格式9. strings的命名类型_功能以下为几种常用的命名：页面标题，命名格式为：title_页面按钮文字，命名格式为：btn_按钮事件消息框文字，命名格式为：toast_消息编辑框的提示文字，命名格式为：hint_提示信息图片的描述文字，命名格式为：src_图片文字10. drawable的命名前缀{_控件}{_范围}{_后缀}，控件、范围、后缀可选，但控件和范围至少要有一个。

App界面设计规范

App界面设计规范1. 概述App界面设计是提供给用户与应用程序进行交互的视觉和操作方式。

良好的界面设计可以提升用户体验，使用户更容易理解和操作应用程序。

本文将介绍一些常见的App界面设计规范，帮助开发者们在设计过程中遵循最佳实践。

2. 视觉设计规范2.1 颜色选择•使用适合应用风格的颜色搭配，并注意颜色对比度，以确保文字和图标的可读性。

•避免使用过多明亮或过于高饱和度的颜色，以免对用户产生不适感。

•在暗模式和亮模式之间切换时，需要注意颜色在两种模式下的可读性和整体协调性。

2.2 图标和图片•使用统一简洁、直观易懂的图标，以便用户快速识别其含义。

•图片质量要求高，并遵循响应式设计原则，在不同屏幕尺寸上呈现一致且清晰的效果。

•合理压缩图片文件大小，尽量减少加载时间。

2.3 字体选择•使用清晰易读、适合应用风格的字体。

•在不同屏幕尺寸上确保字体大小的合适性，以便用户能够方便地阅读。

2.4 排版和布局•界面元素的排列严谨、有序，避免过于拥挤或空旷。

•使用一致的边距和间距，使界面整洁且易于浏览。

•对齐方式要统一，以确保页面整体协调。

3. 交互设计规范3.1 导航和标签栏•提供清晰明了的导航结构，使用户能够轻松找到所需内容。

•标签栏要易于操作和切换，并在不同页面状态下显示相应的标记。

3.2 按钮设计•按钮设计要简洁易懂、易点击，并为不同按钮类型使用合适的颜色和形状。

•使用动画效果来增强按钮点击反馈，提高用户交互体验。

3.3 输入框和表单•输入框样式要清晰，并提供输入提示或默认值，方便用户填写信息。

•表单中的字段要有明确标签和格式验证信息，以减少用户输入错误。

3.4 弹窗和提示信息•弹窗要简洁明了，提供清晰的按钮操作和关闭方式。

•提示信息要及时准确地反馈给用户，并使用易于理解的语言。

4. 响应式设计规范4.1 屏幕适配•针对不同屏幕尺寸和分辨率进行界面布局的自适应调整，以保证在不同设备上正常展示。

•需要做好各种屏幕比例下的测试，确保界面元素大小和位置合适。

App界面交互设计规范人人都是产品经理

App界面交互设计规范人人都是产品经理在上篇《APP界面设计风格》确定下来后，产品经理（兼交互设计）还不用着急将所有的交互稿扔给设计师进行细致的界面设计。

在细节设计启动前，拉上设计师和安卓前端开发、ios前端开发一起商议确定设计规范先吧！APP设计规范指对APP界面进行风格统一，对界面元素的样式、颜色和大小设定统一的规范和使用原则。

与设计、前端约定好统一的设计规范很重要，约定设计规范可以减少产品、设计、前端的沟通成本；可以使界面设计整洁、统一，减少界面元素的重复设计；可以减少设计素材，控制安装包的大小。

APP设计规范主要包括对界面布局、背景色、字体颜色大小、界面元素间距、弹层、loading、图标、按钮常态点击态等进行统一的梳理和规范。

一、页面布局规范页面布局页面布局和交互规范上建议安卓、ios尽量统一，这样可以避免安卓和ios分别设计一套稿子。

当然土豪公司可以忽略这个建议，安卓和ios分别做专门的设计当然更好。

在中小型项目来看，设计资源紧张的话可以考虑安卓和ios用同一个稿子，分别做相应的微调后输出适用安卓和ios不同的尺寸要求就可以。

推荐使用mac矢量设计工具”sketch”。

以ios平台的iPhone5的尺寸640*1136px作为标准尺寸设计。

在界面设计完成后可以做相应的微调导出适用ios和安卓尺寸的稿子。

这里可以首先统一设计稿输出规范：•安卓（720*1280px）：界面预览图、界面坐标图、标准界面的图标png文件•IOS（640*1136px）：界面预览图、界面坐标图、1-3倍图矢量图标pdf文件PS：界面坐标图指在设计已定稿的界面预览图上标注：界面元素的间距、文字的颜色、文字的字号大小、图标的尺寸、按钮不同状态颜色、按钮的尺寸等等界面坐标图实例二、标准色规范标准色规范标准色规范：重要、一般、弱。

标准色重要：重要颜色中一般不超过3种，这里的例子重要颜色之一红色需要小面积使用,用于特别需要强调和突出的文字、按钮和icon；而黑色用于重要级文字信息比如标题、正文等。

AppUI命名常见规范

AppUI命名常见规范1、常见界⾯、控件、功能、状态命名集合：APP产品经理、APP设计师、APP开发⼯程师，包括H5前端开发⼈员都可以记住的⽂件命名规范。

界⾯命名整个主程序App搜索结果Search results活动Activity信息Messages ⾸页Home应⽤详情App detail探索Explore⾳乐Music软件Software⽇历Calendar联系⼈Contacts新闻News游戏Game相机Camera控制中⼼Control center笔记Notes管理Management照⽚Photo健康Health天⽓Weather发现Find视频Video邮件Mail⼿表Watch个⼈中⼼Personal center设置Settings地图Maps锁屏Lock screen系统控件库状态栏Status bar搜索栏Search bar提醒视图Alert view弹出视图Popovers 导航栏Navigation bar表格视图Table view编辑菜单Edit menu开关Switch标签栏Tab bar分段控制Segmented选择器Pickers弹窗Popup⼯具栏Tool bar活动视图Activity view滑杆Sliders扫描Scanning功能命名确定Ok添加Add卸载Uninstall选择Select默认Default查看View搜索Search更多More取消Cancel删除Delete暂停Pause刷新Refresh关闭Close下载Download继续Continue发送Send最⼩化Min等待Waiting导⼊Import前进Forward最⼤化Max加载Loading导出Export重新开始Restart菜单Menu安装Install后退Back更新Update资源类型图⽚Image滚动条Scroll进度条Progress线条Line图标Icon标签Tab树Tree蒙版Mask静态⽂本框Label勾选框Checkbox动画Animation标记Sign编辑框Edit下拉框Combo按钮Button动画Animation 列表List单选框Radio背景Backgroud播放Play常见状态普通Normal获取焦点Focused已访问Visited默认Default按下Press点击Highlight禁⽤Disabled选中Selected悬停Hover错误Error完成Complete空⽩Blank位置排序顶部Top底部Bottom第⼆Second页关Header中间Middle第⼀First最后Last页脚Footer2、以iOS为范例(安卓通⽤)的切⽚⽂件命名规范如下：个⼈觉得标识符命名原则，尽可能的⽤最少的字符⽽⼜能完整的表达标识符的含义（如：Navigation bar可以缩减成nav）。

浅析app设计：切图的命名规范与标注说明

浅析app设计：切图的命名规范与标注说明写这篇文章也是总结了以前刚接触时候遇到的问题，还有来自其他朋友的提问。

关于切图的命名规范给人的第一印象就是全英文，看不懂，让很多人望而却步，当你有所了解之后，你就会发现其实没那么复杂。

本文主要为了给想了解命名规范的朋友解解惑。

一款产品的落地，必将先经历过需求分析、产品定位、项目拟定、功能分析、原型设计、再到设计稿输出，接下来再到开发，切图、标注是设计与开发需要沟通的步骤之一。

问题1：切图与标注是什么？切图：APP切图是实现设计效果的重要环节，开发们在实现的过程中需要计算好各个元素的位置，排布，然后再调用我们切好的图进行填充。

其存在是为了程序提高产品的开发效率和团队协作。

标注：标注能够帮助其他团队理解设计页面的布局关系、模块大小、颜色与字体规范等等。

注意：区分iOS与Android的规范问题2：为什么要制定规范？（规范存在的意义）1、方便修改与迭代对于项目而言，产品的优化迭代是必要的，除非打算放弃治疗。

有很多人对于文档的命名是这样的：遇到突发情况，比如你完成了设计后，突然要你改动哪个icon，你要找起来也是相当麻烦。

养成良好的命名习惯很重要，比如可以利用版本命名，亦或时间命名都可以更清晰地标明。

2、方便更快捷查找对于个人而言，psd文件有时候需要修改，整齐规范的psd文档是不是在修改图层的时候更容易找到该图层呢？（以上来自网络，图层命名没有固定性）3、方便设计团队沟通如果设计团队有一套完整的设计规范，那是再好不过。

如果没有这样完整设计系统，那么我们就得自己通过沟通制定一套规范，才能让沟通更加高效。

建议可以多看看网易、Google、QQ等企业的设计规范进行学习。

4、方便程序开发沟通曾经与程序沟通过需求，有些程序需要你切好图，标注好，命名好给他们，有些程序只需要你的设计档，他们自行切图标注，所以设计时与开发沟通尤为重要。

但是无论如何，规范的命名是最有效的沟通。

二、关于切图命名与标注的那些事像以前的设计输入都是手动输出，如今有了各种软件与插件，给设计师提供了更高效与快捷的方式去解决切图问题。

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界面版式设计规范
原则四
一致性原则
结构一致性色彩一致性操作一致性反馈一致性文字一致性
原则四
一致性原则
结构一致性色彩一致性操作一致性反馈一致性文字一致性
原则四
一致性原则
结构一致性色彩一致性操作一致性反馈一致性文字一致性
原则四
一致性原则
结构一致性色彩一致性操作一致性反馈一致性文字一致性

切图命名规范

切图命名规范切图命名是在进行图片切割时，给切下来的图片文件起一个易于理解和标识的名字。

一个规范的命名能够方便团队协作和管理，提高工作效率。

以下是一些常用的切图命名规范的建议，总结如下：1. 统一前缀 - 可以根据项目或模块名称给切图文件添加统一的前缀，比如"home_"表示首页相关、"nav_"表示导航相关等。

这样可以便于查找和识别不同模块的切图。

2. 功能描述 - 使用简短的英文单词或短语来描述切图的功能或用途，比如"logo"表示网站logo、"button"表示按钮、"banner"表示广告横幅等。

注意避免使用含糊或重复的描述词。

3. 元素类型 - 如果切图是某个特定元素的一部分，可以在命名中添加元素的类型，比如"icon_"表示图标、"bg_"表示背景、"pic_"表示图片等。

4. 状态和尺寸 - 如果切图有不同的状态或尺寸，可以在命名中添加相关信息，比如"_hover"表示鼠标悬停状态、"_active"表示激活状态、"_small"表示小尺寸等。

这样可以便于组织和管理不同状态或尺寸的切图。

5. 编号或版本 - 如果同一功能或元素有多个切图，可以使用序号或版本号来区分，比如"btn_01"、"btn_02"等。

这样可以避免命名冲突，并且方便追踪和管理不同版本的切图。

6. 文件格式 - 如果切图需要导出不同的文件格式，可以在命名中添加相关的文件后缀，比如".jpg"表示JPEG格式、".png"表示PNG格式等。

这样可以帮助区分不同的文件格式和用途。

7. 文件夹结构 - 在切图文件的存放位置上，可以使用文件夹的方式来组织和管理切图文件。

软件界面设计规则和规范

软件界面设计规则和规范文档目前流行的界面风格有三种方式多窗体、单窗体以及资源管理器风格无论哪种风格均适用于以下十条规则1易用性按钮名称应该易懂用词准确摒弃模棱两可的字眼要与同一界面上的其他按钮易于区分能望文知义最好。

理想的情况是用户不用查阅帮助就能知道该界面的功能并进行相关的正确操作。

易用性细则 1.完成相同或相近功能的按钮用Frame框起来常用按钮要支持快捷方式。

2.完成同一功能或任务的元素放在集中位置减少鼠标移动的距离。

3.按功能将界面划分局域块用Frame框起来并要有功能说明或标题。

4.界面要支持键盘自动浏览按钮功能即按Tab键的自动切换功能。

5.界面上首先应输入的和重要信息的控件在Tab顺序中应当靠前位置也应放在窗口上较醒目的位置。

6.同一界面上的控件数最好不要超过10个多于10个时可以考虑使用分页界面显示。

7.分页界面要支持在页面间的快捷切换常用组合快捷键CtrlTab。

8.默认按钮要支持Enter及选择操作即按Enter后自动执行默认按钮对应操作。

9.可写控件检测到非法输入后应给出说明并能自动获得焦点。

10.Tab键的顺序与控件排列顺序要一致目前流行总体从上到下同行间从左到右的方式。

11.复选框和选项框按选择几率的高低先后排列。

12.复选框和选项框要有默认选项并支持Tab选择。

13.选项数相同时多用选项框而不用下拉列表框。

14.界面空间较小时使用下拉框而不用选项框。

15.选项数较少时使用选项框相反使用下拉列表框。

16.专业性强的软件要使用相关的专业术语通用性界面则提倡使用通用性词眼。

2规范性通常界面设计都按Windows界面的规范来设计即包含菜单条、工具栏、工具箱、状态栏、滚动条、右键快捷菜单的标准格式可以说界面遵循规范化的程度越高则易用性相应的就越好。

小型软件一般不提供工具厢。

规范性细则 1.常用菜单要有命令快捷方式。

2.完成相同或相近功能的菜单用横线隔开放在同一位置。

3.菜单前的图标能直观的代表要完成的操作。

app界面设计规范

app界面设计规范应用界面设计规范（UI Design Guidelines）一、概述应用界面设计规范是为了提供一致的用户体验，减少用户学习成本，提高用户使用效率而制定的标准化规范。

本文档旨在为应用界面设计人员提供详细的设计指导和规范要求。

二、布局设计规范1. 布局要合理：应用界面应根据功能模块和信息层级进行布局，使用户可以快速找到所需信息。

2. 控件位置要合理：常用的功能按钮和交互控件应放置在用户易于触及和操作的位置，并保持一定的统一性。

3. 色彩搭配要合理：应用界面的色彩搭配应符合用户习惯和品牌风格，并且能够提高信息的可读性和识别度。

三、交互设计规范1. 操作一致性：相同类型的操作在不同页面中应保持一致，例如相同的功能按钮应具有相同的样式和位置。

2. 避免误操作：应用界面应减少对用户的误操作机会，例如提供撤销、确认和验证功能等。

3. 提示信息清晰：错误提示、成功提示和帮助文本应清晰明了，避免用户产生困惑。

4. 导航逻辑清晰：应用界面的导航逻辑应清晰明了，用户能够很容易地找到自己的位置和目标。

四、字体和图标设计规范1. 字体选择要恰当：应用界面的字体应选择易于阅读和识别的字体，同时需要考虑字体的风格与品牌一致。

2. 字体大小要合适：应用界面的字体大小应根据不同位置和用途进行调整，以便用户能够轻松阅读。

3. 图标样式要一致：应用界面的图标样式应统一，避免使用不同风格的图标对用户造成困扰。

五、界面美观设计规范1. 色彩选择要科学：应用界面的色彩选择应遵循色彩搭配原则，以提高用户体验和美感。

2. 美观布局要简洁：应用界面的布局应简洁美观，避免过多的装饰和样式干扰用户的使用。

3. 图片使用要合理：应用界面中的图片应具有明确的用途，且不应过于花哨和复杂。

六、响应式设计规范1. 考虑不同屏幕尺寸：应用界面的设计应考虑不同屏幕尺寸的适配性，以保证在不同设备上都能有良好的显示效果。

2. 响应速度要快：应用界面应做到快速响应用户的操作，减少用户等待时间。

app界面命名规范

竭诚为您提供优质文档/双击可除app界面命名规范篇一：app界面切图命名和文件整理规范app界面切图命名和文件整理规范切图命名英文缩写三个原则：1较短的单词可通过去掉“元音”形成缩写2较长的单词可取单词的头几个字母形成缩写3此外还有一些约定成俗的英文单词缩写.第一部分：iosapp界面设计切图命名规范第二部分：手机app切图文件整理和技巧分享篇二：ios和android的app界面设计规范ios和android的app界面设计规范字数876阅读96439评论36喜欢344记录一下ios和andoird的界面设计规范，方便进行标准的产品设计，并与设计师顺畅沟通ios篇界面尺寸设备iphone6plusiphone6iphone5/5s/5ciphone4/4sipad1/2ipa dmini分辨率750×1334px640×1136px640×960px1024×768px1024×768px状态栏高度导航栏高度标签栏高度60px40px40px40px40px20px20px132px88px88px88px88px44px44px147px98px98px98px98px49px49px1242×2208pxipad3/4/air/air2/mini22048×1536pxpaste_image.png图标尺寸设备iphone6plusiphone6iphone5/5s/5ciphone4/4sipad1/2ipadminiappstore程序应用主屏幕spotlight工具栏和标签栏搜索导航栏75*75px44*44px75*75px44*44px75*75px44*44px25*25px22 *22px25*25px22*22px1024*1024px180*180px144×144px87×87px75*75px66*66px1024*1024px120*120px144×144px58*58px1024*1024px120*120px144×144px58*58px1024*1024px120*120px144×144px58*58px1024*1024px90*90px1024*1024px90*90px 72*72px50*50px72*72px50*50pxipad3/4/air/air2/mini21024*1024px180*180px144×144px100*100px50*50px44*44px字体iphone上的字体英文为：helveticaneue至于中文，mac 下用的是黑体-简，win下则为华文黑体，所有字体要用双数字号。

手机APP的设计原则与命名规范

手机APP的设计原则与命名规范一、设计原则随着智能手机的普及，APP已经逐渐成为人们日常生活不可或缺的一部分。

好的APP设计应该符合以下几个原则：1. 易学易用。

APP应该尽可能简化操作流程，让用户可以轻松上手，同时减少用户的学习成本和操作成本。

2. 易上手易记。

APP的设计应该遵循用户的思维模式，让用户可以很容易地记住操作路径和指令。

3. 清晰明了。

APP页面应该尽可能简洁明了，让用户能够一目了然地知道当前所处的位置和该如何操作。

4. 视觉吸引力。

APP应该具有一定的艺术性和美学价值，使用户在使用中可以有愉悦的体验。

5. 一致性。

APP的UI设计应该保持一致，统一的字体、颜色、布局等可以让用户感受到APP的整体性，同时减少用户的困惑。

6. 高效性。

APP应该尽可能快速地响应用户的操作，并提供快捷的反馈，从而增强用户的参与感和使用体验。

7. 安保性。

APP应该具备一定程度的安全性保障，防止用户个人信息泄露和数据丢失。

二、命名规范APP名称是用户了解和使用APP的第一步，取名应该简单明了、易口感，同时具有一定的特色和个性。

1. 手机APP命名规范（1）名称长度不宜过长，最好在4-7个字之间。

（2）名称应该能够准确、清晰地表达APP的功能或主旨。

（3）名称应该遵循英文语法规则，首字母大写，单词之间用空格或者驼峰拼写。

（4）名称应该尽可能避免使用数字、符号等特殊字符，以便用户易记。

2. APP图标设计规范（1）图标应该能够具有一定的代表性和区分度。

（2）图标颜色应该统一，符合APP的整体设计风格。

（3）图标尺寸应该适合不同分辨率的手机屏幕大小。

（4）图标设计应该能够在各个手机手机平台之间保持一致性。

3. APP界面设计规范（1）APP整体UI设计应该以用户体验为核心，页面布局贴近用户需求，操作简单明了。

（2）不同的功能模块之间应该保持一定的区分度，避免混淆。

（3）字体大小应该根据不同的设备分辨率进行调整，以确保用户能够清晰地看到界面上的文字。

APP切图详细规范终极指南

APP切图详细规范终极指南2015-03-11 分类：UI设计围观31698次我们都知道一套完整的App 通常会有很多张切图，不管是iPhone 需要1x、2x、3x 图档，Android 需要至少3 种hdpi、xhdpi、xxhdpi。

在庞大的切图数量下如何让负责套图的RD 快速找到所需图档，档名的命令方式就需要双方统一格式方便大家作业。

所以，制定一套非常有效而方便的APP切图命名规范非常有用的。

下面就跟随小编来详细了解APP切图命名的流程和命名规范。

ios切图尺寸规则目前iPhone有10种型号，5种屏幕尺寸，再加上6plus的“降采样”（Downsampling）（1080-1920），还有iPhone6和6+上的放大模式（1125-2001）和默认模式（1242-2208），是不是感觉好恐怖？但是不用怕，我分享一套超简单的适配方法，看完你都不信有这么简单~美术交付给开发的资料有1、标注图（以640为宽度尺寸为基准标注）2、 2x切图（以640为宽度尺寸为基准切图）3、 3x切图（以1280为宽度尺寸为基准切图）开发看到这份标注图，可以自己用上面的数字，乘以1.5得出3X的数字。

1.为什么3x切图要以1280来为宽度？其实iPhone6+的尺寸1242*2208作为3X，怎么算都又难记又不能整除，我们直接640*2得到1280跟1242相差也没几十个像素，最重要的是不虚边啊，放在真机上看（处女座除外）看不出差别的。

2.为什么只设宽度？为了保持长宽比例。

iPhone的这几个尺寸不是正好的，宽度放大后高度总差那么几个像素，这不要紧，千万别去改高度，手机屏幕是可以上下滑动的嘛。

不可以滑动必须保证一屏显示的除外，手动去调整好了。

3.为什么开发不是乘以2而是乘以1.5来算尺寸和字号？因为大屏手机就是要显示更多内容而存在的。

纯等比放大界面看起来傻大傻大的，实验证明1.5倍是正好的。

Android切图尺寸规则px（像素）是我们UI设计师在PS里使用的（不解释），同时也是手机屏幕上所显示的（也不解释）dp是开发写layout的时候使用的尺寸单位，sp是开发写layout时关于字体的字号单位，且dp与sp总为1：1关系。

APP制作开发切图的六大基本元素设计

APP制作开发切图的六大基本元素设计切图是个技术活，小伙伴们千万不能忽视切图的重要性，下面APP开发小编来为大家讲解：APP制作开发切图的六大基本元素设计。

一、整体布局优秀的应用有些共同的地方，无论是出于什么考虑，在界面上应该避免左右布局严重不平衡，当然也有故意设计成不对称美的。

比如界面的最下面一栏有两个横着排版的按钮，那么这两个按钮最好整体上居中，若是偏左或是偏右那么就有左右不平衡的感觉，要么是左重右轻，要么是左轻右重，看上去有一部分比较空。

二、界面简洁这点有两重意思，其一就是界面完成的功能很明确、简洁，其二是同类操作尽量在一个界面完成。

感觉上这两点有冲突，其实不然，如果真的不能做到既界面简洁又功能统一那么这个设计最好还是再设计设计。

比如用户信息输入功能中第一个界面完成用户名输入、密码，确定后进入第二个界面进行设置头像。

像这样的界面的个人认为太罗嗦了。

既然都是完成用户信息的功能，那么完全可以设计到一个界面中。

这样一来可以把整个功能做得更紧凑，少用一个界面更简洁。

APP制作开发切图的六大基本元素设计三、按钮的设计你可以真正点击的区域应该尽量大些，至少不应该小于一个手指的宽度，那样的话点击的命中率要高，否则会有“点击不灵敏”的感觉，当然并不是真正的不灵敏，而是没有点中操作的区域。

(用户可不管这些理由，多为用户考虑哦)。

对于RadioButton、CheckBox至少应该出3个状态的图：正常、点击、选中。

有时不能为了方便就只出两个图：正常、选中。

这种情况在点击的过程中也有“响应迟钝”的感觉，因为毕竟在点击状态没有换图。

四、排版的设计对于整体上的设计应该尽量考虑到好用、实用，而不是能用。

我自己的体会是这样的。

凡是要响应点击或者其他事件的部分应该尽量和屏幕四周的边框保持一定的距离。

如果你非得把这部分放在屏幕边上，那么最好放大操作区域。

因为屏幕边上点击并不是那么好用（如果设备加了一个保护套，那么屏幕边上就会很难点），至少我用过的有边框的设备，也就是说屏幕边上直接用手去点大部分情况是点不中的。

UI切图管理规范

UI切图管理规范1切图命名规范UI切图命名格式为：“aaa_bbbb_cccc”。

其中“aaa”为切图类型；“bbbb”为模块名称；“cccc”为具体名称。

其间用“_”分割。

其他情况：当三级仍无法具体标识切图时，可延伸至四级。

例如“aaa_bbbb_cccc_dddd”。

iOS以在切图命名末位加“@2x”或“@3x”等标识来区分不同像素的同一张图片。

例如：“aaa_bbbb_cccc@2x”、“aaa_bbbb_cccc@3x”。

详见3.1。

Android则以drawable-mdpi，drawable-hdpi，drawable-xhdpi，drawable-xxhdpi等文件夹来区分不同像素的同一张图片。

详见3.2。

2切图类型和格式2.1图标切图命名以“ico”开头；后缀为“png”格式。

例如：首页公告图标切图应命名为“ico_home_notice.png”2.2背景切图命名以“bg”开头；后缀为“png”格式。

例如：首页标题栏背景切图应命名为“bg_home_title.png”。

2.3图片切图命名以“img”开头；后缀为“jpg”格式。

例如：广告栏轮播图应命名为“img_adv_name.jpg”2.4按钮切图命名以“btn”开头；后缀为“png”格式。

按钮一般分为两种状态：点击状态和未点击状态。

例如：缴费页面确定按钮点击状态的切图应命名为“btn_pay_confirm_onclick.png”;未点击状态的切图应命名为“btn_pay_confirm_unclick.png”2.5标签切图命名以“tab”开头；后缀为“png”格式。

标签一般分为两种状态：选中状态和未选中状态例如：首页标签选中状态的切图应命名为“tab_home_onselected.png”未选中状态的切图应命名为“tab_home_unselected.png”3切图尺寸规范3.1iOS尺寸规范3.1.1iPhone界面尺寸3.1.2iPhone图标尺寸3.2Android尺寸规范3.2.1Android SDK模拟机尺寸3.2.2Android图标尺寸3.2.3Android系统dp/sp/px换算表。

APP界面设计要求规范二(Android版)

一、Android设计常识开始介绍之前先帮大家梳理一下Android常用单位，方便各位亲们更好的掌握并了解Android端设计规范。

1.1 Android常用单位1.1.1.PPI(pixels per inch)：数字影像的解析度，也就是每英寸所拥有的像素数，即像素密度；PPI计算公式：ppi=√（长度像素数2 + 宽度像素数2）/屏幕对角线英寸数1.1.2.DPI(dots per inch)：是指印刷上的计量单位，也就是每英寸上能印刷的网点数，我们设计用于显示器的默认为（72像素/英寸）就好了；1.1.3.屏幕尺寸（Screen Size）：一般我们所说的手机屏幕尺寸，比如3英寸、5.5英寸等，都是指对角线的长度，而不是手机的面积；1.1.4.分辨率（Resolution）：是指手机屏幕垂直和水平方向上的像素个数，比如分辨率为：720*1280，是指设备水平方向有720个像素点，垂直方向有1280个像素点1.1.5.px( pixels)：像素，不同设备显示效果相同1.1.6.pt（point）：一个标准的长度单位，ios的逻辑单位，1Pt=1/72英寸，用于印刷业，非常简单易用；标注字体大小（72是早期台式机的DPI）1.1.7.sp（Scaled-independentpixels）：放大像素，安卓的字体单位；1.1.8.Dp（Density-independentpixels）：是指设备的独立像素，不同的设备有不同的显示效果，它与设备硬件有关系；sp和dp基本一样，是android开发里特有的单位，都是为了保证文字在不同密度的显示屏上显示相同的效果；dp与设备硬件有关，与屏幕密度无关，sp与屏幕密度和设备硬件均无关；1.2 换算关系android开发中，文字大小的单位是sp，非文字的尺寸单位用dp，但是我们在设计稿用的单位是px。

这些单位如何换算，是设计师、开发者需要了解的关键。

* dp：以160PPI屏幕为标准，则1dp=1px。

app ui设计规范有什么？让你快速的掌握住

相信家对于 ui设计非常的感兴趣吧。

接下来就让们来看看app ui设计规范的相关的内容吧，相信家看完之后，将会有非常的收获的，家还在等什么呢？就让们全面的认识一下吧。

一、UI设计UI设计(或称界面设计)指对软件的人机交互、操作逻辑、界面美观的整体设计，也叫界面设计。

UI设计分为实体UI和虚拟UI，互联网说的UI设计虚拟UI，UI即User Interface(用户界面)的简称。

好的UI设计不仅让软件变得有个性有品位，还要让软件的操作变得舒适简单、，充分体现软件的定位和特。

二、app ui设计规范1、Android篇标注规范：画布小：以720 1280分辨率为准进行标注。

字体：按照像素标注，只使用 24 pt，28 pt，36 pt 和 44 pt 的字体，并pt 值除以 2 作为 sp 数值交给工程师。

颜色：按照实际的颜色值标注，Android颜色值取值为十六进制的值比如一绿色的值，给工程师的值为 5bc43e。

间距：每个主要的控件必须标注出来，各种边距必须标注清楚。

所有尺寸的 p 值除以2作为 dp 数值交给工程师。

切图：统一采用Png格式部分需要适配的图片需要.9格式图片优化：图片压缩优化ICON 可采用PNG 8支持完全透明和完全不透明两种和256色需要高清的可采用 PND24/32切图命名:每个页面按照设计高保真分目录：hdpi(480 800)hdpi(720 1080) dpi(1080 1920)。

依图片性质命名。

例如 bg_.png、btn_.png、img_.png、tab_.png等。

设计图单位：像素72dpi。

在设计的时候并不每个尺寸都要一套，尺寸按自己的来设计，比较方便预览，一般用640 1136或者750 1334的尺寸来设计，现在iPhone6和plus出来后有很多人会使用6的设计。

Ps：作图的时候确保都用形状工具(快捷键：U)画的，这样更方便后期的切图或者尺寸变更。

安卓切图规范

安卓切图规范安卓切图规范是为了保证在不同分辨率和尺寸的安卓设备上都能够正常显示和使用设计图，以下是一份包含1000字的安卓切图规范：一、基本概念1. 密度（Density）：安卓设备根据屏幕的物理尺寸和分辨率来确定屏幕的密度，一般以 DPI（每英寸点数）来衡量。

主要分为以下几种密度：ldpi（低密度）、mdpi（中密度）、hdpi （高密度）、xhdpi（超高密度）、xxhdpi（超超高密度）和xxxhdpi（超超超高密度）。

2. 分辨率（Resolution）：设备屏幕的水平和垂直像素数量。

常见的分辨率有：320x480、480x800、720x1280、1080x1920等。

3. 像素（Pixel）：屏幕上的一个点，是显示图像的最小单元。

二、设计规范1. 分辨率选择：设计图应根据目标设备的分辨率进行选择，以确保图像在不同分辨率设备上的正常显示。

2. 密度选择：设计图应根据目标设备的密度选择相应的分辨率进行设计，以确保图像在不同密度设备上的正常显示。

3. 状态栏和导航栏：设计图中应包括状态栏和导航栏的高度，以确保内容在不同设备上的显示布局正常。

4. 图标尺寸：根据图标的功能和使用场景选择适当的尺寸，一般推荐使用 48dp、72dp、96dp 等尺寸。

5. 图片素材选择：选择合适的图片素材，保证图像质量并尽量减小文件大小，减少应用占用空间。

6. 背景图像：在设计背景图像时，应选择能够平铺且无缝连接的图像，以适应不同分辨率的设备。

7. 字体选择：选择适合在不同密度设备上显示的字体大小，确保文字清晰可见。

8. 切勿纯色图像：避免使用纯色图像作为按钮、图标等元素的背景，因为在不同设备上可能会出现颜色差异。

9. 容错设计：针对不同设备可能出现的屏幕旋转、分辨率变化等情况进行容错设计，以确保图像在不同状态下都能正常显示。

10. 兼容性测试：在设计完成后，应进行兼容性测试，确保设计图在不同设备上的显示效果符合预期。

手机APP切图命名规则

PS:android下 input、btn、list 等图片可用.9.png格式图片
导航栏
导航栏按钮命名规则：
nav_（功能描述）.png
如: nav_menu.png\nav_menu_pre.png (同一按钮选中前后两种状态命名)
PS:同一区域按钮切图大小一致
左侧导航
左侧导航切图名规则：
leftbar_（功能描述）.png
如: leftbar_info.png\leftbar_info_pre.png (个人中心)
选项卡
菜单按钮命名规则：
tab_（功能描述）.png
如: tab_set.png\nav_set_pre.png (设置)
主界面
主页面命名规则：
Home（界面名称）_（功能属性简写+描述）.png
如: home_btn_recommended.png (热门推荐)
如: defoult.png\defoult2x.png\defoult-7202x.png
PHale Waihona Puke :同一区域按钮切图大小一致defoult2x.png\defoult-7202x.png 为IOS命名(-720适配720px宽)
登录界面
启动界面命名规则：
login_bg.png (登录背景) login_logo.png (登录logo) login_input.png (输入框) login_input_pre.png (输入框选中状态) Login_btn.png （登录按钮） Login_btn_pre.png （登录按钮选中状态）
可重复使用按钮命名规则：
btn_（功能属性或色彩均可）.png
如: btn_blue.png /btn_blue.9.png (蓝色按钮)