学员试听 >
机构入驻 >
试听课程申请
看不清,请点击刷新
立即申请
机构入驻申请
看不清,请点击刷新
立即申请
试听课程申请
看不清,请点击刷新
立即申请
机构入驻申请
看不清,请点击刷新
立即申请
课程分类
寻客吧 > 教育新闻 > 电脑培训 >  UI设计中需要知道的问题

UI设计中需要知道的问题

时间:2025-07-03 16:01:25  编辑:定州优就业IT培训学院  来源:寻客吧  浏览:152次   【】【】【
    全局性的切图常见问题
    ①你的所有设计尺寸,包括图形效果,应该尽量使用偶数。
    技术开发使用的尺寸是设计稿像素尺寸的一半,也就是说,如果你用24px的字体,技术那边就是设置为12px。
    ②切图尺寸应该提供几套?
    *.pngIPhone2G,3G,3GS使用(好像没人用这手机了吧)
    *@2x.pngIPhone4,5,6加载此尺寸图片(不是必须使用这个尺寸,是加载调用这个尺寸)
    *@3x.pngIPhone6plus使用的尺寸
    可以简单的理解为倍数关系(其实是为了满足不同分辨率,我觉得不用过于深究),如果你使用IPhone6尺寸做设计稿,那么切片输出就是@2x,缩小2倍就是@1x,扩大1.5倍就是@3x了。
    理论上,为了达到好的视觉效果,你应该输出三套尺寸,推荐输出三种尺寸的切片资源。
    另外现在几乎看不到3GS了,所以需不需要提供一倍图,还是要和工程师讨论一下~
    @1x@2x@3x是开发工具Xcode软件需要的UI资源,命好名称后,IOS设备会自动的选取合适尺寸。
    ③共用资源的图片,输出一张就可以
    类似重复的按钮之类的,只要提供一张共用的资源就可以了;上面的文字是技术写上去的。

    理论上按照视觉效果,你应该提供多尺寸的图片;但通常我只提供大尺寸的一张图片即可,这一点要和你的搭档沟通好,却问他需要什么方式。

定州UI设计培训学校

    ④切片的输出格式
    位图格式:PNG24,PNG8,JPG
    在JPG和PNG两种格式图片大小相差不是很大的情况下,推荐使用PNG;如果图片大小相差很大,使用JPG。
    欢迎页面,ICON一定要使用PNG格式,在不影响视觉效果的前提下,可以考虑使用PNG8;
    矢量图格式:PDF,SVG
    IOS原生支持的两种矢量图片格式,但是支持的一般,并不能增加把所有图片效果渲染出来;为了保险起见,我通常不使用这两种格式,推荐还是使用位图,如果以后技术提升,支持SVG和PDF这种矢量格式图,那个时候也许不用提供这么多套尺寸了~⑤图标的点击区域
    小点击区域问题:
    IOS人机指导手册里推荐的小可点击元素的尺寸是44*44point(点),在设备上1point等于1像素,所以转换成像素就是44*44像素,换算成物理尺寸大概是7mm左右吧(人机工效学研究中得出的结论:用食指操作,触击范围在7mm左右合适;用拇指操作,范围在9mm左右合适)。
    ⑥图片图标的不同状态
    按钮可能有正常(normal),按下(pressed),选中(selected),禁用(disabled)等多种状态。