第一波!设计师必须注意的 12 个 UI 设计小技巧

释放双眼,带上耳机,听听看~!
本文总结了10个UI设计小贴士,对着自己的设计来进行快速检查,能够定位并处理很多常见的小问题。

还记得那个每年都会总结 UI 和视觉规划趋势的资深规划师 Michal Malewicz 么,他最近开端在推特上分享他日常工作中留意到的 UI 规划技巧,这些小技巧尽管零散,可是很好地总结了 UI 规划的一些常见问题。

结合这些小贴士,对着自己的规划来进行快速检查,能够定位并处理许多常见的小问题。

1、尽量防止运用轮播图指示器

绝大大都用户都只会往下翻看页面, 横向翻页的轮播图大都时候用户不会翻动查看的。

轮播图一般很难快速引起用户的兴趣。
假如能够尽量移除这个功用,或许运用其他的选项控件来替代它。

2、运用指向性清晰的按钮标签文本

按钮标签文本内容应该一直指向清晰的动作,告知用户单击此按钮后会产生什么。防止「下一步」、「好的」 和其他模糊的操作名称。

防止运用「确认」或「下一步」等模糊的操作。
按钮的标签文本需求清楚地说明将要产生的工作。

3、按钮文本相同需求层次结构

当 UI 界面中有多个按钮的时候,应当一直显示哪些操作是首要的,哪些是非有必要的。防止让两个操作对应的按钮在外观上是相同的,由于这需求用户更长的时刻分辨,可能会让人感到困惑。

清楚地显示哪些动作是 首要的1️⃣,哪些是非有必要的2️⃣ 。
防止让两个操作按钮在视觉上看起来是相同的

4、防止运用笔触太纤细的字体

笔触太纤细的字体在阅览上究竟困难,尤其是在正常字号的情况下,还会让文本看起来并不重要。

常规、半粗体和粗体的字体更易于阅览,而且有着更好的可拜访性。
防止在您的项目中运用笔触过于纤细的字体。

5、图标风格款式应当保持一致

混合不同类型的图标(比方 描边款式 vs 填充款式),会使规划给人感觉比较混乱,尤其是许多图标在被触发状态下,会从描边款式切换为填充款式,不相同式在同一状态下混用,可能会和用户的认知预期相悖,导致利诱。

所有的图标都应该具有完全相同的款式、风格和方式。
不要将填充的图标与概括的图标混合在一起。

6、在按钮中保持足够多的空白

短少足够留白控件的的按钮在视觉上是十分不美观的,一方面会导致使音讯难以阅览,另一方面,会让规划显得完成度缺乏。

比较安全的选择是文本间隔边际至少有一个「x高度」的间隔,假如是2倍则更好。
防止运用文本标签周围留白太少的按钮。

7、防止运用赤色星号来标识必填字段

现在的移动端表单规划倾向于不运用赤色星号来强调必填字段,而是尽量只为用户供给必填的字段,而且错误的字段顺序会使得填写表格十分耗时。

假如能够,请改为文字标明是「选填」或干脆去掉这些字段。
防止运用赤色星号来表明必填,并尽量只让用户填写必要的字段。

8、防止运用多栏表格

尽管多栏表格的空间利用率更高,可是体验和可用性并不好,选用摆放在一列的表格会愈加愈加清晰易读,也易于填写。

将表单保留为一列,以便于快速阅览和填写。
尽可能防止运用多列表单!

9、尽量防止在表单中运用下划线标识字段

将需求填写的表单运用下划线来表明,关于用户来说不是很明显,一般用户需求花费更长的时刻才能了解下划线意味着待填写的表单。

用户需求更长的时刻才能了解下划线字段为需求填写的表单。
输入框具有清晰可见的边界,也能够很轻松地被了解。

10、音讯通知的特点和色彩、符号保持一致

关于信息不清晰或许对立的通知,很简单让用户感到利诱,首要是它的意义(表明必定仍是否定)和所对应的视觉标识(比方色彩、图标、符号)应当相互匹配,否则用户会很难确认这个信息的准确性。

防止运用对立的信息,传达不清晰的信息。
清楚告知用户产生了什么以及接下来要做什么。

11 、防止运用太小的点击区域

太小的点击区域,无论是在移动端UI 仍是桌面端 UI 上都会降低用户的舒适度,而且常常令人感到困惑。

较大的控件尺度在桌面上更易于运用。
即便在桌面上,也要尽量防止较小的点击区域。

12、表单输入框尽量防止运用圆形边际

圆形表单输入框在视觉上总不是太好处理,即便文本和输入框对齐了,在视觉上也会很奇怪。

输入框选用小弧度圆角是没问题的,可是要让它视觉上做边际清晰。
纯粹圆角的表单输入框左边际上存在视觉对齐的问题。

给TA打赏
共{{data.count}}人
人已打赏
教程分享

五种酸性质感技法大揭秘,你想了解的都在这里!

2021-9-2 17:16:48

教程分享

UI 进化论:优酷智能 UI 设计

2021-9-6 17:23:20

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索