联系我们 face+ 关于 服务 案例
首页 案例 服务 关于 face+

UI设计思路,让你的设计更有方向感

Time: 2020-01-09

对于ui设计师们来说,设计思路是非常重要的,因为设计思路真的是相当于我们在设计过程中的一盏指路明灯哦!下面我们跟随小编一起来了解一下UI设计思路的相关资料吧。


思路一、明确划分与UI相关和与UI无关的部分

  根据UI设计图,我们首先要把界面展现的数据先抽出去,只看UI的表现。也就是说,把UI相关的部分抽出来。比如一个界面可能需要分几部分组成,每一部分大概怎么设计等。


  思路二、划分屏幕大小,明确出跳转关系

  要考虑到你的APP所对应的屏幕大小及DPI,不同的屏幕与DPI,你有可能会存在不同的UI布局,最典型的是在3.0以上的SDK版本,可能引入了Fragement元素,手机屏幕与平板的屏幕的UI设计,完全是两种不同的风格。

  还有,尽可能地明确出跳转关系,这可以用一些小卡片的形式来标记,一个卡版表示一个画面,把不同画面之间的迁移关系明确出来。同时,还要把这些画面之前的相同点与不同点找出来,因为这会影响到是否决定提取共通画面。


1.jpg

(图片来自网络)


  思路三、列出需要用到的UI元素(Widget)

  把界面上展现的UI元素列出来,像常用的button, imagebutton这些很简单,一看就知道,关键是有些UI,可能会涉及到一些自定义的View,这里一定要多考虑。

  另外,有可能为了统一控制,比如也有可能扩展一个Button,派生类里面可能只是改变一个字体大小等,这种做法通常是用于多数UI的字体大小相同,可以抽象出来个共通的Button,这样在各个UI里面,就可以不用都来设置这个字体大小。还有,也可以抽出共通的style,比如textview的style,文本颜色,字体大小,是否加粗等。


  思路四、列出哪些UI元素可以用SDK的,哪些则是需要自定义

  通常一个项目里面都会有自定义的组件(View),多数是组合控件——把不同的Widget组合成一个Layout。这还要需要根据项目自身的需求来定。

  注意:这里一定要有一个良好的设计,以应地需求变更。比如第一版需求,可能不需要一些组合View,直接使用SDK自身的Widget就能完成,但经过一些变动之后,发展之前的UI设计不合时宜,可能需要提供自定义的View,那么原来用到SDK自身的Widget的地方可能需要改动。这种改动说大也大,说小也小,在设计的时候,要多考虑一下这种需求变更。


4.gif

(图片来自网路)


  思路五、完成UI界面的绘制

  这一步,其实不一定会用到,通常情况下,不会涉及到自绘制,因为自绘制比较麻烦,而且费时间,但是在特殊情况下,自绘制能提高效率,因为你用View布局,会涉及到layout, measure, touch event, dispatch draw等方面,这些会影响性能。

  UI设计思路六进行内部逻辑和UI界面的整合

  通常一个View里面,都会有一些逻辑,特别是自定义的View,可能会封装一些特定的属性。在使用这些View的时候,UI的activity会与这些View有一个逻辑的整合。


  其实小编觉得设计师在做UI设计时只要理清了UI设计思路以后,就可以很顺利开展设计项目,做好自己的统筹规划工作哦!


合作咨询

上海(总部)

上海市浦东新区郭守敬路498号22号楼
021-61057328
service@faceui.com

办公地址地图

北京

北京市东城区后永康17号A座
010-64015620
service@faceui.com

办公地址地图

成都

四川省成都市锦江区东大街牛王庙段100号
028-62790929
service@faceui.com

办公地址地图
首页 | 案例 | 服务 | 关于 | face+ | 智见

Copyright © 2009-2022 FaceUI design. All rights reserved


沪ICP备13044459号-5

上海办公地点地图
北京办公地点地图
深圳办公地点地图
在微信中搜索faceui
或保存二维码在微信中打开