概述:最近在做项目的过程中遇到美工在设计和切图方面的问题。在此和大家分享一下个人对UI、UE方面的一些浅薄的认识。个人观点,仅供参考,欢迎参与讨论。

美术设计应该考虑到UE,即用户体验。

按钮的设计

1、你可以真正点击的区域应该尽量大些,至少不应该小于一个手指的宽度,那样的话点击的命中率要高,否则会有“点击不灵敏”的感觉,当然并不是真正的不灵敏,而是没有点中操作的区域。(用户可不管这些理由,多为用户考虑哦)。

2、对于RadioButton、CheckBox至少应该出3个状态的图:正常、点击、选中。有时不能为了方便就只出两个图:正常、选中。这种情况在点击的过程中也有“响应迟钝”的感觉,因为毕竟在点击状态没有换图。

排版的设计

对于整体上的设计应该尽量考虑到好用、实用,而不是能用。我自己的体会是这样的。

1、凡是要响应点击或者其他事件的部分应该尽量和屏幕四周的边框保持一定的距离。如果你非得把这部分放在屏幕边上,那么最好放大操作区域。因为屏幕边上点击并不是那么好用(如果设备加了一个保护套,那么屏幕边上就会很难点),至少我用过的有边框的设备,也就是说屏幕边上直接用手去点大部分情况是点不中的。

2、背景和内容的对比度一定要合适。作为有美术基础的都知道这点,但是很多时候在设计的时候就犯这样的错。你的设计一定要考虑到使用环境,如在阳光下。如果对比度不够的话那么在强光的环境下就不好用了,背景和内容就融为一体了,很难分辨。

3、尽量少用对话框。尤其是网页中都会有很多的对话框,久而久之人们对对话框也就产生了反感(至少我是这么认为的),能以更好的方式做提示的情况下就尽量避免用对话框,非用不可的情况下那么建议一个界面不超过两处。老是弹对话框的应用,最终弹走的是用户。

4、界面简洁。这点有两重意思,其一就是界面完成的功能很明确、简洁,其二是同类操作尽量在一个界面完成。感觉上这两点有冲突,其实不然,如果真的不能做到既界面简洁又功能统一那么这个设计最好还是再设计设计。比如用户信息输入功能中第一个界面完成用户名输入、密码,确定后进入第二个界面进行设置头像。像这样的界面的个人认为太罗嗦了。既然都是完成用户信息的功能,那么完全可以设计到一个界面中。这样一来可以把整个功能做得更紧凑,少用一个界面更简洁。

5、使用一定的动画。使用动画进行界面的过度让人感觉更柔和、亲近。现在的应用太多了,而且功能强大,你的应用需要脱颖而出那么就必须与众不同,有时一些简单的动画会给你的应用增色不少。

6、整体布局。我不是专业的美工不过见过很多优秀的应用,应该有发言权吧,呵呵。优秀的应用有些共同的地方,现在总结一下。无论是出于什么考虑,在界面上应该避免左右布局严重不平衡,当然也有故意设计成不对称美的。比如界面的最下面一栏有两个横着排版的按钮,那么这两个按钮最好整体上居中,若是偏左或是偏右那么就有左右不平衡的感觉,要么是左重右轻,要么是左轻右重,看上去有一部分比较空。

7、屏幕适配。Android开发中最麻烦的问题之一就是屏幕适配的问题,硬件厂商太多,屏幕尺寸太多。一个好的应用应该尽可能多的适配更多的屏幕。UI设计过程中就应该考虑到屏幕变宽、变高、变窄、变短的过程中UI应该如何适配。整体上有个原则,屏幕的适配不要改变整体的布局,也就是布局是不变的只是对图形进行拉伸而已(关键是如何拉伸)。屏幕适配其实也是一些经验,慢慢领悟吧,呵呵。

如何切图

1、对于不改变可见图形而又需要加大点击区域的图。那么切图的时候建议在可见图形的四周都加上1像素的透明,这是为了放大拉伸而不产生可见区域的图像失真。

2、切图的高度。对于一个通用的背景图,如文字圆角边框背景,那么切图的时候并不是效果图上有多高就切多高,为了通用而是只需切一行文字的高度就可以了。不过这也不是绝对的,准确的说应该切的高度H=paddingTop+textHeight+paddingBottom,及文字相对背景的上边距+一行文字的高度+文字相对背景的下边距。

3、切图的宽度。如果是一个通用的背景图,那么他的宽度应该是他在效果图中的最小宽度,也就是说这个背景可能在多处使用到了,就取最小的那个宽度就可以了。比较麻烦的是铺满全屏的时候,这就需要看看你做的效果图的宽屏宽度,所以说做效果图的时候最好是做小屏幕的效果图。有人可能会问点9的图不是可以拉伸、压缩吗,为什么需要参考最小的宽度呢?根据个人经验发现,一个大图在屏幕小的情况下点9图中拉伸的部分会变得颜色更深。

总结:好了,对于android UI设计及切图就到此为止吧。再次强调,本人毕竟不是专业美工,所以有些方面考虑得可能不得当,如读者发现有不妥的地方请提出,欢迎交流。

PS:转载请注明出处。Android交流群:196761677,期待共同进步。

android 系统的切图方式_Android UI设计及切图相关推荐

  1. android 系统的切图方式_android APPUI设计、切图的常用尺寸大全

    今天在APPUI设计群里 ,不少朋友在问  android APPUI设计.切图的常用尺寸到底是多少?很不清楚,所以老谭在此跟大家分享下. Android 系统就被设计为一个可以在多种不同分辨率的设备 ...

  2. Android系统JNI的实现方式

     Android系统JNI的实现方式 All rights reserved JNI(Java Native Interface)定义了一种Java代码调用C或者C++代码等其它代码的方式. 在A ...

  3. android收入管理系统,毕业设计(论文)-基于Android系统的家庭理财通软件的设计——收入管理模块.docx...

    PAGE 河北农业大学信息学院 本科毕业论文 题 目:基于Android系统的家庭理财通软件的 设计--收入管理模块 学 院: 信息科学与技术学院 专业班级: 计算机科学与技术0902班 学 号: 二 ...

  4. Android studio诗词app古诗词中国风记事本ui设计中国古诗词

    Android studio诗词app古诗词中国风记事本ui设计中国古诗词 界面设计: 视频介绍: Android 中国风诗词记录诗词记事本Android studio编译Android笔记本记事本 ...

  5. 基于Android的小巫新闻客户端开发--UI设计(主界面)

    分享一下我老师大神的人工智能教程!零基础,通俗易懂!http://blog.csdn.net/jiangjunshow 也欢迎大家转载本篇文章.分享知识,造福人民,实现我们中华民族伟大复兴! 基于An ...

  6. android切图规范命名,ui设计师的切图与命名规范

    一. 切图命名英文缩写的三个要求 1.较短的单词可通过去掉"元音"形成缩写 2. 较长的单词可取单词的头部几个字母形成缩写 3.还有一些特定的英文单词缩写 二. 命名规则 切图命名 ...

  7. APP UI设计及切图规范--2016

    1.概述 1.1 编写目的 该文档主要针对移动端开发的视觉设计和开发过程中的工作环节做统一的规划规范,是系统进入UI设计的前置文档. 1.2 读者对象 项目实施工作组UI/UE设计人员. 2.色值规范 ...

  8. android app 适应不同大小屏幕_Android UI自适应不同分辨率屏幕2套解决方案

    当我们谈论Android UI自适应不同分辨率屏幕的时候,先来回顾下25学堂之前写的<Android APPUI设计师必知:pt sp dp之间的关系>相关单位的知识. 如果不明白的,我们 ...

  9. 智慧城市 android,基于Android系统的智慧城市服务客户端的设计与实现

    摘要: 随着技术水平的不断高速发展,信息科技已布满人们生活的每个角落.自智慧城市的概念提出以来,全球各大国纷纷掀起了一股构建智慧城市的热潮.我国不少城市也在近几年不断加入其中,然而国内外城市由于建设背 ...

  10. Android 腾讯入门教程( 智能手表UI设计 和 MVC模式 )

    *****注意到mvc 在android 中是如何进行分层分域执行各自的功能.**** 官方推荐的按钮尺寸是48像素 前端之Android入门(1):环境配置 前端之Android入门(2):程序目录 ...

最新文章

  1. 一个交换程序的通用版本
  2. [转] SQL的3种连接查询
  3. 移动端适配--flexible.js
  4. .NET6 如期⽽⾄
  5. JDK 5 ~ 10 新特性倾情整理
  6. 从线上慢sql看explain关键字
  7. 软考计算机基础:存储系统
  8. vue-router路由安装与使用
  9. ECMAScript6学习笔记 ——let、const、变量解构赋值
  10. 【Django 2021年最新版教程8】操作Mysql数据库 mysqlclient安装和使用
  11. jsp高校科研管理系统servlet设计
  12. AI笔刷 600+专业ai矢量笔刷套装(含安装教程)
  13. Halcon学习---毛刺凸点检测
  14. 【写着玩】二维码检测及定位
  15. 3DMax的中文版官方手册
  16. 2019西电复试计科,软件机试真题
  17. 2022年危险化学品生产单位安全生产管理人员考试内容及危险化学品生产单位安全生产管理人员证考试
  18. PIEGEE下载三款10米土地利用数据代码
  19. mysql 语句优化的十个经验
  20. SpringDataJpa框架使用【超详细!】

热门文章

  1. 【OpenCV】绘图与注释——绘制色差图
  2. Zuul 上传大文件服务报错的问题
  3. 怎么确定服务器是否支持ipmi,如何获取服务器的IPMI地址?
  4. 顺丰快递如何凭收件人电话和单号批量查询物流信息
  5. matlab 报错 索引超出数组元素的数目(1)。
  6. mysql索引超出了数组接线_索引超出数组范围是什么意思
  7. php去除文字格式,php如何清除html格式并去除文字中的空格然后截取文字
  8. s7epaapidll丢失怎么办_s7epaapidll下载
  9. texlive写论文源代码_基于中国人民大学LaTeX论文模板毕业论文,课程研究生硕士本科设计,ppt答辩,外文翻译程序源代码下载...
  10. ITIL 4讲解: 变更管理