兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

兰亭妙微UI设计公司:在用户需求日益多元化的旅游市场中,会员权益的价值不仅在于提供优惠,更在于创造差异化的体验与长期归属感。本次会员权益感知升级,我们通过权益展示规则优化和场景化等方式,加强用户对会员权益的感知,让用户从预订到旅程的每个环节都能清晰感知会员权益的价值。
当前,集团持续加大在会员权益方面的投入,旨在通过更具价值的权益体系提升用户体验。优质的会员服务不仅能增强用户粘性和忠诚度,更能有效提高权益使用率和订单转化率。此次会员体验升级,正是希望通过优化权益设计和服务体验,实现用户价值与平台效益的双赢,最终形成"投入-体验提升-效益增长"的良性循环。
通过走查线上各业务线(如机票、酒店等)的页面,我们发现了以下 2 个问题:
1. 不同业务线间:权益的展示节点和感知强度不同,缺少一致的设计原则
目前各业务线在会员权益方面的设计手段不同,在权益展示点位和感知强度上存在明显差异,缺少一致的设计原则进行规范。具体表现为:
酒店:主要通过货架展示强化会员权益感知
机票:侧重在列表页和中间页等固定位置展示
火车票:则聚焦于权益使用环节的触达
2. 单个业务线内:优势权益在流程中没有充分传达
通过对各业务线现有页面的走查,我们发现会员权益在订前、订后部分关键节点存在展示缺失的问题。虽然用户在流程中能看到权益信息,但整体感知度仍有不足。
针对上述问题,我们需要建立统一的设计原则,在保持各业务线自身特色的同时,形成协同一致的会员体验,提升用户对会员权益的整体感知效果。
本次优化主要围绕两个核心目标展开:一是建立规范的权益展示原则,二是提升用户对权益的感知度。具体将从以下几个方向着手:
1. 权益前置,强化展示
根据历史机票和酒店的项目数据,我们发现将具有明显优势的权益提前展示,能够显著增强用户的感知,并有效提升预订转化率。例如携程酒店将会员账户中的的权益与预订流程结合,将原本无早餐的劣势转化为会员可免费兑早餐的优势展示。这样的方式为我们提供了本次优化的思路——通过权益前置来强化权益,加强感知。
什么样的权益需要前置?——设定强弱权益规则
为提升会员权益展示效果,我们通过对权益内容的系统分析,将其划分为两大类别:强权益和弱权益。
强权益:指与产品线直接相关或对价格产生显著影响的权益,例如酒店业务的免费早餐服务和会员专享价格。这类权益在用户购买决策中起关键作用,能有效提升用户满意度和预订转化率,因此需要在核心预订节点进行重点展示。
弱权益:指与产品线关联度较低的权益,例如机票业务的快速安检服务。虽然这类权益不会直接影响用户的预订决策,但可作为增值服务提升用户体验,间接促进转化。
为确保权益展示的客观准确,我们也可以借助内部的权益价值计算公式,量化每项权益的实际价值,帮助我们精准评估和展示权益,为用户提供更有价值的会员体验,最终提升用户满意度和忠诚度。
2. 让权益贯穿各节点的策略
在对各业务线的线上页面进行走查时,我们注意到订前、订后部分节点常常出现权益感知缺失的情况。
为了充分提升权益的曝光,我们制定了强弱权益展示的规则,定义了在各节点展示的必要性。在预订前节点,我们优先展示与用户决策紧密相关的强权益,并在相关性较低的节点提前展示弱权益,以加深用户印象并促进转化。预定后,对收益、转化率和 CPO(客服来电率)的影响较小,需要做到尽可能强的展示。
根据以上规则,我们在实际点位进行了应用:
以火车票业务为例,我们通过优化权益展示策略,在首页新增曝光点位、强化现有页面展示效果,并完善订后权益展示,使会员权益的触达贯穿用户全流程。优化后,权益曝光率和用户感知强度有了明显的提升。
3. 更加严格的设计规范
此前制定的会员权益视觉规范,因各业务线复杂度不同,在多次迭代后逐渐出现差异,导致不同业务线之间展示不一致、单个业务线内流程不统一的问题。为此,本次优化中我们也重点明确了各类场景的标签使用规范和文案规范,全面提升展示一致性,同时加强会员身份的表达。
经过以上几点优化,上线后数据显示用户对会员权益的满意度、会员权益的使用率都有显著提升,验证了设计方案的有效性。
除了常规流程中的会员感知,我们也在思考如何进一步加深用户的印象,让用户订票时优先选择携程。
1. 出行中节点——提供好用的体验
订后的节点往往容易被忽视,以机票的快速安检权益为例,用户通常需要打开携程 App → 查找订单详情 → 定位权益入口 → 完成核销,步骤较长,导致体验打折。
新版本中,我们将出行相关的会员权益(如快速安检)直接前置至携程 App 大首页的行程卡片。用户打开 App 即可快速查看和使用权益,无需多层跳转。改版后,用户体验和权益使

用率都得到了提升。
2. 会员升级节点——制造惊喜感
基于 KANO 模型,我们可以将用户需求分为三类:基本型、期望型、兴奋型,在前面的改版中我们已经满足了用户的前两类需求。我们希望制造惊喜感和仪式感来满足用户的兴奋型需求。携程会员体系以“山峰”为视觉符号,不同高度代表不同等级,用户每次升级,都象征着翻越一座新的高峰。象征用户翻越山峰的升级节点正是满足用户“兴奋型需求”的关键时刻。
因此,在用户升级时,我们在携程首页增加升级弹窗强化惊喜感和仪式感。用户打开 App 即可直观感受到等级提升的成就,并快速了解新增权益。上线后带来了人均使用权益订单量、会员中心访问率等数据的提升。
通过系统化的设计与持续迭代,会员权益体系能够深度释放用户价值,推动品牌的长期可持续增长。在这个过程中,我们需要确保用户在全渠道触点中获得连贯一致的体验,从而建立稳固的品牌信任,降低用户的学习与决策成本。同时,我们需要强化会员的价值感知,通过具象化的权益呈现和情感化的设计表达,让用户切实感受到专属特权与归属感,最终打造出更具黏性的用户体验闭环。
转载:优设
兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

Neemo Project 企业AI项目管理后台全案运营价值解析
北京兰亭妙微 UI 设计公司,成立 16 年来,始终保持着对国内外优秀设计作品的学习与研究。我们持续追踪全球前沿的 UI/UX 设计趋势,从中提炼可落地的设计方法论,分享给同样热爱设计的你。今天,我们来深度拆解一套企业AI项目管理后台的ui设计,从信息架构、配色策略、移动端适配到数据叙事的视觉表达,逐一解析其背后的设计决策。
一、项目基础概述
1.1 项目背景与核心用户痛点
Neemo Project 是搭载 AI 辅助能力的企业级项目管控后台,核心服务两类人群:企业项目管理者、跨部门协作执行团队成员。
传统项目管理工具普遍存在运营与使用痛点:
管理者视角:项目工时、任务完成率、周期进度数据分散,需要手动汇总多表格统计,无法实时全局把控项目风险与交付节点;多团队协作成员、会议、截止任务分散在不同页面,统筹效率低下;
执行团队视角:任务缺少清晰时间规划,到期提醒滞后,流程重复工作占用大量人力,缺少自动化辅助工具简化重复性工作;
界面体验痛点:多数传统管理后台布局拥挤、深色界面色彩杂乱,数据图表层级混乱,长时间办公浏览极易视觉疲劳,缺少标准化状态区分体系,任务进度难以快速识别。
本产品以「AI 自动化赋能 + 全维度数据可视化 + 轻量化任务协同」为核心设计思路,从管理层全局管控、执行层高效落地两个维度,解决企业项目协同低效、数据统计繁琐、节点管控缺失的行业痛点。
1.2 项目核心设计目标(以企业真实运营需求为核心)
全局数据直观可视化:整合工时、任务完成量、周期活跃度、团队协作信息,首页一站式呈现,管理者无需多页面跳转即可掌握项目全貌;
AI 自动化降本增效:内置 AI 辅助模块,自动简化常规流程、分析项目绩效、动态管控任务截止时间,减少人工重复操作;
标准化任务协同体系:统一任务状态标识、日历排期、会议管理、截止预警模块,跨团队成员快速看懂任务优先级与进度;
统一高端深色专业视觉体系:搭建完整组件库,深色基底搭配高区分度功能色,兼顾长时间办公护眼需求与 B 端产品专业科技感,全页面操作逻辑、视觉语言高度统一。
1.3 完整企业项目管理闭环
产品覆盖完整项目全生命周期管理:项目总览数据大盘 → AI 绩效分析辅助 → 月度日历任务排期管理 → 截止节点风险监控 → 团队协作人员管理 → 会议日程统筹 → 任务状态动态更新与自动提醒。
二、全链路企业使用体验拆解
2.1 项目总览首页:一站式全局管控大盘
页面左侧固定侧边导航栏,收纳全部一级功能入口,便于管理者随时切换模块;页面顶部为项目基础信息栏,展示总投入工时、进行中 / 已完成任务总量、协作人员头像组,配套独立 AI 助手快捷入口,一键调用智能分析功能。
页面核心区域分层排布多维度可视化图表:长条柱状图展示项目全周期每日任务活跃度,环形进度环直观呈现整体任务完成率;右侧分区独立卡片承载截止任务清单、团队会议日程两大核心模块,卡片内自带进度条清晰展示各子任务交付进度,主次信息层级分明,管理者打开页面即可快速定位风险滞后任务。
2.2 日历任务排期模块:清晰规划每日执行工作
首页下方嵌入月度日历视图,按日期纵向排布当日全部待执行任务;不同状态任务采用标准化色块区分:绿色代表已核验完成、橙色代表进行中、紫色代表待启动规划、红色代表风险逾期任务。
单条任务卡片精简展示任务名称、归属模块,鼠标悬浮可展开详情弹窗,支持快速筛选任务状态、自定义视图排序,团队成员可快速认领、查看自身负责工作,管理者可直观查看每日团队负载,合理分配工作量。
2.3 AI 绩效分析与截止管控模块:自动化降低管理成本
独立 AI 绩效分析模块自动测算流程简化效率,量化 AI 为团队节省的工作量;截止管控功能实现全自动化管理:系统自动识别变更交付节点,推送到期提醒,任务逾期时自动重新分配对接人员,无需管理者手动跟进督促。
整套状态标签组件统一规范,Active、In Progress、Validation 三类核心进度标识色彩固定,全页面通用,团队成员无需额外学习即可快速分辨任务阶段。
2.4 团队协作与会议管理模块:打通跨部门信息同步
页面右上角聚合全部项目协作人员头像,点击可快速查看成员分工、在线沟通;独立会议卡片统一记录会议主题、时间段、会议规划内容,区分「已规划 / 进行中 / 已结束」状态,自动留存会议记录,避免跨部门信息断层,减少线下同步沟通成本。
三、视觉与标准化组件系统:高端深色 B 端专业体验
3.1 色彩视觉体系(适配企业长时间办公场景)
基底主色:低饱和深紫深色背景,弱化屏幕强光刺激,长时间办公不易视觉疲劳,塑造科技感专业企业氛围;
数据高亮色:明黄色用于整体进度环形图、绩效重点数据,紫色作为 AI 功能、待启动任务主色,绿色代表完成 / 核验状态,橙色代表进行中任务,四色形成强区分度,快速识别数据与任务状态;
文字层级:纯白色大号数字展示核心指标,浅灰色小字承载辅助说明,高对比度保障深色界面文字清晰可读;
操作功能色:白色作为按钮、弹窗基础底色,与深色背景形成柔和对比,不刺眼。
3.2 全场景可复用标准化组件库
整套后台搭建完整统一组件体系,覆盖:侧边导航、数据柱状图、环形进度指标、任务日历卡片、截止任务卡片、会议日程卡片、任务状态标签、弹窗浮窗、AI 功能按钮、人员头像组件等全部页面基础元素。
统一组件带来双重企业使用价值:
管理 & 执行端:全页面视觉、交互逻辑统一,新入职团队成员快速上手系统,降低工具学习成本;
产品迭代端:新增项目模块、AI 功能、管理报表可直接复用现有组件,大幅缩减设计、开发人力成本,系统拓展性更强。
3.3 品牌视觉体系配套
项目配套专属点状抽象品牌 Logo,以圆点阵列构成字母 M 图形,简约几何风格和后台科技极简视觉完全统一,线上后台、宣传物料视觉语言贯通,强化企业项目管理工具专属品牌记忆点。
四、交互与企业管理体验核心亮点
全局信息前置设计:首页聚合工时、进度、任务、会议、协作人员全部核心数据,减少多层级页面跳转,提升管理者统筹效率;
AI 自动化全流程赋能:自动绩效分析、到期提醒、任务重分配,替代大量人工统计、跟进工作,压缩管理人力成本;
标准化色彩状态体系:任务、数据、功能通过固定色彩区分,无需阅读文字即可快速抓取核心信息;
轻量化悬浮弹窗交互:任务详情、人员信息、操作菜单均采用浮窗展示,无需新开页面打断当前工作流;
多模块分区独立卡片设计:截止任务、会议、周期数据分区隔离,信息互不干扰,逻辑清晰不杂乱。
五、项目商业落地价值
提升企业项目交付效率:全局可视化管控 + AI 自动化工具,提前识别项目滞后风险,降低延期交付概率,提升项目交付质量;
缩减企业管理人力成本:自动统计、智能提醒、任务重分配功能,减少项目专员、行政跟进、数据统计的人工工作量;
差异化市场竞争力:市面多数项目管理工具缺少内置 AI 辅助模块,深色高端可视化界面精准面向中大型企业、科技团队,形成独特产品优势;
可持续业务拓展:模块化组件架构可后续拓展多项目台账、财务工时统计、客户对接模块,满足企业长期数字化管理升级需求。
六、全案设计总结
双人群需求平衡设计:同时兼顾企业管理者全局数据统筹、一线执行团队轻量化任务操作两类核心诉求;
B 端深色数据界面分层设计,核心指标放大前置,辅助信息收纳至次级区域,解决海量数据阅读困难问题;
AI 功能深度融入产品全流程,用自动化设计解决企业重复性管理工作痛点;
全组件化界面搭建,统一视觉与交互标准,兼顾团队使用流畅度与产品长期迭代拓展能力。
图片来自Behance
兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

线上医疗问诊预约 App 全案用户体验价值解析
北京兰亭妙微 UI 设计公司,成立 16 年来,始终保持着对国内外优秀设计作品的学习与研究。我们持续追踪全球前沿的 UI/UX 设计趋势,从中提炼可落地的设计方法论,分享给同样热爱设计的你。今天,我们来深度拆解一套线上医疗问诊预约 App 的ui设计,从信息架构、配色策略、移动端适配到数据叙事的视觉表达,逐一解析其背后的设计决策。
一、项目基础概述
1.1 项目背景与核心用户痛点
本项目是一站式线上医生预约诊疗 App,核心覆盖两类使用人群:有问诊、复诊需求的普通就医用户、多科室私立诊所 / 综合医疗机构运营方。
传统线下就医与老旧医疗预约产品存在多重体验短板:
用户端:挂号流程繁琐,科室查找复杂,医生资质、出诊时间、收费标准信息分散,预约操作步骤冗长;无法直观查看患者真实评价,难以快速匹配适配自身需求的医师;
机构运营端:多科室数据分散,预约、改期、取消流程依赖人工客服,人力成本高,缺少统一的患者管理与线上获客渠道;
界面体验:多数医疗软件色调沉闷、信息堆砌,页面层级混乱,中老年用户操作门槛高,缺乏安全感与专业舒适感。
本产品以「简化全流程预约、透明化医疗信息、轻量化多科室管理」为核心设计思路,从患者就医体验、机构运营效率两大维度解决行业现存痛点。
1.2 项目核心设计目标(以用户真实需求为核心)
降低用户就医操作门槛:科室分类直观,预约链路极简,全年龄段用户均可独立完成挂号;
医疗信息透明化:集中展示医师从业年限、接诊人数、收费、出诊时段、真实患者评价,帮助用户快速决策;
优化机构运营效率:线上自助改期、取消预约,减少客服接待压力,打通多科室统一管理后台;
统一专业温和的视觉体系:医疗向低饱和蓝为主色调,搭建标准化组件库,全页面视觉、操作逻辑连贯,塑造安心可靠的医疗品牌感知。
1.3 完整用户使用闭环
产品覆盖完整就医线上流程:科室快速筛选 / 搜索 → 医师列表浏览对比 → 医师详情资质查看与评价查阅 → 选择就诊日期时段 → 一键完成预约 → 预约单管理、线上改期取消、就诊后评价反馈。
二、全链路用户使用体验拆解
2.1 首页科室筛选页:快速定位就诊需求
页面顶部设置全局搜索框,支持医生、病症、科室关键词检索;下方以统一图标色块分区展示全科室入口,心内科、牙科、妇科、心理科等八大常见科室一目了然,无需多层菜单查找。
下方医师推荐卡片集中展示核心信息:医师姓名、所属医院科室、综合评分、每日出诊时段,底部放置醒目黑色预约按钮,用户无需进入详情页即可快速发起挂号,大幅缩短操作路径。同时支持收藏心仪医师,方便后续复诊快速查找。
2.2 医师详情页:完整透明展示医疗信息
点击医师卡片跳转详情页,分层陈列全部决策所需信息:
基础资质:从业年限、累计接诊患者数量、每小时诊疗费用;
就诊预约模块:下拉选择就诊月份、具体日期,多时段分时选择框清晰区分可预约档期;
患者真实评价板块:拆分接诊沟通、院内环境两大评价维度,星级直观展示医师服务水平。
全部信息分区清晰,主次分明,用户无需反复翻页即可完整了解医师情况,减少决策顾虑。
2.3 预约与订单管理页:自助化降低人工成本
预约成功后生成专属就诊订单卡片,清晰标注就诊医师、时间、地址;支持用户线上自主更改就诊时间、取消预约,全部操作无需联系客服。
订单配套核对清单,区分线上问诊、线下到院诊疗两类服务,就诊前自动留存预约凭证,方便到院核验,同时减少机构前台核对工作量。
2.4 就诊评价页面:完善双向反馈体系
就诊结束后用户可提交多维度星级评价,分别针对医师沟通服务、医院环境两大板块打分,评价数据实时同步至医师主页,为后续患者提供真实参考,同时帮助机构优化服务短板。
三、视觉与组件系统:塑造专业安心的医疗氛围
3.1 色彩视觉体系(适配医疗行业信任感需求)
主色调:干净柔和的深海蓝,医疗行业通用信任色,低饱和度不刺眼,弱化就医焦虑感;
基底色:纯白 + 浅灰页面底色,弱化视觉压迫,长时间浏览无疲劳感;
功能区分色:纯黑色作为主行动按钮(预约、提交),高对比度突出核心操作;浅灰用于次要标签、辅助文字;红色爱心作为收藏标识,轻微点缀提升页面活力。
3.2 标准化可复用组件库
整套 App 统一标准化组件,覆盖科室图标按钮、医师信息卡片、星级评分模块、日期时段选择器、评价表单、底部操作按钮等全部基础元素。
统一组件带来双重用户价值:
患者端:全页面操作样式、交互逻辑一致,老人、新手无需反复学习页面操作;
机构运营 & 迭代端:新增科室、活动页面可直接复用组件,大幅降低开发与设计成本,系统扩展性更强。
四、交互与用户体验核心亮点
需求前置筛选:首页直接展示全科室入口 + 热门医师推荐,用户打开 App 即可完成核心操作,减少跳转层级;
信息分层减法:医师卡片只保留关键决策信息,详细资质、评价收纳至详情页,首页不堆砌冗余文字;
全自助预约管理:支持自主改期、取消预约,减少机构人工客服压力,提升用户自主操作便捷度;
透明化评价体系:多维度星级评价直观展示医师服务水平,消除用户线上挂号信息不对称的顾虑;
极简预约链路:从选科室到完成挂号仅 3 步核心操作,无多余弹窗、表单拦截。
五、项目商业落地价值
提升患者留存与转化:简化挂号流程、信息透明化,降低用户就医决策成本,提升线上预约转化率,为医疗机构拓宽线上获客渠道;
降低机构运营人力成本:线上自助改期、取消、评价全流程自动化,大幅减少客服、前台接待工作量;
打造差异化线上医疗品牌:温和简约专业的视觉风格,区别于市面上杂乱繁杂的医疗 App,塑造安心可靠的品牌形象;
可持续业务增长:模块化系统架构支持后续拓展会员套餐、线上问诊、治疗套餐等增值业务,帮助机构提升长期营收。
兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

Dorun Dorun 结伴跑步社交 App 全案体验价值解析
北京兰亭妙微 UI 设计公司,成立 16 年来,始终保持着对国内外优秀设计作品的学习与研究。我们持续追踪全球前沿的 UI/UX 设计趋势,从中提炼可落地的设计方法论,分享给同样热爱设计的你。今天,我们来深度拆解一套结伴跑步社交 App 的ui设计,从信息架构、配色策略、移动端适配到数据叙事的视觉表达,逐一解析其背后的设计决策。

Dorun Dorun 是一款主打「结伴慢跑、运动社交」的轻量化跑步记录 App,核心服务两类人群:日常慢跑爱好者、想要养成运动习惯却难以独自坚持的普通用户。传统运动类产品普遍存在用户体验短板:
1. 独自运动缺少陪伴与正向激励,用户极易放弃打卡,运动留存率低;
2. 运动页面数据繁杂冰冷,纯数字图表枯燥,缺少情绪共鸣;
3. 社交链路薄弱,无法实时查看好友运动状态,运动分享形式单一;
4. 界面视觉生硬严肃,长时间使用容易产生疲惫感。本项目通过「陪伴式 IP + 实时社交 + 轻量化运动记录」的设计思路,从情绪、功能、视觉三层解决用户坚持运动难、社交互动弱的核心痛点。
1. 降低运动门槛:新手引导清晰易懂,操作步骤极简,零基础用户也能快速上手;
2. 打造陪伴式情绪体验:专属卡通 IP 贯穿全流程,消解独自运动的孤独感,持续给予运动激励;
3. 完善运动社交闭环:实现好友实时位置 / 运动状态查看、运动成果个性化分享、长期运动数据沉淀;
4. 统一全页面视觉语言:搭建标准化组件库,保证从引导页、运动页到个人中心,操作逻辑、视觉感受连贯统一。
产品完整覆盖运动全生命周期:新手引导 →运动前好友状态查看→运动中轨迹实时记录→运动后个性化打卡分享→个人长期运动数据存档,形成完整的“运动—社交—复盘”闭环。
开屏三页引导完全站在用户视角,直白展示三大核心功能:结伴跑步、查看好友实时运动、打卡分享运动日常。页面搭配治愈 IP 形象,文字简短易懂,底部统一行动按钮,无多余信息干扰,用户 3 秒就能明白产品能为自己带来什么,大幅降低新用户认知成本。
运动前页面:社交激励唤醒运动动力
用户进入 App 首页即可实时查看全部好友运动动态:包含好友跑步距离、上次运动时间、在线状态。配套暖心唤醒通知机制:针对 3 天以上未运动的好友推送提醒,通过社交督促激发用户运动意愿,解决 “独自运动没动力” 的核心痛点。页面信息分层清晰:好友动态列表为核心区域,底部放置一键开启跑步的主按钮,用户无需多次跳转就能快速开启运动。
跑步过程页面摒弃繁杂数据堆砌,只保留用户最关心的 4 项核心信息:实时距离、运动时长、配速、步频;搭配彩色渐变地图轨迹,直观展示跑步路线,视觉柔和不刺眼;全程仅保留 “暂停记录”“结束跑步” 两个核心操作按钮,避免多余功能分散用户运动注意力,适配户外跑步单手简易操作的使用场景。
跑步结束后支持两种打卡展示形式:标准轨迹地图、自定义实景照片背景;用户可自由替换背景图,搭配运动数据生成专属运动动态,丰富分享素材,提升用户主动分享至社交平台的意愿。极简一键发布按钮,完整打通 “运动完成 - 分享互动” 的社交链路。
个人主页分为两大模块:打卡相册、月度运动记录清单。打卡相册以日历图文形式留存每一次运动瞬间,月度清单清晰展示每日跑步数据,让用户直观看见长期运动收获,强化坚持运动的成就感,提升用户长期留存。
项目打造专属蓝色软萌球形 IP,覆盖全套情绪表情:开心奔跑、疲惫低落、加油鼓励、心动点赞等,适配 App 全部使用场景。核心设计逻辑:将冰冷的运动数据赋予情绪温度,用户运动时、懈怠时、完成目标时都有对应 IP 形象陪伴,消解独自运动的枯燥感,建立情感联结。IP 统一应用在弹窗、气泡提示、卡片、引导页,品牌记忆点极强。
· 主色调:柔和浅天蓝色,低饱和度不刺眼,适配长时间户外、室内看手机场景,传递轻松治愈的运动氛围;
· 辅助色:浅灰、纯白作为页面基底,深蓝色作为主操作按钮,区分主次操作;
· 状态色:火焰橙、爱心粉、星星浅黄作为情绪点缀色,仅用于 IP、标签小元素,不破坏整体干净清爽的视觉基调。
整套 App 搭建完整可复用 UI 组件库,覆盖按钮、输入框、列表、卡片、弹窗、底部导航、标签气泡等全部基础元素。统一组件带来两大用户优势:
1. 全页面操作逻辑一致,用户切换页面无需重新适应操作方式;
2. 界面整洁统一,无杂乱视觉元素干扰,查找功能、阅读信息效率更高。
1. 实时好友同步机制:无需主动刷新,一键查看好友当前跑步位置与进度,实现“线上结伴跑步” 的陪伴感;
2. 轻量化信息减法:运动页面只保留刚需数据,非必要功能全部收纳至次级页面,适配户外单手操作;
3. 情绪化反馈设计:所有弹窗、通知、结果页面搭配对应 IP 表情,运动完成给予正向鼓励,懈怠时给予温柔提醒;
4. 多形式分享载体:支持地图轨迹、实景照片双模式打卡,满足不同用户的社交分享喜好;
5. 数据可视化沉淀:日历相册 + 月度清单双重形式记录运动成果,直观强化用户运动成就感。
1. 提升用户留存:依靠陪伴 IP + 社交激励双设计手段,解决运动类 App 普遍存在的 “三分钟热度” 流失问题,拉长用户使用周期;
2. 降低用户获客成本:丰富个性化打卡素材,驱动用户自发向外分享传播,实现自然流量裂变;
3. 差异化市场竞争力:市面上多数跑步软件偏向专业硬核数据,本产品主打治愈陪伴社交,精准切入普通休闲慢跑人群空白赛道;
4. 低研发迭代成本:全套标准化组件库,后续新增活动、功能页面可快速复用,降低产品迭代开发成本。
1. 以用户情绪需求为底层逻辑,不止做运动数据工具,更打造陪伴式运动社交空间;
2. 全流程轻量化信息设计,区分运动前 / 中 / 后不同场景的用户操作需求,精准简化页面信息;
3. 专属 IP 贯穿全场景,建立独特品牌情绪记忆点,和同类运动产品形成明显视觉差异化;
标准化组件系统统一全端体验,兼顾用户使用流畅度与产品长期迭代效率。
图片来自Behance

兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

近期完成了一个颇具成就感的项目——青海师范大学大气污染可视化系统的界面视觉设计与交互设计。
项目背景:
该系统由青海师范大学委托进行重点页改版,旨在参加环保信息化领域的比赛。原系统界面功能区划分明确,但数据堆叠较为拥挤,视觉比重失衡,信息层级模糊,导致用户难以快速聚焦核心内容。
设计策略与优化:
1、风格定位:采用科技感设计语言,以深蓝为基底,通过背景图案增强纵深感,辅以科技感边框与线条点缀,在丰富页面层次的同时突出关键数据。
2、信息重构:面对庞杂数据,去粗取精,提炼核心内容。通过文字颜色、粗细及高亮处理的差异化运用,强化主次层级,使用户能够以直观的方式获取信息,有效降低理解难度。
3、视觉优化:以清晰图表替代文字堆砌,适度留白营造呼吸感。关键数据浮于场景之上,形成空间层次,在有扩展性的同时提升阅读体验。
4、场景落地:完成全国页面及山西省临汾市专题页的精细化设计,涵盖治理事件、效果分析及污染浓度趋势等核心模块。
一点感悟:
大屏设计的核心难点从来不是炫技,而是将复杂数据转化为清晰易懂的信息。界面之美,在于让用户"一眼就懂"。
兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

Voltera 新能源停车充电系统 UI 全案深度拆解
北京兰亭妙微 UI 设计公司,成立 16 年来,始终保持着对国内外优秀设计作品的学习与研究。我们持续追踪全球前沿的 UI/UX 设计趋势,从中提炼可落地的设计方法论,分享给同样热爱设计的你。今天,我们来深度拆解一套双端停车充电系统的ui设计,从信息架构、配色策略、移动端适配到数据叙事的视觉表达,逐一解析其背后的设计决策。
Voltera 是一套服务于新能源停车场的一体化智能管控系统,主要面向两大使用群体:停车场运营管理人员、新能源车主。
在传统模式下,双方都存在明显使用困扰:车场管理者无法直观查看车位状态、充电桩使用数据,场地利用率难以把控;新能源车主寻找空闲充电车位费时费力,充电进度、能耗情况也无法实时了解,双方使用体验都大打折扣,信息不通畅成为最大问题。
1. 面向车场运营者:把繁杂的运营数据简化呈现,支持全天候实时监控、数据趋势查看、车位预约管理,让管理工作更高效;
2. 面向新能源车主:简化操作步骤,快速找到合适的充电车位,实时查看充电状态与能耗,打造便捷的用车体验;
3. 全场景视觉与体验统一:电脑管理后台、手机 App、线下广告屏保持体验一致,线上线下服务无缝衔接。
系统支持多设备使用,包含 PC 端管理后台、苹果移动端 App、户外立式信息屏,全面适配不同场景下的使用需求。
整套系统根据两类人群的使用习惯,规划了专属操作流程:车主可完成登录、查找车位、在线预约、实时查看充电状态等操作;车场管理人员可查看全场车位数据、统计使用趋势、管理充电订单。
使用优势:
1. 功能分区明确:系统划分为登录首页、全场数据总览、车位筛选、充电数据查看、系统设置几大板块,功能划分清晰,上手零门槛;
2. 体验持续优化:结合大量真实用户的使用反馈反复调整流程,规避操作卡顿、查找困难等问题,适配不同年龄、操作习惯的使用者;
3. 人群需求区分:管理端侧重全场宏观数据,车主端聚焦个人用车需求,功能不冗余,每个人都能快速找到自己需要的内容。
电脑端专为车场管理人员打造,布局规整合理:左侧为常用功能入口,中间展示车位信息,右侧搭配全场停车场全景视图,底部呈现各类运营数据。
使用特点:
1. 信息主次分明:首页优先展示空闲车位、占用车位、充电车位等核心数据,再延伸至车位详情、月度 / 周度使用率等辅助信息,查看逻辑循序渐进;
2. 操作灵活便捷:支持全景地图缩放、鼠标悬停查看车位详情,还可自由切换年、周、日不同时间维度的数据,满足多样化管理需求,适配长时间办公查看的使用场景。
(2)手机 App:轻量化设计,随手即用
手机屏幕空间有限,系统遵循 “核心功能优先展示” 的原则,打造极简使用体验:
1. 底部设置固定导航栏,将充电这一高频功能放在核心位置,点击即可直达;
2. 首页优先展示停车场全景与推荐车位,充电页面重点突出充电进度,能耗数据也以简易图表呈现,一目了然;
3. 全设备体验统一:手机端沿用电脑端的信息展示样式,仅精简内容,用户切换设备使用时,无需重新适应,学习成本极低。
整套界面采用简约商务风格,以易用性为核心打造视觉体验:
· 整体以白色、浅灰色为基底,色调柔和,长时间查看屏幕也不易产生视觉疲劳;
· 用不同颜色区分设备与车位状态:绿色代表车位空闲、充电运行正常,蓝色专属标识新能源充电桩,橙色提示使用高峰,黑色按钮标注主要操作选项,无需阅读文字,仅凭颜色就能快速判断状态;
· 品牌视觉统一:简约品牌标识贯穿所有设备,线下宣传物料也保持同款风格,整体观感整洁专业。
文字大小区分明确,核心数据放大展示,辅助说明文字简洁精炼;页面预留充足留白,内容排布疏密得当,不会出现信息拥挤的情况。
系统搭配实景图片、简易图表辅助展示:用车场、车辆实拍图让场景更直观;用折线图、柱状图展示数据变化;用彩色区块区分不同车位类型,告别密密麻麻的文字描述。
系统将各类信息整合为标准化展示模块,分类清晰:
1. 车位信息模块:清晰标注车位位置、步行距离、收费标准、充电标识与预约按钮,电脑端多列展示、手机端单列排布,查阅方便;
2. 数据统计模块:突出核心数据,搭配简易图表,使用率、能耗等数据直观可见;
3. 充电详情模块:整合车辆状态、充电功率、剩余时长等信息,电脑端、手机端均可灵活查看。
规整的展示形式,让信息查找更快捷,大幅提升使用效率。
1. 重点数据放大呈现,车位占用率、充电进度、使用涨幅等核心信息第一眼就能捕捉;
2. 支持多维度数据对比,管理人员可清晰区分普通车位与充电车位的使用差异,为运营决策提供参考;
3. 悬浮提示功能:鼠标点击或悬停即可查看数据解读,不用反复跳转页面,查看数据更省心。
1. 智能推送贴心便捷:车主打开 App,系统会自动推荐距离最近的空闲充电车位,省去手动筛选的麻烦;车场管理后台首页直接展示全场运营数据,无需层层点击查找;
2. 数据实时同步:电脑后台与手机 App 数据实时联动,车位状态、充电进度毫秒级更新,信息零延迟;
3. 操作流程极简:从找车位、预约、充电到结束订单,全程仅需几步核心操作,无多余弹窗与繁琐表单,使用流畅;
4. 线上线下体验联动:线下户外信息屏与手机 App、电脑后台使用同款视觉与内容,服务体验保持统一。
1. 兼顾管理与使用双重需求:一套系统同时满足车场运营的大数据管理需求,和车主轻量化的用车需求,帮助停车场降低运营成本,提升整体服务效率;
2. 用数据赋能智慧运营:系统将车位空置率、充电桩使用率等运营数据直观呈现,帮助车场管理者合理调整定价、规划充电桩布局,实现精细化运营;
3. 贴合新能源行业调性:整体风格简约大气,契合新能源汽车科技、高端的行业定位,区别于传统老旧的停车系统,提升车场整体形象。
1. 多设备无缝适配:电脑、手机、线下屏体验统一,不同场景使用都顺手;
2. 数据展示通俗直观:不管是管理人员还是普通车主,都能轻松看懂各类数据;
3. 流程前置优化:结合真实使用习惯规划操作路径,从源头减少操作麻烦;
4. 精准区分人群需求:针对管理者、车主打造专属功能,各司其职,实用性拉满。
转载自Behance

兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

蚂蚁阿福 APP 以 AI 医生朋友的身份重新定义健康管理,从对话式医疗入口到智能体驱动的全流程服务,这款应用正在颠覆传统医疗产品的交互逻辑。它不仅通过人格化设计降低医疗决策压力,更借助阿里生态实现从咨询到就诊的完整闭环。本文将深度解析其创新设计如何重构用户与医疗服务的连接方式。

今天向大家分享一款最近刚推出的蚂蚁旗下的 AI 健康助手——蚂蚁阿福 APP ,希望你能从这篇产品体验分析中有所收获。如果你觉得我们的文章有价值,欢迎分享给你的朋友!
蚂蚁阿福是蚂蚁集团推出的 AI 健康管理应用,由原 AI 健康工具 AQ 升级而来。产品愿景是成为用户的 AI 医生朋友,提供健康咨询、图片解读(支持报告、病例、处方、药盒)、个人和家庭健康档案管理,以及预约挂号、云陪诊等医疗健康服务。

当你打开蚂蚁阿福 APP的第一刻,你会发现它像 ChatGPT、DeepSeek 一样,只有一个对话框。这正是 AI-UX 的典型表现形式——把「对话」作为核心入口,弱化传统的多层级导航,让用户用一句话就能触达预约、解读报告、症状咨询等多种服务。交互形式就像与医生聊天,而不是过去在 App 里找入口、找功能。

对话式AI交互和传统的菜单栏相比,用户的心智需要改变什么?
最近我对用“用户心智”这个知识点有了全新的理解。这得益于刚好在尝试全新交互的设计,而体验到阿福时,我尤其感同身受,因此重新思考了这个问题。
从交互方式上看,传统菜单栏要求用户预先了解功能位置和层级结构,通过”点击—浏览—选择”的路径完成任务。而对话式 AI 交互让用户从”寻找功能”转向”表达需求”,用自然语言直接描述问题,对话即交互、对话即操作。
这种转变对应着心智模型的两个层面:
另外,你会发现阿福的头部有点拥挤(包含用户中心、智能体、任务中心等入口)。这是因为过去在菜单栏或金刚区的高频功能都被上移了。也许这就是未来的设计趋势——”菜单栏”从下往上,把最宝贵的黄金位置留给 AI。

心智模型(Mental Model)
心智模型是用户基于过去经验形成的认知框架,决定了他们如何理解产品的运作方式。它影响用户如何理解界面、预测交互结果并做出操作决策。当产品的实际运作方式与用户的心智模型一致时,体验会更流畅;反之则会增加学习成本和认知负担。
与传统 AI 对话式交互不同,阿福将医疗场景中的高频应用设计成独立智能体。用户可以在底部对话框上方和头部直接触发,比如接下来介绍的 AI 诊室。使用其他 AI 工具问诊时,体验往往缺乏仪式感。但在阿福中,点击 AI 问诊后,系统会明确提示”你已进入 AI 诊室问诊中”。接下来的流程会聚焦于你的症状,进行梳理分析,最终推荐适合的医院和医生。
另外,阿福受益于阿里健康和支付宝的强大生态,可以在 APP 内完成预约和问诊的闭环。用户只需一个 APP,就能完成从诊前咨询到在线就诊的全流程。

如果你觉得 ChatGPT、DeepSeek 这类对话式 AI 产品的交互过于简单,融入智能体设计的阿福会给你更多惊喜。智能体像一个封装了特定功能的应用,具有明确的目标导向,用 AI 服务于这个目标,而不是让用户在自然语言中”摸索路径”。换句话说,智能体就像传统的二级功能模块——用户触发后,系统会在当前场景中围绕这个需求进行交互。
正是这个流程的设计,让我发现了它的独特之处。无论是之前体验过的阿里旗下安诊儿和讯飞晓医,还是我 7 月份构思的北京协和互联网医院 AI 版本方案,都未曾想过可以通过智能体来丰富交互设计形式。
AI 智能体是什么?
AI 智能体(AI Agent)是一种能够自主感知环境、做出决策并执行任务的 AI 系统。与传统的对话式 AI 不同,智能体具有明确的目标导向,能够调用多种工具、API 和服务来完成复杂任务。
AI 找医生这个智能体同样带给我很大的惊喜和启发。它成功地将传统医疗 APP 中用户已经熟悉的交互模式融入产品,同时巧妙地结合了 AI 智能对话方式,形成了一种既保留用户认知习惯又具有创新性的混合交互体验。

体验完这个智能体的交互流程后,我意识到过去对对话式 AI 产品的交互和 UI 理解过于浅显。它们确实主要依靠对话交互,但随着智能体的发展,每个智能体都代表一个独立的流程、内容甚至风格。
以 AI 找医生为例:它融合了传统的 TAB 框架,让用户按科室或疾病查找;当 AI 推荐的数据不满意时,还提供”查看全部”按钮,引导用户进入二级页面进行个性化筛选。这个设计让我发现,AI 产品远比想象中丰富——它不只是简单的对话框和侧边栏。
写到这里,我突然想起另一款对话式医疗 APP——讯飞晓医。当我输入”预约挂号”时,系统只能提示我跳转至其他医疗网站完成挂号。相比之下,阿里的生态能力令人赞叹:阿福直接连接好大夫等平台,用户可以在 App 内完成从 AI 推荐、查看医生到付费问诊的全流程,无需跳出即可实现就诊闭环。
早在 2023 年参与钉钉智能体测评时,我就有过类似构思:如果将专家过往的就诊经验和知识喂养给 AI 并进行专门训练,这个智能体能否解决 80% 的诊前基础咨询?当我体验这个智能体并查询相关资料后,发现阿福的医生 AI 分身确实做得非常出色。
该模型(官方名称叫蚂蚁·安诊儿医疗大模型 AntAngelMed)基于海量医学文献和去隐私化的真实病例数据构建,具备”深度思考”能力。它可对复杂、信息不全的临床场景进行多轮推理、逻辑验证与自我纠错,助力精准诊疗。
在产品层面,AI 医生整合了语音对话、挂号、补号申请等多种功能和场景。患者可以像与真人交流一样咨询,医生则能 24 小时服务多位患者。

医生 AI 智能体这一创新模式对多个行业领域具有重要的参考价值。它的核心在于:将一位拥有数十年临床经验的医疗专家所积累的专业知识、诊疗经验和实践智慧进行系统化的数据处理和标准化转换,再借助人工智能技术,使这些专业知识能够同时为成千上万的用户提供高质量的服务。
我甚至有一个大胆的设想:在未来,即便一个专家寿终正寝,只要他能把自己的知识库和经验传送给 AI,这个专家是不是就并未真正离去,而是可以继续造福我们的子孙后代?
「健康小目标」是一个围绕具体健康意图(如改善睡眠)展开的目标型智能体。它通过 AI 引导式问答拆解目标,自动生成可执行的日常任务,并将”制定计划—每日打卡—正向反馈”完整串联,形成持续的行为干预闭环。
体验这个功能时,我特意下载了几款健身打卡 APP,对比阿福的打卡流程与专业健身应用的差异。整体体验下来,阿福的用户体验更流畅。由于首页更聚焦、更简洁,我可以一目了然地看到所有打卡任务。

这个智能体给了我两点启发。
第一,表单类操作(如添加就诊人、填写问卷等)可以直接在对话框中完成,无需跳转到新页面。实际体验下来,这种设计不仅高效,还能保持用户的使用连贯性。
第二,健康小目标就像常见的用户签到打卡功能,通过持续打卡增强用户活跃度。但我认为最大的亮点在于:你可以在对话框中输入想实现的目标,系统就会为你自动规划。这正是自我决定理论(Self-Determination Theory)的绝佳体现,当用户具备自主性和胜任感时,他们会感觉是在主动使用产品,而非被产品操控。
这还是我第一次如此细致地了解我的皮肤,因为阿福的 AI拍皮肤智能体更像一个一体化的皮肤管理工具。不仅可以拍患处、看舌苔,还可以测肤质、测毛发。很幸运,工作了这么多年,我还没有秃头的迹象,AI 给我的测评是要注意休息、少熬夜,目前毛发良好。

我不得不感叹当今 AI 技术的飞速发展。当我完整体验了看舌苔、测肤质和测毛发这些功能时,虽然或许是我之前未曾留意,但还是给了我很大的震撼。AI 仅通过不同视角和角度的拍照,就能在短时间内快速评估出用户皮肤的健康状况——这本身就是科技的巨大进步。我没有去找 ChatGPT 探讨背后的技术原理,只想从一个普通用户的角度,表达我体验这些技术时的真实感受。
「药管家」围绕患者真实的用药场景,将药品识别、用药管理、用药指导、价格查询与购买行为整合为连续流程。用户从”我手上有什么药/我需要吃什么药”出发,可以自然完成从查询、添加到用药提醒,乃至购买的全链路操作。AI 在其中承担持续辅助与决策支持角色。
这个环节让我深刻感受到一个完整生态的价值——你在阿福就能实时查询药品价格、多维度对比,以及直接通过外卖配送或邮寄下单。

C 端产品的页面空间寸土寸金。当我添加了用药提醒后,我突然意识到阿福的首页其实是一个任务中心,而非传统的科普资讯推荐区。特别是与安诊儿 APP 相比,阿福的首页虽然看起来千人千面,但它能够感知、读取并提醒用户——无论是健康打卡、健康数据还是用药提醒,这个卡片区的场景拓展与应用都关联着整个产品的功能体系。
体验到这里时,恰好我刚带小孩去医院做了个小检查。拿到抽血报告后,我尝试将报告拍给阿福,亲身体验了 AI 报告功能。与医生相比,阿福的 AI 报告能帮助患者更系统、更完整地了解细节。医生工作繁忙,虽然经验丰富、能快速判断病情,但往往没有足够时间为患者详细解释。
AI 报告不仅为患者提供多轮对话追问,最后还会自然衔接 AI 诊室、医生解读与医院推荐,形成从”看不懂报告”到”下一步怎么做”的完整闭环。

我们也许真的要认真思考如何利用 AI 来帮助我们更好地生活了,比如 AI 报告这样的功能,它至少可以解决大部分患者对于专业报告的疑惑,了解 50%-70% 的基础情况。过去的互联网医院可以解决全国城市医疗资源不对等的痛点,而随着 AI 的加持,我觉得这种痛点会逐渐降低,就像 我在 AI 医生分身那个环节提到的一样,如果AI 可以把一个医生过去几十年的知识和就诊经验复刻,那么无论我们在哪个城市,都能同时享受到这个医生带给社会的价值。
总结与思考
第一,传统菜单栏会逐渐消失吗?
正如我在第一部分讨论的,阿福的对话式入口给了我很多启发。看着阿福拥挤的头部,我真切地感觉到——传统菜单栏可能会在越来越多的产品场景中彻底消失。甚至连搜索栏这样的功能,都会被 AI 输入框替代。对话即交互,对话即搜索,对话即触发,让我们拭目以待。
第二,智能体驱动 AI 产品设计创新
我每天都在使用 ChatGPT,长久以来形成了一种刻板印象:对话式 AI 产品的设计平淡无聊,传统的交互和界面设计似乎不再重要,取而代之的是功能逻辑和提示词设计。但阿福的设计给了我新的启发,打破了我对对话式 AI 产品的固有认知——未来的 AI 产品可以结合智能体做出更多创新,交互界面设计依然重要。
第三,对话式 AI 产品的应用场景将越来越广
我想到了许多应用场景,特别是与医疗高度相似的政务领域,比如税务、教育等。如果这些传统行业引入对话式 AI 交互,将极大提升工作效率。试想一下,当你只需在税务 APP 中输入几个字或说一段语音就能开始办理业务,能为前台工作人员节省多少时间?在这里给自己定个小目标:2026 年设计一款政企对话式 AI 产品,探索这个领域的设计趋势。
兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。
飞书的聊天窗口设计正重新定义企业协作的边界。通过标签页集成、多模态通讯、结构化搜索等创新功能,它将传统IM工具升级为沉浸式工作台。本文深度拆解了这款产品如何将碎片化沟通转化为高效生产力,其设计哲学值得每一位关注协作效率的产品人思考。

今天我想向大家分享我近期对飞书聊天窗口设计的体验洞察 ,希望你能从这篇产品体验分析中有所收获。如果你觉得我们的文章有价值,欢迎分享给你的朋友!
飞书是字节跳动旗下的新一代一体化协作平台,诞生于 2016 年。它将即时通讯、日历、文档、云盘、OKR、审批等功能深度整合,试图通过”All-in-One”的产品哲学重新定义企业办公的协作方式。相比传统 IM 工具,飞书更像是一个以沟通为中心的工作操作系统,致力于消除信息孤岛,让团队协作变得更加高效与流畅。
飞书的聊天窗口设计彻底打破了”即时通讯工具”的传统边界。通过在会话界面顶端嵌入可自定义的标签页(Tabs),飞书将对话框重构为一个微型协作工作台。用户无需跳转页面,即可在聊天上下文中快速切换文档、云表格、网页链接或关键任务,实现从”信息流”到”任务流”的无缝融合。

设计亮点
体验思考
从接触飞书到此次深度拆解,中间大概有 3 年多时间。我算不上飞书的重度用户,但过去 1 年多,飞书已成为我负责的在线教育项目中的主要沟通工具。如果不是这次深度体验,我从未发现聊天窗口竟然支持 tab 切换查找内容,甚至可以自定义。
当我开始深度体验时,从上至下的第一个功能就给了我惊喜——它突破了我对聊天窗口的固有认知。传统的 IM 软件将沟通(聊天)与结果(文档/任务)剥离,导致用户频繁在应用间跳转。而飞书通过”标签页”将生产力资产直接”拎”到会话层。这种设计策略证明了在 B 端产品中,沟通往往基于具体目标,这就是协作的本质——减少操作跨度就是提升生产力。
体验到这里,我甚至特意打开企业微信进行对比。毕竟在国内,这两个工具是企业办公的二选一。相比飞书,企业微信的聊天窗口采用传统模式,和微信的聊天模式相差无几。
另外,这一功能设计充分体现了渐进式披露和自我决定理论这两个设计策略——不强迫普通用户接受复杂的工作台逻辑,而是将深度协作工具隐藏在轻量级的标签切换中,并充分给予用户自主性和掌控感。
知识卡片:
渐进披露(Progressive Disclosure):一种信息呈现策略,只在用户需要时才展示更复杂或高级的功能,而非一次性呈现所有信息。这种方法防止用户被过多信息淹没,减轻认知负荷,让用户能逐步学习和适应界面。
自我决定理论(SDT):人有三个基本心理需求——自主性(想自己做决定)、胜任感(觉得自己做得到)和关系感(感到被认可和接纳)。如果产品设计能满足这些需求,用户就会更愿意使用。
飞书在聊天窗口顶端集成了覆盖全场景的通讯矩阵,将语音通话、视频会议以及运营商电话拨打深度整合在统一的交互入口下。除了文字,还支持语音、视频和电话拨打。更让人爱不释手的是,飞书的语音/视频不仅可以自由切换,还可以随时邀请其他伙伴发起多人会议,并提供屏幕共享、录制、倒计时、直播等工具——沟通体验真的非比寻常。

设计亮点
体验思考
在深度使用飞书协作的这一年里(此前三年我都是独立工作),我才真正理解为什么会诞生飞书、企业微信这类协作软件。例如,飞书的语音通话可以直接转化为会议,完美解决了传统聊天软件如微信的痛点:第三个人加入时必须挂断并重建群聊;分享屏幕时不得不切换到腾讯会议。这种”沟通即协作”的逻辑大幅提升了工作效率,无需频繁切换沟通方式。
相比传统聊天软件,这种聊天既协作、语音既会议的模式是从”沟通媒介”到”协作场景”的跃迁。它不仅深度集成了聊天和协作场景,更通过屏幕共享、倒计时和录制功能,将稍纵即逝的语音信息转化为可搜索、可引用的数字资产。
飞书聊天窗口的搜索功能不仅是一个关键词入口,更是一个强大的结构化过滤器。它通过将混乱的聊天记录原子化地拆解为消息、云文档、文件、图片/视频、链接等五大维度,配合“来自用户”与“时间范围”的多重嵌套过滤,让用户在海量碎片化信息中实现秒级定位。这种设计将搜索从一种“试错行为”转变为了一种高度确定的“资产调取”过程。

设计亮点
体验思考
在飞书的聊天窗口中,搜索并不是一个独立、泛化的全局能力,而是深度绑定在“会话”这一上下文之中。我觉得它的更像是一种从“文本检索”向“资产管理”的心智迁移。比如传统的 IM 搜索往往只针对文本,而飞书把对话中产生的每一个文档、每一条链接都定位成数字资产,于是我们可以通过不同的类型、时间、以及发送人去进行筛选。
回到产品设计层面,我觉得飞书的设计,解决了过往我们在传统 IM 搜索中的三个痛点:
如果要推荐此次产品分析中最惊喜的功能,实时翻译无疑是我的首选。飞书的实时翻译功能彻底抹平了国际化协作中的语言鸿沟。通过在聊天设置中深度集成翻译助手,飞书不仅实现了接收消息的”自动翻译”,更创新性地推出了”边写边译”模式。这一设计将翻译从”被动查阅”升维为”主动表达”的即时增强,让跨国团队无需第三方工具,就能在 IM 窗口内完成流畅且地道的原生对话。

设计亮点
体验思考
体验这个功能时,我不禁思考:飞书的实时翻译能否替代 HelloTalk 这类专业语言学习软件,让我在真实工作场景中自然地学习外语?它不仅支持自动翻译和边写边译,更重要的是能消除语言障碍,提升工作效率。而且,这还是一个完全免费的功能。
发现这个功能后,假如未来我能服务国际客户,我也觉得不必胆怯。它不仅打破了”表达焦虑”,更能实际解决跨语言协作沟通的难题。
你是否遇到过这样的情况:用传统 IM 软件发送长文字时,需要添加格式,比如加粗、增加项目序号?事实上,我一直忽略了飞书的这个功能。虽然我坚持聊天应言简意赅,但在工作场景中,确实常需要编辑长段落文字。
飞书聊天窗口通过一键转化功能,将传统的单行文本输入框升维为专业的富文本编辑器。这一创新设计打破了即时通讯”碎片化表达”的局限,让用户无需跳转文档页面,就能在会话流中直接产出结构清晰、排版精美的深度内容,实现”沟通”与”创作”的无缝对接。

设计亮点
体验思考
当我拆解得越细致,我发现我对飞书的印象就在一步步的改变。聊天对话框一键转化为富文本编辑器的设计,不仅规避了”长文表达必须跳转文档”的痛点,更解决了碎片化聊天导致信息混乱的问题。富文本编辑框本质上是一个”强制信息结构化”的引导工具——通过引导用户使用项目序号、加粗重点,设计师无形中帮助团队提升了信息分发效率,确保核心指令不被社交闲聊淹没。
飞书聊天窗口底部的工具栏是一个集成了多元化办公能力的原子化矩阵。它不仅涵盖了基础的社交元素(如表情、图片、语音),更深度嵌入了生产力组件(如任务、云文档、红包、定位等)。这一设计确保了用户在沟通的任一环节,都能即时调取对应的工具来推进工作,真正实现了“所聊即所得”的协作闭环。

设计亮点
体验思考
请点击“”按钮,然后仔细看看飞书底部工具栏藏着多少功能。如果说传统 IM 软件的工具栏是社交驱动的,而飞书则是任务驱动的。也许在 B 端的工作场景中,聊天框不应仅仅是字符的传输带,而应成为各业务模块(如 OA、CRM、任务管理)的统一分发器。
不过虽然工具栏功能繁多,但飞书通过“常用置前、深度收纳”的排版逻辑,避免了信息过载。这种设计确保了用户在基础聊天时处于“社交心流”中,而在需要专业协作时,又能通过二级菜单快速唤起“协作心流”。
我强烈推荐大家一定要注意飞书聊天窗口底部菜单栏的日程和任务这两个功能。因为你可以在和同事的聊天中随时发起会议和任务分配。你甚至不需退出聊天窗口去会议和任务面板,就能把工作的事儿在聊天窗口完成。
飞书通过在 IM 界面深度嵌入这样的快捷功能入口,消除了传统办公软件中切换应用、同步上下文的繁琐过程,让用户在沟通的任一瞬间都能一键将“想法”转化为“行动”,构建了一个从实时对话到确定性执行的闭环。

设计亮点
体验思考
我觉得飞书的聊天窗口实在太能理解用户的需求了,也许这正是飞书是字节跳动内部延伸出来的产品,它的诞生就是为了帮助字节跳动提升效率,所以它能深刻洞察到如何在几秒钟内防止办公效率的流失,从而将会议与任务视为 IM 的内生能力,而不是外部插件。
体验到这里,我真正改变了自己对飞书的产品认知,它并不是社交工具,而是数字办公室。即便只是一个聊天窗口,飞书也构建了全能的任务分发器。这种系统功能之间连接的颗粒度,让人叹为观止。
飞书在聊天窗口外围构建了一套极细颗粒度的消息过滤体系。通过将混合在一起的消息流原子化地拆解为未读、标记、单聊、群组、云文档、任务等多个 Tab 标签,飞书将“阅读消息”这一行为从无序的翻找升维为精准的任务处理。这种设计极大地提升了信息检索与处理效率,确保了核心任务在海量沟通中始终处于视觉中心。
设计亮点
体验思考
当我退出聊天窗口,准备结束这次产品体验的时候,我又突然发现飞书的消息列表页也藏着不少细节。如果习惯了传统 IM 软件按时间顺序堆叠消息的模式,飞书则通过 Tab 标签来标注消息的状态,甚至点击左侧筛选,还可以查看标记、@我、标签、单聊、话题等等更细的分类。
这是一种“信息熵增”的减法交互技巧和策略。随着工作时间增长,群组与好友数量会不可控地增加(即熵增),Tab 标签本质上是一套“动态降噪系统”。它允许用户通过点击特定的 Tab(如“未读”),瞬间将复杂的界面简化为仅剩待办事项的极简模式,从而缓解用户的信息焦虑、提升专注力。
过去几年我一直在用飞书,但坦白说,在没有刻意拆解之前,我从未意识到一个聊天窗口里竟然藏着这么多“为效率而生”的设计细节,虽然它是使用频率最高、却也最容易被忽略的核心界面。
我们日常使用协作软件时,常常会沿用其他 IM 的习惯,把它当作一个“像聊天一样聊天”的地方:发消息、回消息、刷对话就结束了。直到我开始更细致地体验与对比,才发现飞书把聊天窗口做成了更接近“协作工作台”的中枢入口。沟通不再只是信息往返,而是能在对话上下文里直接完成。
无论是结构化搜索在海量消息中精准定位关键资产,还是一键发起会议、随时分配任务让“讨论”立刻落到“行动”,又或者是实时翻译让跨语言协作更顺滑,这些能力都尽可能被收拢到同一个聊天窗口里完成。也因此我相信,你在看完这次拆解后,会对飞书的使用场景与产品认知产生新的变化:原来一个聊天窗口不仅能承载沟通,还能承载协作与生产力的闭环。
我认为,飞书把“以场景为中心”的策略发挥到了极致:和 C 端产品不同,它真正聚焦于 B 端协作沟通场景,将用户最高频、最真实的工作场景——沟通——作为承载协作的主舞台。
于是,文档、任务、会议、搜索、翻译等能力都能在同一上下文中被自然调用,让用户沿着“正在讨论什么”这条主线,持续推进到“接下来要做什么”。这种将信息流与任务流紧密耦合的设计,显著降低了切换成本与认知负担,也让团队的协作轨迹更容易沉淀、回溯与复用。
正因如此,这个聊天窗口几乎浓缩了飞书的设计精华:既承载其“沟通即协作”的价值主张,也映射出对真实工作场景与用户需求的深刻洞察。
兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。
蓝蓝设计的小编 http://www.lanlanwork.com