UI进阶:UI界面的视觉认识
积累
第一件事,不要去管自己会做出什么样的东西,而是先解构我们要设计的这些界面。
我们设计的这些界面都有什么元素组成:几何元素、文字元素、图标元素、图片元素
对于UI界面来讲,就是通过一定的设计目标去组织、排列这四种元素,完成一个整体的、美观的、可以交互的页面。
什么设计目标?你想让用户看到什么信息、你想让用户感受到什么、或者你们产品经理想实现的目标或者公司想实现的策略。总有一个这样的目的。
一定要记住:进阶的真正的UI界面设计一定不是说通过做出很多花里胡哨的,然后告诉你用各种视觉技巧做出的界面,一定是稳固的、有目的性的,然后符合我们要求的去输出这4个元素。
界面设计知识点解析
下面界面要怎么展开,我们需要什么样的状态或者什么样的一个方式,我们才能设计出好的界面
第一部分:我们要设计出符合要求的界面,我们需要具备哪些能力。下面对能力进行一个拆解
UI设计师具备的能力
软件使用——规范掌握——组件应用——图标绘制——平面排版——配色技巧

软件使用:以上3种软件,已经学会其中一种;MAC:sketch;PC:figma
这三个软件都是针对UI设计界面做过优化的软件
学会一个就可以,其他另外两个基本就会了,这是3个不同的公司相互COPY的功能
PS和AI一般处理的不是做界面有关的这些内容,不是编排4个元素的问题,而是处理一些更重要的或者说运营设计或者是平面设计的一些需求,不是我们界面设计直接使用的工具,你要做也可以,但不是它们的使命
规范掌握:在移动端界面设计中,需要了解对应系统的相关规范,确保应用的可行性,主要了解IOS和Andorid两个系统的界面设计规范
这两个规范需要相对多花点时间了解,IOS和安卓其实是我们设计界面的时候你必备的去了解整个生产环境过程的这样的一种方式。
或者说我们进入这个行业,我们去做这些东西,但是每个行业都有自己的标准,也不一定说我所有的设计都跟着这两套规范走,而是我们进到任何一个行业里,你要有一个概念,就是这个行业慢慢的形成的一些稳固的标准,而在UI界面中,它主要由IOS和安卓生产的,这两个系统的官方来制定出来的东西,他们当中包含了很有趣的一些知识点,还有一些很重要的交互的讲解说明相关的一些内容,我们在做这个讲解的时候,其实会帮助大家去集中到一些什么,化繁为简,去集中到一些与我们视觉相关的规范内容里。
官方组件库的熟练应用:
基础的组件和控件是构成UI界面交互和操作逻辑的关键因素,熟练掌握官方提供的组件库,是设计界面的必备内容。效果就是快速而且不出错
图标,作为界面的重要组成部分之一,除了应用素材之外,也要具备独立的绘制能力,在今天的UI领域内,图标已经具备非常丰富的设计方向和规范
排版和配色技巧:了解前面这些细节,我们要有将他们组合和排列的能力,这需要我们掌握对应的排列技巧和配色技巧,如果这两种技巧缺失,做出来的界面一方面不高级另一方面信息模型第三点没有视觉上的吸引力,这是做新手时特别要命的事情
好不好用是交互的问题,看上去是不是舒适,直观的视觉印象里,这完完全全是平面的知识点,所以平面的知识点只有两大块:排版和配色
第三部分 优秀的界面要素
对于优秀的界面,必然有一个评价的标准,而这个评价集中在以下几个维度;
有一个观点:设计是一件很主观的事情,一千个读者会有一千个哈姆雷特,但是在UI设计领域中几乎不存在这个概念,除非两套特别优秀都过了优秀这个概念的两套作品,你可以说你喜欢哪一套。
如果不是这样,那就不必要存在一些设计上的技巧概念和公约。
优秀界面标准:4个维度:符合规范——视觉合理——细节统——功能完整
如果达不到,就会感觉特别差或者特别平庸
符合规范的依据:一些设计细节能暴露你并未掌握设计规范。印象分会拉很低
视觉合理的依据:
细节统一性的依据:
功能的完整的依据:
每个维度中还包含若干的细则,明确到具体的某个元素的应用,需要我们长期的探索和适应,也可以成为设计复查表的依据。













































































