对于互联网设计师来说,不论你是擅长交互、UI或者从事创意项目,拥有全面的设计能力已经变成了一种趋势。熟悉了工作流程,快速得产出优质的设计方案是设计师能力的直观体现。互联网大厂的招聘和人才培育也都对设计师的全栈能力有着更高的要求。
无论是交互稿还是视觉稿,很多新手互联网设计师都会遇到表达上的困境,可能前辈说最多的就是“提高审美”,但如何提高呢?怎么能直击要害的快速提升的“互联网界面设计的审美”呢?
这里也没有答案,但我们可以通过一些“作弊”式的实用技巧来快速改进自己的设计方案、提升自己的作品水平。
1.利用多种字体变化方式打造文案层次
不要仅仅依靠放大缩小来创造文案的层次,要学会利用字体大小、粗细、透明度等多种变化手段。
在设计时,我们总会遇到排列文案的情况。信息重要程度和逻辑关系存在差异,因此也需要差异化的透传方式。单纯的对信息放大缩小显然不够灵活,差异化也不明显,这就要求我们从信息文字的大小、粗细和透明度等多维度着手,创建更鲜明的层次结构。
2.彩色背景使用同色系文字
彩色背景上不要使用灰色文字,而要使用与其同色系的文字。
我们经常会使用黑白灰的配色来区分文案的层次关系,但在彩色背景显然不够严谨。灰色文字往往不适用于彩色背景,两者搭配起来在视觉上很不和谐,灰色需要替换成与背景色相通的颜色。
颜色的变化一般可以通过调整白色字体的透明度或者调整饱和度和亮度来实现。
3.调整“饱和度&亮度”实现同色系颜色变化
用户界面的颜色选择是有技巧的,同色系颜色并不是改变透明度就能实现的。界面上的颜色变化归根到底也是来源于真实的场景。
我们可以在生活中会看到无数上光影变化,如下图,当有阴影的颜色变化时,你可以发现亮度下降,而饱和度却在上升。
因此,我们可以从自然的光影变化中发现同系颜色变化的规律:
“ 颜色变化更深=饱和度更高+亮度更低
颜色变化更浅=饱和度更低+亮度更高 ”
4.让阴影产生偏移
通过偏移的阴影可以缩减阴影的覆盖面积,强化阴影的效果,使主体更聚焦。
卡片的阴影变化也是来源于现实场景,在使用阴影时,我们应该尽量模拟真实的自然光源,让阴影有垂直偏移的角度。这样的阴影设计不但更加自然,也会缩减阴影的覆盖同时强化阴影的效果,更好的呈现主体内容。
5.尽量不要使用线框
用一些方式替代线框的使用,会使整个界面变得更加清爽自然。
界面设计中,卡片是很好的信息载体,其设计重点在于突出内容信息而不是强调卡片自身。线框的设计容易形成视觉干扰。因此,用过阴影变化替代死板的线框,能够更好的突出卡片主体。
要在卡片中呈现不同类型的信息,线框的分割会产生很强的割裂感,通过背景色的变化即可。另外,背景色的差异程度也可以实现更多的层次变化。
除了加入新的元素来分割信息,单纯的改变组间信息的距离也是很好的分割方式,相比分割线,间距的变化会更加缓和。
6.统一的封装方式使icon的变化更加一致
通常在运用icon时,我们会对它进行大小变化,但被放大的icon往往会显得缺乏细节。另外,不同的icon在高低和宽窄上很难同时保持一致。面对以上问题,我们可以通过统一的背景封装方式进行改善,是icon的变化和表达更加具有一致性。
7.强调边框使平淡的栏目状态增添色彩
强调栏目的方式有很多,背景色变化会产生较强的效果,而字体颜色或大小的变化有时又难以引起用户的关注。强调边框是一种很克制的强调方式,和其他方式搭配使用会产生多样的强调效果。
8.不必强调所有按键
并非所有的按键都需要引导用户点击,在设计按键时也要考虑其功能的差异化。我们在设计时要优先考虑按键的优先级,即哪些按键能引导用户更积极的操作行为。之后再进行视觉上的差异化展示。
写在最后:
以上所谓的“作弊”技巧是基于界面设计的现状和设计时普遍存在的问题进行总结的。能够帮助你快速的提升设计效果,守住品质的底线。但设计趋势在不断变化,随着个人的能力提升,我们还是要主动探索更有前瞻性的设计表达方式。
(公众号:体验设计杂谈)
网友评论