21 从图像中选择颜色,使产品栩栩如生

APP界面UI设计趋势(三)_移动开发

从产品图片中选择颜色,将你选取各种色调和阴影应用到背景、文本、图标等部分来增加视觉特点,让设计更有个性。

22 根据字体x-dataheight来设置行高

APP界面UI设计趋势(三)_其他_02

具有不同x-dataheight的字体,需要不同的行高测量值,以实现文本每行之间正确的分隔。即使有2个相同18px的字体,它们的x-dataheight也会相差很大。

23 突出最重要的元素

APP界面UI设计趋势(三)_移动开发_03

结合字号、字重、颜色与版式,可轻松突出UI中最重要的元素,简单微妙的调整,让用户体验变得更好。

24 为表单错误添加辅助提示

APP界面UI设计趋势(三)_移动开发_04

添加错误提示是一种简单又有帮助的额外视觉辅助,能帮助用户填写任何形式的表单。

25 在移动设备上创造大量可访问区域

APP界面UI设计趋势(三)_其他_05

在为移动设备设计时,尝试创造足够大的可触碰区域,方便点击。对于只包含文本的按钮和链接来说,尽量使用带有标签的图标。

以下是iOS & Android推荐的最小点击区域:

44 x 44pt,适用于iOS

48 x 48dp,适用于Android

26 尽量只在短标题中使用大写

APP界面UI设计趋势(三)_其他_06

如果你想在标题中使用全大写,确保标题尽可能短,最好只有一行。如图中的对比,过长的全大写标题带来的视觉感受并不好。标题中加大字母间距,看起来也更顺畅。

27 提高浅色文字和图像之间的对比度

APP界面UI设计趋势(三)_移动开发_07

浅色文本在浅色背景下应当是易读的,在文本后建立一个不完全透明的深色背景,就能轻松提高对比度。

28 标题类推荐字体

APP界面UI设计趋势(三)_其他_08

这些衬线、无衬线字体,我以前用过很多次,我发现它们非常适合做标题,让设计有一点温暖和个性,在fonts.adobe.com上可以下载。

29 正文类推荐字体

APP界面UI设计趋势(三)_其他_09

一直用于长体文本的Serif和Sans-Serif商业字体的一小部分,非常推荐,同样在fonts.adobe.com上可以找到。

30 垂直标题和正文统一版式规则

APP界面UI设计趋势(三)_其他_10

垂直段落在搭建视觉层次结构时,有必要按顺序排列边距。如图所示,左侧段落在标题上使用了相等的顶部、底部边距,但这样做却失去了与正文的粘性。针对这种情况,最好在标题顶部留出更多空白,而标题底部减少留白,这样两个部分的联系也会更牢固。


原文链接 https://uxdesign.cc/the-ui-ux-tips-collection-volume-one-f69f0969ed17