你曾经是否有过被别人说设计无细节,无品质感等这样的经历,其实每个人都会有这个过程,只是或长或短的时间而已。
设计细节不只体现一个设计师的能力水平,还体现他对产品的理解,对生活的认知。今天的思路能让你在做设计时候,多注意细节,提高美感!
今日分享大纲:
- 使用图标 / 图形
- 融入3D元素
- 使用高清图片
- 运用网格
- 注意版式
- 一致性
- 注意颜色
1、使用图标
添加图标或者图形可以使界面中元素的功能更加清晰直观,同时易于全球化设计和用户对功能的快速识别记忆。
如上图案例,左侧添加图标,右侧纯文字设计。左侧美观度提升,同时更加利于用户去使用与记忆功能。
IBM设计图,上下可对比,第一张图,去掉图形目前看着也能用,第二张图增加图形,画面显得饱满一些,功能都通过图标示意出来,直观易触达。
当然需要注意的点,切勿过度使用,造成画面花哨。
2、融入3D元素
3D设计不用多说,是当下比较火热的设计手法,它在平面包装、电商领域、动态视频、UI设计等涉及范围广,设计新颖,刺激大众感官。
△ 韩国UI
△ 腾讯视频
腾讯视频将异常状态3D化设计展示。
3、使用高清图片
图片在设计中起着重要作用,包括我们概念方案中的情绪图,或者在产品设计中使用图片,都可以更加生动体现产品性格特征。
图片使用3大要点:有意境,简单干净,高清大图
△ 左侧app:29cm,右侧app:Vsco
△ 来源:NIO Lifea
△ 电商设计领域更是广泛摄影图
4、运用网格
网格可以让界面更加有层次与节奏,一致性更强。网格已经在平面杂志设计中多年使用历史,同样在UI设计中运用它,一样可以做出优质设计。
杂志化产品视觉特征打造已是趋势,如果还不熟悉网格的运用,可以搜索下我之前写的一些关于网格的文章。
5、注意版式
这里说的版式也包括字体类型,版式中需要注意文字排版间距,字体行间距,对比度,层次结构,这些都是导致UI细节不完善的原因之一,也是我们最容易掌握的。
左侧设计中,输入框里面信息基本看不清,层级不明显;右侧层次凸显同时,信息能清晰识别到。
左侧排版无层级,右侧版式更加直观清晰,对比度明显。
6、一致性
一致性是一个老生常谈话题,但它确实是保证产品系统性,品牌性不可获取的条件,比如系统中图标样式一致、排版网格一致、插画元素一致、符号一致等。
下面展示一款韩国APP在这方面做得具有代表性:
实际线上的产品在一致性方面做得比较到位,一致性的运用,能使产品更加风格化,记忆特征明显,区分竞品,美学体验到达极致。
7、注意颜色
界面设计中,色彩是一切的灵魂,因为色彩,可以让我们对该品牌记忆深刻。之前我写过一篇关于色彩的文章,今天这里就不深入讲解,如果你很想提高色彩使用思路,可以再去看看这个颜色运用方法,搞定了我大部分排版配色
8、感悟
文中今天说了7种比较实用,同时大家易于掌握的方法与思路,帮助大家开窍。当然也需要灵活运用,每次在做界面设计的注意下这些细节,多思考,坚持下来,成为一个能做出好设计的设计师。
除了上面7种实用方法,还有其他类型的方法,比如微交互、情感化插图、UI品牌系统化、定义统一的具有DNA特征的品牌、功能场景感塑造。对于基础薄弱的伙伴可以先从上面7种入手。