快速提升 UI 设计效果的 6 个小技巧 (UI 设计集-3)。

编者按:在进行 UI 设计的时候,很多小技巧能够恰到好处地提升界面的设计视觉效果、用户体验。这篇来自Mark Andrew 的文章梳理了 6 个实用性很强的 UI 效果提升小技巧,是系列文章的第三篇,原文最早发布于 marcandrew.me 。

在创建实用、可访问性良好且视觉效果颇为出彩的 UI
界面的时候,我们大多只需要进行有限度的微调,即可达到颇为不错的效果。在之前,我已经撰写了很多实用的 UI & UX
优化小贴士(看完文章在文末获取),这篇文章继续增加 6 条实用的建议,一起来看看吧!

1、让视觉元素的设计特征保持一致

快速提升 UI 设计效果的 6 个小技巧 (UI 设计集-3)

UI 设计师是习惯的创造者 ,另一方面,用户也希望你的设计能够符合预期。

换句话来说,UI 设计师可能个用一致的设计来归训用户,而用户也可以通过一致的设计来构建起习惯和预期,所以,在布局,图标,配色和按钮上将用户统一到一起,降低混乱度,改善用户体验。

2、大胆使用留白来布局

快速提升 UI 设计效果的 6 个小技巧 (UI 设计集-3)

留白,或者说负空间,可能是绝大多数的 UI 界面优化的最佳工具。

很多 UI 界面只需要适当增加留白,就能够将整体的视觉效果拉高一截,它可以让元素和元素之间的呼吸感更强,整体感知更加优雅精致。

3、优化开头段落样式

快速提升 UI 设计效果的 6 个小技巧 (UI 设计集-3)

如果你所要呈现的是长篇内容,通常开头的段落会对全文内容进行总结性的引导,提出问题,引起用户的注意力,那么你需要让它的功能性更强一点。

要实现这一点,其实也不复杂,就针对这个部分做一些针对性的样式优化就可以了。

最简单的方式,就使用不同的字体,或者增加字重,提高行高,让这一部分的视觉重量超过其他的部分即可。这样可以让用户更快注意到这一部分,并且留下更好的印象,并且增加内容的信息层级。

4、为快速扫读进行段落优化

快速提升 UI 设计效果的 6 个小技巧 (UI 设计集-3)

在处理长篇内容的时候,短句和短的段落会更加契合当下用户的阅读习惯。尽可能使用简短有力的分段,让用户可以更快消化内容。

5、使用更富凝聚力的配色方案

快速提升 UI 设计效果的 6 个小技巧 (UI 设计集-3)

是否心爱纲要创建更加专业的视觉风格?那么你最好使用一套预先定义好的配色方案。

色彩从来都不是多多益善,更加集中的配色能够给用户带来更加清晰明确的感知。

从一开始就创建一套强大而明确的配色方案,并且坚持使用下去,这样可以避免麻烦,并且增加整个设计的一致性。

6、使用8pt 网格系统,均匀排布图标

快速提升 UI 设计效果的 6 个小技巧 (UI 设计集-3)

你会注意到绝大多数的图标系统,使用的图标尺寸大多数是 8 的倍数,比如 16×16,24×24,32×32,所以当你使用 8 pt 的网格系统,会很好地同这些图标系统兼容起来。

当然也有例外的情况,但是这样的情况真的不算太多。

本文来自投稿,不代表重蔚自留地立场,如若转载,请注明出处https://www.cwhello.com/234300.html

如有侵犯您的合法权益请发邮件951076433@qq.com联系删除

(0)
重蔚的头像重蔚管理团队
上一篇 2023年3月1日 13:04
下一篇 2023年3月1日 13:05

相关推荐

  • 轮播图你真的需要用到?

    因为,我们都知道轮播图的点击率通常都低,而且转化的效果也不好。但往往占用了页面最抢眼的大面积位置,所以要真的切实地考虑是否有必要使用轮播图。 首先,设计不当的的话,轮播图很容易被用户是广告图片而已,会…

    2022年6月25日
    0142
  • 页面当中的搜索图框应该怎么设计?

      使用放大镜图标 在如今的页面设计趋势当中,搜索的概念与放大镜图标之间的关系已经深得用户的心。一般来说,大多数的用户都习惯将放大镜当成是搜索图标。 搜索框显眼 若果搜索框是你的网站或者页面的重要功…

    2022年6月25日
    0126
  • 界面动效设计的状态:独立、进入与退出

    1、 独立运动 也就是动效作为一个独立的元素,进入和退出界面时,都不会对界面上其他元素有影响,尤其是位置方面的影响。 2、 进入界面 一般来说,动效元素进入界面是以减速的曲线形式进入。又或者是以做大的速度进…

    2022年6月16日
    0142
  • 专业响应式网站设计需要把握好的要点分析

    网站设计,随着智能手机的普及,移动端网页访问量越来越多,响应式网站建设越来越流行,现在很多企业都想要做响应式网站。但是,响应式网站虽然做起来科技难度不大,而且也有很好的发展前景,但是对于响应式网站设…

    2019年11月12日
    0400
  • 如何尽可能的提高设计稿的还原度?

    使用辅助线而不是猜测 不要自诩为像素眼,最标准的还是使用辅助线,让页面元素更加的清晰、整齐,尤其是在放大之後还能够对齐和避免毛边问题出现。 宽度不要定“死” 将宽度定住,容易出现实际的页面设计过程中与视觉…

    2022年6月25日
    0113
  • 交互设计如何有效地进行分析需求

    交互设计流程,是设计师从拿到网页设计专案的需求就着手的。交互需求分析主要目的是,明确网页设计专案的目标定位,以及它想要实现的功能。 需求分析有很多有效的方法,比如目标使用者分析、竞品分析或者已有的网页…

    2022年6月25日
    0230
  • 什麽是页面的空间共用式排版  

      如今,空间共用式排版是页面设计当中比较容易识别的方式。最为典型的特徵是文字或者相似的元素横跨多个图层、模组或者区块。 从广泛意义上来讲,这种排版的方式核心概念在於,某个元素和其他的元素拥有着共…

    2022年6月25日
    0234
  • APP设计新知:APP设计中如何做好引导设计

    APP设计中的引导设计,主要是帮助用户更快熟悉APP的操作,及了解APP的特点。引导设计得好,不仅能有效实现用户的留存和转化,还能降低用户的使用成本。 既然引导设计这麽重要,那麽APP设计中如何做好引导设计? 一、…

    2022年6月25日
    0343

联系我们

QQ:951076433

在线咨询:点击这里给我发消息邮件:951076433@qq.com工作时间:周一至周五,9:30-18:30,节假日休息