作品没设计感怎么提升  ?1%的人才会这个训练方法  !

作品没设计感怎么提升
?作品1%的人才会这个训练方法
	!

今天要围绕这期 C 端学员提出的没设问题做解答,内容是计感 —— 为什么做出来的界面没有设计感,应该怎么练?提升

一、界面的个训设计感是什么

我相信很多同学还是初学者都会发现 ,自己做的练方界面就是很"普通",缺乏设计感,作品比如下面这些案例(随手找的没设) 。

作品没设计感怎么提升?计感1%的人才会这个训练方法�!

作品没设计感怎么提升�
?提升1%的人才会这个训练方法!

作品没设计感怎么提升?个训1%的人才会这个训练方法!

作品没设计感怎么提升�?练方1%的人才会这个训练方法�

!

作品没设计感怎么提升
?作品1%的人才会这个训练方法!

这种界面的没设质量只能叫 —— 给原型上色 ,远远达不到专业要求 。计感很多设计师自己也能感觉出来做出来的东西不够理想  ,没设计感,但就是不知道怎么优化和改观。

这种问题的存在非常普遍,因为 UI 设计虽然很简单,但它还是设计,是需要积累和经验 。而只是学会软件和了解些基础规范的话,是不足以支撑有效设计输出的。

所以,必须要做进一步的训练来提升这部分的能力 。而想要提升界面设计感,首先就要知道设计感是什么 。

设计感是一个比较含糊的名词,它是对设计专业性的评价 。有设计感 ,就是设计出来的东西看起来专业 ,没设计感 ,就是设计的东西看起来简陋  、业余 。但要注意的是 ,简约不代表没设计感。

作品没设计感怎么提升�?1%的人才会这个训练方法	!

更具体一点 ,设计感就是对不同设计细节处理的合理性和创意性,比如内容的排版、线段的应用、色彩的填充、图标的样式等等。设计感不是一个单一的问题,是不同细节专处理的合集 ,这些细节处理得越专业,设计感越强,反之则越弱。

分拆细节逐一讲解虽然有必要,但篇幅太长 ,我们在这里先围绕一个能囊括这些细节的对象做解析 ,即 —— 组件。

UI 的界面是由若干组件组成的,每个组件往往有很强的独立性,不管是内容还是样式上,比如下面的案例。

作品没设计感怎么提升?1%的人才会这个训练方法
!

所以 ,我们可以把界面理解成是一个若干小模块的设计 ,只是最终有一个把它们组合起来的过程 。

每个小模块的设计,就是形成界面设计感的关键。我们来看看一些"简单"的组件 ,和另一些"成熟"组件之间的对比 。

作品没设计感怎么提升	?1%的人才会这个训练方法
!

作品没设计感怎么提升
?1%的人才会这个训练方法!

作品没设计感怎么提升?1%的人才会这个训练方法
!

作品没设计感怎么提升�?1%的人才会这个训练方法
!

在对比中可以明显感觉到,右侧的组件比左侧的更有设计感。

如果很多同学不知道怎么判断自己的作品有没有设计感 ,对比成熟的线上项目就可以得到答案 。

而右侧组件之所以看起来更成熟 、有设计感,是因为它们会增加很多设计细节,来提升整个组件的质感。

举个栗子 :

作品没设计感怎么提升
?1%的人才会这个训练方法!

如果设计出来的组件只有左侧的水平 ,右边这类组件样式做不出来  ,那页面的效果是指定不会好的 ,也不会有多少设计感。

所以提升设计感 ,就要重点关注组件的设计,通过优化局部组件的样式 ,来实现更好的整体效果。

二  、组件优化的方式和训练

设计是种思维和实践能力的结合 ,实践能力可以通过看教学和临摹获得,而思维的掌握却有一定的门槛 ,需要我们进行 —— 刻意练习 。

在经过长期的培训经验总结中 ,我认为最好的组件设计思维的掌握 ,就是通过实战方式获得 ,而不是看书 、看视频  、看干货分享 。

具体应该怎么实战?大致的练习路径如下 :

作品没设计感怎么提升
?1%的人才会这个训练方法!

第一步:页面选择

就是从原创页面练习的案例中找出一个页面(组件模块多点的)作为练习对象 ,比如下面这个学员的作业 。

作品没设计感怎么提升
?1%的人才会这个训练方法!

第二步:组件区分

确定页面中包含的组件类型 ,并对不同组件做一个基本的认识 ,它是什么或类似什么。

作品没设计感怎么提升?1%的人才会这个训练方法�!

这一步非常重要  ,因为虽然有很多行业通用的标准组件类型,比如瓷片区 、快速入口、动态卡片之类 ,但也有很多组件根本就没有明确的归类 ,你要自己给它做个大致的分类,才能在下一步有针对性的筛选相关的参考和案例。

第三步:寻找参考

接下来是很关键的一步 ,就是找参考,但大多数新手其实压根不知道应该怎么找。参考不是根据应用的页面类型去网上四处乱找 ,比如这个菜谱的首页 ,你就专门挑同类的应用首页去找 。一方面这类应用和案例数量少 ,另一方面做得好的就更少。

真正找参考的方式,是根据组件的类型去找 ,而不是页面类型 。且每个组件单独收集灵感案例 ,收集的标准一方面是质量比较优秀 ,另一方面是要觉得这个组件是可以套进原有设计中的,而不是完全没有抄的空间。

比如首页顶部栏和广告区域 ,可以找出若干的案例 ,然后放进本地的文件夹,或者类似花瓣 Eagle 中的画板里,这个收集过程不要太长,最多收集 20-30 个案例即可,再多也没用 :

作品没设计感怎么提升?1%的人才会这个训练方法
	!

第四步 :筛选对象

虽然前面收集控制了数量 ,但依旧有很多,会造成参考上的混乱。所以我们就要从中进一步筛选出最适合 、最优秀的学习 、模仿对象,再将它们和原组件置入到画布排列到一起 。

作品没设计感怎么提升?1%的人才会这个训练方法!

第五步:完成复制

即根据最终筛选出来的案例 ,完成对它们的样式复制 ,也就是直接"抄" 。但因为组件之间字段信息有一定的差异 ,所以当然不能完全一模一样的抄下来,而是要在吸收它们设计优点的同时换上自己的内容。

而每个组件并不是只做一个就够了 ,实现越多的效果,对最终页面的影响越大 ,作为练习的效果也越好 。

比如下面这样:

作品没设计感怎么提升
?1%的人才会这个训练方法
	!

作品没设计感怎么提升?1%的人才会这个训练方法!

作品没设计感怎么提升?1%的人才会这个训练方法	
!

组件都完成以后 ,最后就可以去把整个页面拼起来 ,做最终的优化 。而因为做过的组件样式不止一种 ,所以可以进行不同的组合,组合出新的页面。

按这种方式完成的案例和原图对比如下 :

作品没设计感怎么提升
?1%的人才会这个训练方法
!

在这里我们只用最基本照搬的模式给你们展示结果 ,而不是我们自己认为更合理的修改 ,也能比原来的设计有极大的提升。原因就是你们需先学会怎么找参考,怎么关注别人优秀的细节,怎么把优秀的设计套到自己项目里来,否则纠结得再多 ,最终输出的结果还是很普通 。

使用这种方式进行训练,一周完成 3-5 个页面案例 ,那么一个月后你就可以得到完全不同的结果 。

结尾

设计能力的提升源自有效的练习 ,光看不做是没有结果的,方法给了剩下的得靠自己练 ,不然谁也帮不了你们 。而这种训练,最多也就只有 1%的设计师会展开 ,所以他们立马就可以获得压倒性的优势。这是 UI 行业实际上一点也"不卷"的原因 。

作者 :超人的电话亭

上一篇:金铲铲之战S12卡尔玛主C若何玩 S12测试服气概时分学派卡尔玛
下一篇:尽区零朱鸢技能晋级若何选择 技能晋级优先级推荐

欢迎扫描关注我们的微信公众平台!

欢迎扫描关注我们的微信公众平台!