咨询热线 400-168-8684
2021-09-07 21:26:26|已浏览:877904次
UI制作,是基于产品原型而做的设计。在交互的原型确定后,视觉方面也就紧锣密鼓地行动。
对于UI设计,我一开始不是直接就开始做效果图,而是在规划一些设计规则。尝试着把整体的UI拆散成一个个元件,去分析规划、统一。
例如:
1,我们的产品颜色定义。主色调以及辅助色,包括“删除”,“保存”,“登录”,“注册”等这些常用按钮的颜色定义(前面我们定的会比较少,后面根据页面的需求,会增加一些颜色,但是我们尽量控制颜色的数量)。
2,我画的icon,线条粗是2px还是3px,或是多,或者其它用“面”的形式画icon?
3,我的一、二级页面Tab是什么形式?确定它的规则之后,就必须延续这样一个规则,方便用户对于产品结构划分的理解。
4,字体大小,我们定几个规格?一级字体,二级字体,三级字体,都是具体多少pt。
5,根据交互原型,我们的列表页单元格有多少类型?定一个统一的规格。图标大小统一,图片大小统一,主标题字体大小、颜色统一,副标题字体大小、颜色统一。对于数字,我喜欢取偶数,因为这个涉及到转化IOS尺寸的一些细节问题(@2x,@3x),奇数会出现一些麻烦。
6,边距设置。设置几个边距,有助于我们区分层级。一级标题、二级标题、三级标题,通过字体大小、颜色、加粗、边距,我们能很清晰的分出页面层级,这样也能帮助用户更好的理解我们的软件模块层级关系是什么样子的。
7,icon尺寸大小规划。注:当选择中等清晰度(720p)时,一定要是偶数,他的1.5倍(1080p)才能是整数。我们如果前期规划好,未来对于提供不同分辨率的icon切图,将会特别省力。
按照这种规则设置icon大小,之后都在一个psd文件里绘制。后面做其它尺寸的icon,只需要统一压缩或放大,通过调边线处理icon,效率将非常高。
二、为什么我们的设计要去定这些东西?
主要有这几点:
1,防止我们颜色过于杂乱,影响导向认知。
2,统一的规则,有助于用户预判没有见过的页面,更加清楚页面的结构,某一个细节的导向特点。例如蓝色的字体可以点击,“”icon+文字”代表也可以点击。
3,设计过程中,如果过于用感性去设计,那么我们有时候一些标题字体大小、以及颜色、图片倒角,很有可能都设置的不一样,这会影响风格的统一,以及程序员编辑页面工作会加重。
4,规划这些,有助于我们把页面的层次划分的更清晰。
5,方便统计工作量,未来工作量也会减少很多。还能避免一些不必要的返工。
UI设计的细节规则很多,这里我就这样简单说明一下我所注重的一些点。总体来说,设计一定要有规划性,去处理未来可能会更省力的事情、避免做一些低效率的修改工作。以及在设计中,心理一定要有这么一个“辅助线”,帮助我们完成有思路的设计。美观有一定是感性,但是如果我们把它整理成一个规律,把抽象变成具象、数据化的东西,那就能创造“美的理论”了。规律产生美! 更多培训资讯请持续关注天琥教育官网。