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

推荐订阅源

Jina AI
Jina AI
V
Vulnerabilities – Threatpost
Security Latest
Security Latest
AI
AI
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
量子位
H
Help Net Security
Attack and Defense Labs
Attack and Defense Labs
The GitHub Blog
The GitHub Blog
L
LINUX DO - 最新话题
A
Arctic Wolf
博客园_首页
S
Securelist
S
Secure Thoughts
Google DeepMind News
Google DeepMind News
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
T
Tailwind CSS Blog
Apple Machine Learning Research
Apple Machine Learning Research
酷 壳 – CoolShell
酷 壳 – CoolShell
Stack Overflow Blog
Stack Overflow Blog
N
Netflix TechBlog - Medium
Cyberwarzone
Cyberwarzone
小众软件
小众软件
T
Threatpost
Exploit-DB.com RSS Feed
Exploit-DB.com RSS Feed
Blog — PlanetScale
Blog — PlanetScale
N
News and Events Feed by Topic
NISL@THU
NISL@THU
Forbes - Security
Forbes - Security
博客园 - 聂微东
F
Fortinet All Blogs
Simon Willison's Weblog
Simon Willison's Weblog
H
Heimdal Security Blog
罗磊的独立博客
S
Security @ Cisco Blogs
B
Blog
T
Troy Hunt's Blog
Engineering at Meta
Engineering at Meta
cs.CL updates on arXiv.org
cs.CL updates on arXiv.org
The Hacker News
The Hacker News
The Last Watchdog
The Last Watchdog
Hacker News - Newest:
Hacker News - Newest: "LLM"
I
Intezer
T
Threat Research - Cisco Blogs
C
Cybersecurity and Infrastructure Security Agency CISA
The Cloudflare Blog
S
Schneier on Security
月光博客
月光博客
L
LINUX DO - 热门话题
cs.CV updates on arXiv.org
cs.CV updates on arXiv.org

人人都是产品经理

为什么你的产品找不到差异化?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迎来强劲对手 – 人人都是产品经理, 企事业单位数字化的业务供需本质 – 人人都是产品经理, 医疗智能体·第1讲——医疗信息化重构:从“辅助软件”到“自主智能体”的范式转移 – 人人都是产品经理, 粉丝量就是空气!!! – 人人都是产品经理, 用户说“薯片碎了”,机器回“要买吗?”:意图识别的翻车与破局 – 人人都是产品经理, RAG召回准确率从75到90 我做对了这三件事 – 人人都是产品经理, AI大事件:Anthropic改收费、OpenAI发安全版、手术机器人纳入医保、阿里发布”秒悟” – 人人都是产品经理, Chrome 推出 Skills 新功能,Agent 重塑上网方式 – 人人都是产品经理, GitHub前创始人拿了a16z的1700万美元,做Agent时代的Git – 人人都是产品经理 拷贝或克隆其他 Flutter OH 项目到本地后无法运行 – 人人都是产品经理, 优惠券设计:优惠券创建 – 人人都是产品经理, 不用死磕文档!AI 助手 1 小时搞定飞书 CLI 安装 + 配置 + 知识库 – 人人都是产品经理, 用小龙虾做竞品分析报告:从2天到20分钟,我是怎么做到的 – 人人都是产品经理 用小龙虾做市场分析报告:搞懂这3个公式,市场规模不再靠猜 – 人人都是产品经理, 你早就在做 Harness 工程,只是不知道它叫这个名字 – 人人都是产品经理, Think Long就够?你可能想多了! – 人人都是产品经理, 货代SRM实战:供应商准入怎么做,才能让资源池不是通讯录而是可交付网络? – 人人都是产品经理, 如何做好用户调研?详解基本技巧 – 人人都是产品经理, 木鸟、途家、美团对打,平台春天行动开“卷” – 人人都是产品经理, 入职才发现公司不靠谱?小红书从业者求职避坑指南 – 人人都是产品经理, 美国 AI 三巨头联手封堵,中国 AI 突围之路在何方 – 人人都是产品经理, 小红书,放在需求对面的镜子 – 人人都是产品经理, AI 会带来大规模失业吗? – 人人都是产品经理, 从出单到补货前,我第一次犹豫:该不该放大? – 人人都是产品经理, Flutter 三方库鸿蒙化适配:5 种高效检查方式,快速判断是否需要适配 – 人人都是产品经理, 从做产品进阶拿结果:医美机构产品经理转岗科室运营经理 – 人人都是产品经理, 阿里HappyHorse,一场关于“Token经济”的阳谋 – 人人都是产品经理, To B AI:客户留存落地的观察与思考 – 人人都是产品经理, AI产品的“生命线”——数据采集、标注、清洗的产品化设计 – 人人都是产品经理, 谈谈AI Agent(二):当“孩子”能自己“体验世界”时,你该学什么? – 人人都是产品经理, UI/UX设计师的3层能力进阶,前两层让你活下来,第三层…才是真正的分水岭 – 人人都是产品经理, 2分钟 → 30秒,效率提升75%:B端产品经理如何用「规则枷锁」驯服AI幻觉? – 人人都是产品经理, 还没来得及学OpenClaw,来了个更猛的:Hermes Agent – 人人都是产品经理, AI日报:宇树机器人跑出10m/s刷新世界纪录 – 人人都是产品经理, 一文说透基金互金如何用情绪价值引导用户决策做转化 – 人人都是产品经理, 当浏览器开始替你”看”网页:AI 浏览器正在亲手拆掉它脚下的那张网 – 人人都是产品经理, 0代码,一天时间我Vibe Coding了个网站 – 人人都是产品经理, Hermes 和 OpenClaw 之争,Agent 的能力应该“装上去”还是“长出来”? – 人人都是产品经理 视频生成的“桌子”,字节Seedance 2掀完,阿里快乐马掀 – 人人都是产品经理, 从听不懂到完全信任:我的 Codex 深度产品体验 – 人人都是产品经理, 当虚拟偶像有了北京户口,与真人偶像还有什么区别? – 人人都是产品经理, 会说,远远比会做更重要 —— 对 SBTI 爆火现象的五层观察 – 人人都是产品经理, AI产品经理必看:当“搭环境”比“选模型”更重要,你的认知还在2024年吗? – 人人都是产品经理, 2026年AI产品商业化核心逻辑:从功能demo到规模化营收的3个必破卡点 – 人人都是产品经理, 京东围绕供应链,卷起裤腿下场的那些事儿 – 人人都是产品经理, SBTI一夜刷屏:它赢在了“太会说人话” – 人人都是产品经理, 折扣零售的真相:不是便宜,而是价值感! – 人人都是产品经理, 和甲方吵了一架,最后加钱做了——我学到的ToB产品经理生存法则 – 人人都是产品经理, 和几位小红书操盘手聊了8小时,干货全在这 – 人人都是产品经理, 智谱GLM-5.1登场,开源模型首超Opus4.6!!! – 人人都是产品经理 Anthropic收入凭什么反超OpenAI,终于有人把这事说清楚了 – 人人都是产品经理, 史上最有故事感的技术报告——Claude最强模型Mythos 7个极其精彩的细节 – 人人都是产品经理, 模型不是壁垒,Harness 也不是 – 人人都是产品经理, 抖音本地生活业务思考21 – 人人都是产品经理, Superpowers:145k Star的AI编码框架,到底是什么来头? Superpowers:145k Star的AI编码框架,到底是什么来头? – 人人都是产品经理, OpenAI 的路走错了,Anthropic Harness 解法启示:模型需要实践专科生 – 人人都是产品经理, 画原型图的前一步:设计站点地图 – 人人都是产品经理, 给 DeepSeek 的最后一封催更信 – 人人都是产品经理, 手把手教你用 Claude Code 搭建 AI 营销团队:5 个 Agent、12 项技能,独立完成研究、写作、设计全流程 – 人人都是产品经理, 你以为大模型在学语言?不,它在重新发明语言学 – 人人都是产品经理 所谓Skill,不过是AI时代的工业垃圾 – 人人都是产品经理, 聊一聊内容传播的几个方法 – 人人都是产品经理, 当平台开始吃掉生态:从 OpenClaw 被封杀,读懂 Anthropic 的这盘棋 – 人人都是产品经理, 你装了 10 个 AI 插件,Obsidian 还是一个文件夹 – 人人都是产品经理 关于AI智能体架构演进的系统性思考:从单体试水到多体协同的重构 – 人人都是产品经理, 当“人”变成Skill,我们又该何去何从? – 人人都是产品经理 Mythos 事件:前沿 AI 治理的意外实验 – 人人都是产品经理, 货代CRM:信用与风险管理怎么做,才能把坏账风险拦在放货之前? – 人人都是产品经理, 从HR收集自拍照到员工自助录入——我见证了园区人脸识别从”不可用”到”真好用”的全过程 – 人人都是产品经理 千问闯关AI混沌期:阿里画靶,吴嘉张弓,马云射箭? – 人人都是产品经理,
2025 B端设计趋势之版式
钉钉用户体验 · 2025-01-24 · via 人人都是产品经理

正如包豪斯所倡导的“形式追随功能”,B端设计正朝着多元化、智能化和人性化的方向发展。本文结合钉钉近10年的设计经验,从版式设计的角度出发,探讨如何通过秩序美、对称美、韵律美等设计原则,提升B端产品的易用性和协同效率。

回溯互联网的发展进程,从桌面端的拨号上网,到5G移动互联网,再至人工智能的助力,科技领域正在经历着翻天覆地的变革。未来的数字世界,在沉浸感、参与度、个性化等维度对体验会提出更进阶的要求;与此同时,B端企业对于高效、简便、用户友好的界面需求与日俱增。在2025年的当下,B端设计师唯有持续学习,适应新技术与新趋势,紧密围绕客户的业务价值展开设计,进一步注重实用性、包容性以及可定制化,方可为企业客户塑造出卓越的产品与服务。

因此,我们结合钉钉近10年的B端产品设计经验,鉴于未来B端设计趋势将展现出多元化、智能化和人性化的特质,从B端产品个性化、风格与质感、界面版式、图标、动态交互等多维度设计展开深度研究,与大家一道探讨B端设计的本质和趋势,期望在真正驾驭B端产品设计的这条道路上,带来些许有益的启迪。

上篇文章我们讲述了B端产品的风格&质感趋势,如何为企业塑造品牌形象、为个人用户提供情感价值。

今天要给大家分享的是B端产品版式设计趋势,助力企业产品提升易用性,进而帮助企业员工更高效协同与工作,增强企业的整体业务效率和竞争力。

一、从艺术的历史长河中捕捉版式之美

古今中外,我们不难察觉,但凡经典且极具美感的设计,往往都离不开:重复秩序、节奏韵律、对称均衡、虚实留白、主次对比等设计审美。譬如:在《寒江独钓图》中,凭借其绝妙的空间留白,我们能体悟到此处无物胜有物的妙境;又如达达主义时期,艺术家们依靠对排版的探索以及看似自由的布局,我们能洞察到视觉变化所产生的冲击力;再如:包豪斯时期,设计师阿明·霍夫曼通过采用网格、非对称、最低限度的排版对比,我们能感受到个体于统一中亦能增添差异和想象。

以史为鉴,于有限的版面空间之内,将文字、图像、色彩等视觉元素进行有组织、有目的地编排整合,以实现信息的有效传达和视觉上的识别,版式设计所带来的美感,需要我们逐一捕捉:

1. 秩序美

“万事离不开方法,世界离不开秩序。”这句名言来自18世纪英国著名文学家斯威夫特,虽说原意并非针对设计,却在版式设计中同样适用。

网格分割

版式的秩序美源于空间划分的合理性以及元素位置关系的秩序感,网格恰是这样一种利器,在赋予秩序美感的同时,能够切实增强版面信息的易读性,让设计条理分明,结构合理,还能提升设计效率和统一标准。在传统媒介诸如书籍、画册、杂志、包装设计当中,栏式网格得到了广泛的运用,譬如书籍设计里经典且常见的 1:1.4 白银分割法便源于此。

重复规律

自然界中经常会出现重复的事物,往往给人的感觉是非常具有秩序性和规律性的,他们重复的形式不限于形状、尺寸、色彩、质感、方向、空间等。在商业设计中,譬如品牌标志、海报、插画等大量使用了重复的手法,其能使设计产生安定、整齐以及隐性的视觉联想,很好的为品牌塑造出让人印象深刻的视觉符号,以及科技先进的品牌调性。

2. 对称美

对称美学的运用随处可见,大至三维空间,小至二维平面。譬如生活里,人体的自然构造呈现出对称之态;绘画艺术里,达芬奇的《梦娜丽莎》运用轴对称构图法,使得人物形象更具端庄和柔美;建筑领域里,对称的造型结构能够营造出稳定之感与庄严之态;而在摄影师的相机里,对称的表现形式亦是一种极具艺术性的视觉传达。

比例均衡

从理论层面来讲,我们不难找到对称的方法有很多:水平、垂直、中心、放射等对称形式。于设计师而言,最为核心的还是要依据设计内容和目标受众来选取恰当的对称形式:譬如商务传播适宜采用垂直对称,以彰显专业严谨;营销广告则可以尝试放射对称,从而增添吸引力和趣味性。此外,适度调整字体、颜色、线条粗细等比例能够快速提升设计的精致程度,譬如局部文字错位、色彩对比等,反倒能够为对称美学进一步增添灵动之感。

结构简洁

对称结构通常具备简洁性与明确性,因其基于一种镜像模式,致使设计或物体的结构易于被理解。譬如大众汽车的标志通过上下对称的“V”和“W”组合,简洁明晰地传递了品牌形象;又如迪奥的香水瓶身,左右对称的设计,搭配简洁的文案包装,彰显出品牌的优雅与精致;再如苹果应用商店的图标,凭借中心对称的特性,看上去整体又舒适,这种风格也契合苹果产品一贯追求简约、易用的理念。

3. 韵律美

除了秩序美和对称美,版式中还隐藏着一份独特的韵律美:通过各元素组合排列衍生出如同音乐节奏般的停顿与变化,使画面张弛有度,增添美感与意境。

疏密留白

“Less is more”。在版式设计中,巧妙地留白,旨在更好地衬托主题,留下想象的余地。故而,在排版时,并非做得越满越丰富就越好。在电商发展前期,部分公司要求推广海报上堆满文字图片信息,但实际上忽略了最为重要的一点:没有给予用户安全感,让用户产生产品品质低劣的感受;反之,留白较多的版面,除了带来更品质、富有格调的感觉,同时能够起到强调主题、快速理解的作用,也更有利于传播。

主次对比

作为设计师总是被甲方要求“放大,再放大,全部都放大”,其言下之意是希望建立出好的主次层级关系,把用户视线吸引到主要信息上。良好的对比关系通常离不开大小、虚实、色彩等对比,从而形成视觉冲击。譬如:

苹果官网的产品展示,通常会以大幅高清、精致的产品图片作为主体,占据中心位置,全方位展示其外观和特点,吸引用户的注意力。而产品名称、主要卖点和特色功能等信息则以较大、醒目的字体放置在图片下方或旁边,方便用户快速了解产品的核心信息。至于产品参数、规格、购买链接等则以较小字号,简洁地分布在页面的下方或侧边栏,当用户对产品感兴趣并想要进一步了解时,可以自行查看,从而形成主次分明的信息层级,提升用户体验。

进入互联网时代,手机和电脑早已成为人们日常不离手的移动设备,与此同时,国内外B端产品设计发展也越来越成熟,随之涌现了一批专业而完善的设计系统,譬如来自:IBM(IBM Design Language)、谷歌(Material Design)、微软(Fluent Design)、蚂蚁(ant design)等,像秩序、对称、韵律等版式审美也被沿用在其中。

从实战案例中汲取版式设计趋势

如Oliver  Reichenstein所说:“排版的目的是优化可读性、访问率以及可用性,保持和图形的平衡关系。”  好的排版使用户易于阅读,而混乱的排版则使用户失去继续浏览的意愿。我们结合钉钉近10年的B端产品设计经验,通过大量研究优秀的实战案例,汲取出2025 B端版式设计趋势核心为以下:

1. Bento设计

Bento原意是指日式的便当盒,食物通过格子组合排列看上去既精致又有食欲,格外体现秩序的美感。早在2008年Android手机系统上就已开始应用:信息类、控件类、混合类组件层出不穷;在2010年Windows Phone 7也引用了Metro设计语言,这些都可以视为如今Bento设计的灵感来源,直到被苹果设计应用后,便开始广为人知的爆发。

Bento设计基于网格系统的布局,让用户更专注每个「Box」里的信息。在B端产品中,大量的后台管理型场景正朝着这种设计布局迈进,譬如:钉钉的宜搭管理后台,通过强调信息的层次分明,结合模块化、清晰化的特点,为后台系统带来了前所未有的整洁与秩序,同时还易于管理,让复杂的后台操作也变得井井有条起来。

此外,在钉钉其他场域场景中使用Bento设计的案列也比比皆是,譬如:钉钉「首页加号」、「更多」、「AI助理」、「钉钉官网」等。

2. 圆角卡片化设计

随着设计风格不断演变,传统的方角卡片逐渐被取代,代之以更加柔和的圆角,其带来一种友好、现代、温暖的感觉。譬如钉钉的「协作」、「工作台」、「通讯录」、「我的」等核心页面都逐渐卡片化,使界面中的信息呈现出更加集中、清晰、有序的美感。

3. 极简设计

多年来,极简主义一直是主导的设计趋势,极其强调留白的韵律之美。不同的是:近年开始,在简约的基础上,设计师尝试融入大胆色彩、大型字体以及吸引注意力的惊喜元素等,以形成兼具干净与张力的风格。此外,极简设计还更加注重与交互深度结合,屏幕中的每一个元素都必须具有明确的功能或目的,用以引导用户的视线和焦点,使形式服从于功能,让信息的传递更高效。

钉钉作为7亿+用户的企业级智能移动办公平台,提供了即时通讯、多组织协同、数字化管理、智能助理等多场景能力。

从个体用户视角来看,时常会感受到界面复杂、信息密度高、理解成本高等问题。如何在保持产品能力丰富且易用的同时,打造简约高效的界面,是设计师核心考虑的重点。譬如:在会议场景中,用户可直接输入投屏码,即可一键共享电脑&手机上的内容,再无接线烦恼,轻松简单。

4. 响应式设计

为了让用户在不同设备(如电脑/平板/手机等)上都能有一致且优质的体验,响应式布局由然诞生。其能兼容各种屏幕尺寸和分辨率的设备,页面元素都能合理展示:文字清晰可辨、图片完整显示、操作也便捷流畅,不会出现布局错乱或内容显示不全的问题,同时减少开发和维护多版本工作量与资源投入问题。譬如:钉钉的工作台,为了适配各端且保障好用户一致性体验,在页面设计和研发时,就充分考虑了这点。

5. 动态设计

随着数字技术发展,通过元素的运动和变化,动态排版能迅速抓住受众的目光,有效提升内容关注度。在B端品牌推广或产品发布时,动态海报能将静态视觉效果与微妙的循环动画融合在一起,帮助企业品牌在饱和的数字环境中脱颖而出。在钉钉同样也适用,譬如:「钉钉登录页」,用户首次登录时,在有限时间内,我们可以通过动态引导更直接有序的把钉钉产品价值透传给用户;再如:「钉钉含钉量」发布介绍,通过动态的阅读顺序和节奏变化,让用户更好的理解和吸收内容。

6. 无障碍设计

面向企业或组织用户的产品服务时,设计师需要充分考虑到所有用户的能力和需求,包括有身体、感官或认知障碍的用户,确保能够平等、方便、高效地使用。譬如:

  • 按钮和输入框要保持足够交互间距,避免拥挤,便于点击和输入;
  • 文字确保与背景色彩对比度高,如黑底白字或白底黑字,方便视障用户阅读;
  • 用色避免使用单一颜色区分信息:对于色盲或色弱用户,应结合形状、图标或文字辅助区分。

与此同时,像钉钉这种面向全球化的B端产品,我们还需要提供多语言支持,方便不同语言背景的用户使用。

结语

引用《简约至上》中所言:创造简单用户体验的秘诀在于把复杂性转移至恰当的地方。

设计的目的并非消除所有复杂性,而是将其置于最为合适的位置。

B端产品设计是一个复杂且极具挑战的领域,深入洞悉B端用户与业务场景,简化信息架构,塑造清晰、直观的的界面版式能够有力助推企业产品易用性大幅提升,进而帮助企业员工更高效地完成协同与办公,增强企业的整体业务效率和竞争力。

在未来的B端产品设计里,我们应始终把用户体验置于首位,持续探索并创新界面版式设计的方法与策略,为B端用户缔造更加友好、便捷的体验。

本文由人人都是产品经理作者【钉钉用户体验】,微信公众号:【钉钉用户体验】,原创/授权 发布于人人都是产品经理,未经许可,禁止转载。

题图来自Unsplash,基于 CC0 协议。