惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

量子位
WordPress大学
WordPress大学
小众软件
小众软件
云风的 BLOG
云风的 BLOG
IT之家
IT之家
人人都是产品经理
人人都是产品经理
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
Last Week in AI
Last Week in AI
博客园 - 【当耐特】
T
Tailwind CSS Blog
阮一峰的网络日志
阮一峰的网络日志
V
V2EX
宝玉的分享
宝玉的分享
博客园 - Franky
F
Fortinet All Blogs
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
GbyAI
GbyAI
Hugging Face - Blog
Hugging Face - Blog
Jina AI
Jina AI
D
Docker
博客园 - 聂微东
C
Check Point Blog
H
Help Net Security

人人都是产品经理

为什么你的产品找不到差异化?90%的失败都卡在第一步上(下) – 人人都是产品经理, 3年从30万到1300万用户、获2200万美元融资,这个AI教育产品用“抽卡”破解了获客难题 – 人人都是产品经理, 园区招商系统怎么做才能真正帮到去化?我加了这一个功能,推广链接转发400次阅读过万 – 人人都是产品经理, AI大事件:OpenAI发完网络安全模型又搞药物研发,小鹏汽车要抓”DeepSeek时刻” – 人人都是产品经理, 电商不是卖货,是一场更残酷的产品经理实战 – 人人都是产品经理, 没想到,活动营销又回来了! – 人人都是产品经理, 为何All-in海外KOC:一场关于AI时代窗口期的豪赌 – 人人都是产品经理, 重新理解企业的内部协作 – 人人都是产品经理, 苹果的 AI 战略到底是什么? – 人人都是产品经理, 医疗智能体·第2讲——合规护城河:等保、PIPL与HIPAA的架构实战 – 人人都是产品经理, 向量知识库五步法:从“答非所问”到“精准回复” – 人人都是产品经理, 鸿蒙PC三方库构建总指挥HPKBUILD(sha)库为例 – 人人都是产品经理, 何时该用LLM?AI产品经理的LLM设计指南 – 人人都是产品经理, 医疗信息领域的需求方、决策方、准入方以及关注点(二) – 人人都是产品经理, 即梦涨价:一场被误读的「傲慢」 – 人人都是产品经理, 面试AI PM必答题:Hermes和OpenClaw的区别,如何讲清楚业务价值 – 人人都是产品经理, AI的下一张船票:世界模型——AI产品经理必须理解的技术拐点 – 人人都是产品经理, 小红书做GEO,怎么让AI信你?记住这 3 个重要信息 – 人人都是产品经理, 5 家印度 AI 初创公司,看看印度 AI 再做什么 – 人人都是产品经理, AI项目跨团队协作:产品技术业务如何不打架 – 人人都是产品经理, Agentic Workflow(智能体工作流):让AI从”答案生成器”变成”数字员工” – 人人都是产品经理, lycium_plusplus 项目全景解读:OpenHarmony 三方库构建的“大管家” – 人人都是产品经理, 从爆单救火到前置履约:两套预采策略,把生鲜大促履约效率拉满 – 人人都是产品经理, 什么时候该补货?我用一轮数据做了一个决定 – 人人都是产品经理, 从“机械兜底”到“动态分流”:AI客服重复进线治理的4大底层逻辑 – 人人都是产品经理, 抖音拼效率,红书拼洞察 – 人人都是产品经理, 全民狂欢与退潮——为什么龙虾这波热潮冷却得如此之快? – 人人都是产品经理, Stripe押注!MPP重塑全球支付 – 人人都是产品经理, 小红书GEO:AI引用你的内容,不是因为你对,而是因为你看起来可信 – 人人都是产品经理, 前百度副总裁押注办公Agent,日韩付费爆发,Manus迎来强劲对手 – 人人都是产品经理,
经验分享丨一文搞定交互设计7大法则(4)——接近原则
江鸟 · 2022-11-30 · via 人人都是产品经理

接近原则最早来源于心理学研究中得出的格式塔理论,后来被理论家应用于视觉感知领域,成为设计师们非常有价值的工具。本篇文章讲解了接近原则在实操中有哪些应用技巧,让我们一起来看看吧。

今天分享一个被我们广泛应用但还没有注意的原则——接近原则。它是一个从用户认知习惯和心里模型总结出来的设计原则,掌握该原则可以有效的帮我们完成当前的设计。

那么它在实操中有哪些技巧呢?一起来看看吧~

一、接近原则的定义

该原则最早来源于心理学研究中得出的格式塔理论,后来被理论家应用于视觉感知领域,成为设计师们非常有价值的工具。

它解释了人脑如何解读周围复杂元素,提出了眼脑的作用是一个不断组织、简化、统一的过程。它产生出易于理解、协调的整体,降低我们浏览和理解内容的成本。我们的视觉系统自动对视觉输入构建结构,并且在脑中对设计元素进行归类,而不是只看到互不相连的边、线和空间。

通过该理论,发现用户会把界面中视觉相似的元素自动归类分组,视为整体,不管当前页面有多么复杂,元素之间距离较近的比距离较远的更具关联性。在设计中我们设计师需要参考接近原则,了解它们之间的相对距离相较于它们的形状、色差等其他特征更容易影响用户的感知。

在实际设计中我们可以通过控制元素之间的距离来区分他们的关联性,距离近的关联性强,距离远的则关联性较弱,可用于界面不同模块布局以及分类的场景。

二、接近原则的特点

接近原则是格式塔原则中非常重要的设计理论,它应用于信息秩序的设计与整理,易于理解的信息布局正是我们设计师追求的目标。

1. 获取效率的便捷化

在产品规划的过程中有时经常为了省事,尽可能多的在页面中放入更多的文本以及图片。我们要清楚用户的注意力是有限的,过多的内容填充反而会使得用户在细节中迷失。

接近原则在界面中可以有效的对信息进行归类分组,避免了信息展示的杂乱无章,让内容呈现更有目标感,使其潜意识里就知道哪里可以找到自己需要的信息,让信息提取的效率便捷。

2. 信息层级的清晰化

接近原则不单单让信息充满目标感,还让其充满了秩序感。我们可以通过不同元素的组合向用户传递信息,这些元素是有关联的。这些看不见的边、线和空间是我们利用的工具,通过它们可以实现信息之间的关联。

三、接近原则的应用

接近原则其实很好理解,我们可以在设计的不同场景中应用它,以下是该原则在设计中的应用场景。

1. 更高的阅读效率

我们之所以选择该产品更多的是其内容的吸引,因此它的可读性与易读性是产品设计的基本属性。可读性与易读性的影响因素有很多,包括了字体样式、字体大小、字重、字间距等,但是页面中内容的版式也会直接影响信息的阅读效率。

当信息没有任何版式,只是纯粹的在页面内平铺,它的易读性与可读性会收到影响。我们可以通过分隔线、间距来调整它们之间的关联度。通过这种有条理的间距,凸显了在空间内不同的段落关系,帮助用户扫描和阅读文本。

经验分享丨一文搞定交互设计7大法则(4)——接近原则

上图为接近原则的示例,段落之间的距离大于行与行之间的距离,让相关的内容在视觉上形成紧密的段落,确保用户可以在视觉上对其进行扫描和阅读。

2. 更便捷的表单填写

表单是一个常见的信息录入工具,糟糕的表单设计会带来令人抓狂的用户体验。作为产品体验的重要组成部分,无论是Web端还是移动端,信息的轻松录入都是表单设计的重要目标。接近原则在表单填写中主要应用于标签位置、表单分组以及数字展示这3块。

(1)标签位置

标签位置对于用户快速理解输入项含义特别重要。在英文场景下,由于其词组较长,可将标签放于输入框顶部并保持左对齐,以便让用户轻松的扫描表单,这对于有着长标签的输入框尤为重要,特别是当标签与输入框之间的距离较远且关系不明确时,用户需要花较多的时间来弄清楚不同的标签与输入框之间的对应联系。

经验分享丨一文搞定交互设计7大法则(4)——接近原则

(2)表单分组

常规的表单一般包含多个录入字段,我们需要采用接近原则改变用户对表单的看法。合理的控制表单内容的相关距离,对它们进行分组,可以有效的帮助用户对所填写内容的理解。同组内信息的距离与不同组距离之间对比的节奏感,给用户带来了体验上的舒适性。

例如下图中左右两侧的输入量基本一致,但是由于右侧对需要输入的信息按照关联度做了的分组,给用户的感觉完全不一样的感觉。(输入框量越多,分组后产生的差距效果越明显)从视觉的角度可以让信息更有层次,避免了表单浏览的疲惫。

经验分享丨一文搞定交互设计7大法则(4)——接近原则

(3)数字展示

我们可以在较长数据展示的时候采用接近原则,通过对复杂信息的组块来提升操作效率,这一点跟米勒定律很像。例如常见的银行卡号以及金融数字的展示,我们可以采用4个或者3个数字一组的形式,控制不同数字之间的距离,在空间上进行分组,保证数字清晰的可读性。

经验分享丨一文搞定交互设计7大法则(4)——接近原则

3. 负空间的营造

我们在处理页面内容时,靠得近意味着关联性强,但当我们对接近原则反向应用,例如通过元素形态、色差等增加与周围元素负空间的比对可以起到吸引用户的注意的作用。

当页面内重要元素周围负空间较多时,它对用户的吸引则越大,意味着用户很容易就会发现它的存在,毕竟该空间内没有其他信息吸引他们的注意。例如下图我们一眼就可以看到搜索框,而浏览器用户、图片、邮件相关信息由于距离其较远,因此视觉权重较弱反而凸显了搜索框。

经验分享丨一文搞定交互设计7大法则(4)——接近原则

四、写在最后

将关联的元素相互靠近,在界面中创建分组是我们经常应用的设计原则,可能在设计中我们已经无意识的使用了好久,但是如果我们可以更进一步了解它则会让它更加强大。

我们可以利用接近原则来指导如何在页面中组织信息元素,创建有意义的分组,以便用户可以清晰的获取信息,提升产品的用户体验。

以上就是我对接近原则的理解,不知道你对它有什么不一样的看法,欢迎一起讨论~

本文由@江鸟的设计生活 原创发布于人人都是产品经理,未经许可,禁止转载

题图来自 Unsplash,基于 CC0 协议

该文观点仅代表作者本人,人人都是产品经理平台仅提供信息存储空间服务。