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

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

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

1、 在 APP 当中保证底部标签栏内容不变

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

在目前绝大多数 APP 都会采用底部标签栏作为主要的导航模块,那么在设计的时候,要确保这个部分的功能上固定且明确的,不会消失,不会变化,不会给用户带来挫败感。

2、只需用字重字号变化即可构建层次

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

只需要使用字重和字号变化即可做到这一点!

在绝大多数的文本排版当中,只需要使用单一的字体即可实现层次颇为丰富的信息层级,你需要根据文本内容的重要性和优先级进行排列,优先级越高的文本字号越大,字重也越大。

另外要注意疏密排列,确保可读性和相关性更高的文本块更靠近。

3、在移动端 UI 上使用更大的可点击区域

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

虽然这个道理显而易见,但是总是在进行具体的界面设计的时候容易忘记这个重要的点。在 iOS 上,可点击的最小区域为 44×44 pt,在 AndROId 上则是 48×48 pt。

有时候,控件看起来可能较小,可以让触发区域尽量大一点。

4、使用尽量统一的导航设计

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

导航构成了用户探索网站和 APP 最为主要的行为路径,确保导航的一致性确保用户在后续的交互过程中不会感到疑惑和沮丧。

所以,在迭代升级过程中,即便是最微小的改变,也尽量在系统层级上保持统一。对于重要的、关键性的、破坏性的操作,可以做一些明显的差异化。

5、对于内容丰富的网站,让搜索功能凸显

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

如果有可能,对于内容较多的网站,尽量让搜索按钮被凸显出来,在触手可及的位置。尽量不要将搜索按钮隐藏在下拉菜单之类的地方,因为它可能是用户抵达目标的主要方式甚至可能上唯一方式。

6、不要随意选择字号

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

文本在页面当中字号到底要多大?在很多地方,字号的选择上其实是有完整的解决方案和处理技巧的。比如使用 TypeScale。

通常而言,让不同信息层级的文本大小保持 1.25 的倍率即可达到颇为不错的视觉效果和体验。而 TypeScale 可以基于基本的文本字体尺寸即 18px 按照 1.25 的比率进行缩放,从而帮你生成 H1、H2、H3 等不同层级文本的尺寸大小。

使用 TypeScale 生成的文本能够为你的排版带来自然、舒适的节奏和体验。

作者:李子木

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

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

(0)
重蔚重蔚管理团队
上一篇 2023年3月1日 13:06
下一篇 2023年3月1日 13:06

相关推荐

  • 在网页设计如何运用明亮色彩吸引眼球

    现在的网页设计逐渐趋向於简约风格,所以大多数企业网站都会选用黑白灰,或者是比较柔和的色彩为主色。但事实上,网页设计中大胆运用明亮色彩,可以吸引用户的眼球,让用户着眼於界面中重要的元素。那麽在网页设计…

    2022年6月25日 建站资讯
    0118
  • 两个tips让轮播图变得可爱  

      1、轮播图需充分融入到页面内容中 轮播图当中的信息内容与元素,必须和整个页面设计充分融入到一起,这样才能够让用户注意并且点击浏览它们。因此,建议使用与整站相符的风格、字体、色彩等。 2、慎用自动切…

    2022年6月25日
    0105
  • 万字长文!超全面的行为设计指南。

    在实际的设计过程中,通过观察或共情用户行为可以反映出很多问题,可以帮助洞察出更多价值或新的机遇。此前我在试图寻找一款还不错的机械美感鼠标,但是没有一下子找到合适的,准备第二天摸鱼的时候再看看,结果第…

    2023年3月2日 SEO操作
    03
  • 乾货收藏:盘点好看且免费的网页设计资源网站

    作为专业的设计师或网站制作公司,手头上应该有不少优质的设计资源。但如果突然间老板/客户叫你设计一份自己并不是很熟悉的作品,而手头上也没有这类型的资源,该去哪里找好呢?接下来,Inspirr Creation将为大家分…

    2022年6月25日 建站资讯
    01.6K
  • 5种成熟的导航栏设计 让你的网站用户体验加分

    可靠的导航设计能帮助用户达成目标,找到所需的内容,提升页面的转化率。但设计不合理的导航对於用户体验来说简直就是灾难,间接影响网站的转化率和用户的留存率。那麽,怎样的导航设计才算是成熟呢? 成熟的导航设…

    2022年6月25日 建站资讯
    0535
  • 实用!登录页面表单禁忌

    避免全大写的字母:很明显,影响了用户的阅读体验,降低了快速扫视的速度。 不要滥用下拉框:一般建议当登录页面设计当中的表单少於6个选项的时候,最好不要使用下拉框来让用户进行选取。这会降低用户的浏览和选择…

    2022年6月25日
    0192
  • 网页设计中的边缘设计。

    当我们设计我们的产品时,我们经常为快乐的路径场景设计,理想的用户流没有任何障碍。但是在现实生活中,有些情况是不需要计划的。这种情况被称为"边缘案例"。边缘案例可能非常少见,但它们对用户体验有…

    2023年2月14日 SEO操作
    05
  • 网站设计专业公司要注意哪些事项?

    网站设计,现在是一个信息化的时代,如果企业能够建立自己的网站。那么就能够跟上时代,文宣企业的产品,树立企业的形象,所以说,建设企业网站是非常有必要的。但是一个成功的网站往往也不是那么容易建成的,那么…

    2019年11月12日
    0274

联系我们

QQ:951076433

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