UX Pedia Presents
本文约2014字，阅读需要6分钟
资深经验合集 Part.1
创建美观又实用的用户界面需要花费一定时间，而且在设计过程中，还要进行大量的迭代与优化。通过多年来的经验累积，我发现有的设计进行一些简单、快速的调整后，就可以大大提升效果。
本指南中，我整理了2020年12个月中流行的UI/UX技巧，而这些技巧可以毫不费力地帮助我们改善设计与用户体验。
01 使用细微的边框，使元素看起来更加清晰
在某些元素周围使用多重阴影或是一个细微的边框，能使元素看起来更清晰，并帮助避免那些看起来很混乱的阴影。
02 减少标题中的字母间距，保持视觉平衡
标题通常会比正文的字号要大，字重也不同，也会使字母的间距显得较大，在视觉上会觉的很散。通过降低字间距值，使标题在视觉上更平衡易读。
03 图标视觉风格保持统一
用户界面中的图标风格，请保持一致，如相同的视觉风格、颜色和轮廓，不要混搭。
04 在设计中只使用一种字体并没有错
在创建设计时，只使用一种字体并没有坏处，这样做实际上可以帮助你的界面简洁一致。你可能会产生“是否会显得单调？”的问题，结合Weights，Sizes和Color，即便用同一种字样，用户也是可以接受的。
05 界面中巧用空白
在界面中适度地使用空白，可以让画面更有呼吸感，这是最快、最直接的设计改进方法之一。
06 创建长篇内容？尝试20pt
对于长篇内容（例如，博客文章，项目描述等），请尝试使用20pt作正文字号，当然，这也取决于具体选择的字体，不过大多流行的正文字体，在20pt时效果很好，当用户面对文字模块时也不会太糟糕。
07 使用字体比例，创造字体组
使用字体比例可以帮助你轻松实用地定义一组字体大小，Type Scale是基于比例因子（例如1.25）工作的。从基本字号18px开始，将其与比例因子相乘（或除以），以得到高层级字体（即H1，H2等）或较低层级，如字幕，按钮的注释说明。
不妨来这个网站，详细了解下字体比例——https://type-scale.com
08 选择一种底色，用色调和阴影进行统一变化
在界面中，不必用大量的颜色来填充，会造成画面花哨。如果项目允许，只需选择一个基础颜色，调整色调和阴影，效果就很棒了。
09 改善用户流程体验
使用户可以随时跳过你的开屏动画，请将“跳过”按钮放置在容易触及的范围内，也能给新用户建立不错的应用体验。
10 页面中的按钮阴影来自相同光源
确保你的按钮阴影始终来自一个光源，我发现这是设计师常犯的一个错误，虽然不大但也让整体设计有了瑕疵。
11 使用字体家族
选择困难症设计师的福音，更降低了出错率。字体家族是字体的集合，例如Serif和Sans-Serif变体，但在视觉上仍是一致的。我强烈推荐的一些是  Merriweather & Merriweather Sans 和 Roboto & Roboto Slab 你可以在Google字体库中找到。
12 叠加颜色蒙版，降低图片与文字的对比度
根据文本在图像上的位置，来测试叠加层的具体色值，也可以使用渐变叠加层（从下到上，或从上到下），以实现两者之间的简单对比，无需太复杂。
13 适度居中文本
文本居中，尽量用作标题和少量文字段落，而其他内容请左对齐。
14 多用途文字，选择多种字重的字体
你找的字体是否有大量的字重和样式？建议避免使用仅有一种样式与字重的字体。有的设计项目可能在标题上进行特别设计，但从多数情况来看，选择的字体样式尽量丰富。
15 在浅色背景上使文本变暗
在浅色背景下工作时，别使文本颜色太浅，避免增加用户的阅读成本。
16 文本色过于厚重，请使其变亮
当涉及到长篇内容时，某些常规粗体字体就显得很沉重，在屏幕上也显得很呆板。不妨试试Dark Gray（即#4F4F4F）之类的色号来淡化文本，使其在视觉上更容易阅读。
17 行为号召按钮，放在最醒目的位置

通过使用颜色对比、大小和标签，确保行为号召按钮尽可能突出。
如果可以的话，不要总是依赖Icon，使用文本标签，也能实现，还能使用户理解更好地理解。
／End. 
相关引用
-翻译自原文
https://uxdesign.cc/the-ui-ux-tips-collection-volume-one-f69f0969ed17
-图片、GIF来自网络；封面动图 by Cindy Suen
-未经UX Pedia允许不得转载
往期推荐：
辞典说 | 个人网站建站工具最强测评！
辞典精译 | 必看，10条给UX设计师的职业路径建议
辞典精译 | 10大在线提升UX/UI技能网站
辞典说 | Behance解读2021年6大新趋势！
  UX 辞典  
策划│雪诗
翻译│梦奇
编辑│梦奇
• 扫码加辞典酱 •
• 成为学习交流小队一员吧 •
形象理解用户体验，时刻关注设计趋势
Powered by Canopy Institute of Design
2020©UX Pedia. All Rights Reserved
「喜欢UX辞典的推送，请设置个 星标☆ 」
「下次就能 第一时间 看到惹」
 赞了吗  在看吗 
 戳下这里呗  别害羞 :  ) 
继续阅读
阅读原文