UI扁平化设计新手设计师必须要掌握的几点在当今信息爆炸的文化背景下,人们每天要通过过手机APP接触巨大的信息流,然后再持续的进行评估、过滤并且再加工,具有认知上的负担,扁平化UI设计更加适合信息碎片化的传递方式。 扁平化的UI设计通过将有效信息分类,对信息层级的编排与梳理,将核心内容的路径扁平化,使用户通过更少的路径便迅速获得信息。 扁平化UI主要设计步骤 ①在进行手机应用程序UI的设计之前,首先要做的就是明确功能和目的,要对产品的定位要有一个明确的了解,对目标用户进行详细的研究,分析出用户群体的使用特征、情感、习惯、心理、需求等信息,并得出用户研究报告和可行性设计建议。 ②其次要做的就是界面信息的梳理工作。在对应用程序功能和目的诉求充分了解的情况下,对整个信息层级进行规划,同时将整个应用程序的重点功能和逻辑关系清晰的展示出来,把不必要的信息全部删除。 ③在完成了信息梳理的基础上,第三步是为整个界面做岀原型的架构,包括操作与跳转流程、结构与布局,按照有意义的方式将信息分组,每一级页面中所包含的内容与交互反馈方式都必须在这一步完成,为后续的原型设计做出明确的框架结构。 ④根据成本和进度,绘制出界面的原型图,原型是一种设计的表现形式,它必须在最终方案成型之前就进行展示,所以在此阶段绘制出线框原型图,便于展示方案、进行讨论,同时在设计中和开发人员进行沟通,一旦发现问题能够及时的进行修改。 ⑤界面的视觉效果设计,根据界面原型图为框架,在此基础上进行视觉效果的处理。 扁平化UI的设计美学 无衬线字体 在设计时应该选择简单易用的字体,在通常情况下,最好的选择就是无衬线字体,在西文中它被称为无衬线体,在中文中则与黑体相对应,它没有锐利的转折和收笔时的棱角,整体感觉较为流畅、简洁,呈几何形态,在手机屏幕中也更加容易被阅读。 色调与饱和度 鲜艳明亮的色彩能够使界面在任何亮度背景下都有良好的对比度,为界面创造出与众不同的感觉,以此获得用户的注意。 所以在通常情况下,提到扁平化设计的色彩方案,就会联想到高饱和、单色调的色块等等。 我们在进行颜色的选择时都会考虑到视觉疲劳因素,通常选择视觉上相对柔和,在使用过程中尽量延迟视觉疲劳出现的时间的颜色,通常的做法是降低色彩的饱和度。 简化图形 扁平化UI设计中常用高度精简的图标,来代表某一个操作步骤或者是功能的视觉展现,在形态上进行最大化的精炼和提取。有简洁、形象的控件图标,也有线条色彩丰富、具有描述性的图标,它们的共同特征是都具有基本的几何形状。 没有多余的装饰效果,仅仅将图案从最开始的具象表现的含义进行提取,再用线条和色块来进行模拟,中间会经历数个步骤,并将细节与轮廓进行适度的取舍,将极简的要素运用到界面设计中去,清晰明了的表达信息。 版率 对于简洁的内容元素来说,还需要进行美观的排版设计,才能获得更加良好的视觉效果。由于扁平化设计中使用的都是简洁的视觉元素,所以布局方案就显得非常重要。 留白可以理解成版率,其主要的作用就是凸显层次、突出内容。 进行版面设计的时候,在重要信息四周加上留白,就容易将视线集中到小面积的内容上去,使焦点得到突出。 动态效果 美学不仅包含了图形、色彩等艺术表现方式,也包含了其它可以引起用户反映的其他视觉效果,所以动态效果从某种程度上来说也属于美学的范畴。 动态效果要在符合物理定律的基础上来构建动画,例如:考虑到重力、惯性、刚性等,使动态效果显得比较真实,同时能够使用户感觉更加自然。
文章分类:
新闻动态
|