首页

UI 设计中的用户体验设计|兰亭妙微设计实战全解

涛涛 交互设计及用户体验

设计师遇到瓶颈,最好的破局方式,是跳出纯视觉审美,回到用户体验本质,重新审视需求、场景、行为与感受,用科学方法做有依据、可落地、能产生价值的设计。

拓宽设计之路,成为炙手可热的跨行业大牛的进阶武器 —— 知识管理(下)

涛涛 设计管理与成长

上一篇的知识管理分享,我们围绕设计行业的知识管理核心,阐述了如何在合作中建立信任的底层逻辑,本篇分享将继续完善上篇观点,结合兰亭妙微十五年的设计实战经验,为大家拆解设计行业知识管理的落地方法与核心价值。

兰亭妙微带您赏析Aurora AI 智能助手 App UI/UX 设计

蓝蓝设计的小编 移动端UI设计文章及欣赏

在 AI 工具与教育场景深度融合的当下,优质的 UI/UX 设计是让技术真正服务于教学、赋能学习的核心。以下结合 Aurora AI 这一网络优质 AI 工具设计案例,搭配兰亭妙微的专业设计经验,重点呈现 AI 教育产品设计成果,为 AI 产品设计提供参考。
 

 

一、Aurora AI 设计亮点:AI 工具的体验标杆

 
Aurora AI 作为 AI 助手类产品的优质设计范本,其设计逻辑精准贴合用户对 AI 工具的核心需求,为 AI 教育产品提供了可借鉴的设计思路:
 

1. 视觉设计:科技感与温度感的平衡

以深邃纯黑为底色,搭配高饱和科技蓝为主色调,用流体状动态 AI 图标贯穿全端,既凸显 AI 的技术属性,又通过柔和光影弱化工具的冰冷感,让 AI 更具 “数字伙伴” 的陪伴感;界面采用圆角卡片、高对比度按钮,信息层级清晰,核心功能突出,完美平衡科技感与易用性。
 

2. 信息架构:极简高效,全流程闭环

 
围绕用户 “便捷使用 AI” 的核心需求,搭建从模型选择、语音配置,到对话交互、功能创作的全流程闭环;首页聚合高频功能,合理分区多模型、会员等模块,避免信息过载,操作路径极简,大幅降低使用门槛。

3. 交互体验:多模态适配,个性化赋能

 
支持文字、语音、图片多模态交互,语音页用动态声波可视化反馈,强化陪伴感;提供丰富的语音类型、语调、语速自定义选项,支持多 AI 模型一键切换,满足不同场景需求,同时自然引导付费转化,兼顾体验与商业价值。

在实际项目中,兰亭妙微近期完成了上市公司竞业达教育软件事业部重点产品的整体 UI/UE 重构。项目覆盖平台端、教室端、移动端三大核心端口,针对教师、学生、课堂管理等不同使用场景进行全面优化升级。
 
设计过程中,兰亭妙微坚持三端风格高度统一的原则:视觉体系统一、色彩规范统一、字体图标统一、布局逻辑统一、交互体验统一。无论用户在 PC 平台端、课堂大屏端,还是手机移动端,都能感受到一致的视觉风格与操作习惯,不会因设备切换产生体验断层,真正实现多设备、全场景的体验一体化。
 
同时,项目围绕教学实际场景重构信息架构:教师端突出备课、授课、管理与数据查看;学生端强化学习、作业、互动与进度展示;教室端侧重展示清晰、操作便捷、适配课堂环境。三端功能各有侧重,但整体风格统一、体验连贯,大幅提升了产品的专业性、易用性与品牌质感,获得客户高度认可。
 
教育类产品的设计,不仅是界面美观,更在于场景适配、逻辑合理、体验统一。兰亭妙微深耕教育软件 UI/UX 设计多年,具备完整的多端产品重构、界面升级、体验优化能力。如果您有教育平台、教学系统、学习类 App 的 UI/UE 设计或改版需求,欢迎与兰亭妙微交流合作,我们以专业设计助力产品价值提升。
 

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

 

image.png

 

兰亭妙微带您赏析:移动端列表页设计:3 个核心要素 + 2 种主流布局,一次讲透

清阳 移动端UI设计文章及欣赏

兰亭妙微ui设计公司带您赏析:列表页是移动端最常用的信息承载页面,看似是重复组件的排列,本质是数据表格的可视化转化。想做好列表设计,先抓准核心逻辑,再定布局框架,新手也能快速上手。
 

一、先懂数据:列表设计的 3 个核心要素

 
列表不是单纯做视觉排版,而是清晰传递数据信息,设计前必须吃透数据的 3 个关键维度:
 

1. 属性字段:明确要展示的信息点

image.png

属性字段就是数据的表头,是列表里要呈现的所有独立信息。比如商品列表,包含商品图、名称、标签、销量、价格、好评率等;用户列表则包含头像、昵称、等级、状态等。

image.png

  • 设计前要梳理全字段,不遗漏关键信息
  • 给字段划分权重与分类,优先突出核心信息,次要信息弱化或隐藏

image.png

2. 字段值:确定信息的展示形式

image.png

字段值是每个属性的具体内容,也是数据到视觉的转化关键。开发中字段值仅为文本,设计里可转化为图片、图标、标签等更直观的形式。
 
  • 明确字段值的限制:文本长度、图片尺寸、状态类型
  • 统一转化规则:比如 VIP 等级用金银铜图标替代文字,提升视觉效率
 

3. 字段状态:适配不同场景的显示逻辑

image.png

字段状态决定何时显示、何时隐藏、显示什么内容,复杂列表必须设计多状态变体,避免展示异常。
 
  • 场景示例:外卖列表的配送标签(快送 / 专送 / 自配)、配送时间样式差异
  • 设计全覆盖:正常态、高亮态、禁用态、空态,确保所有场景适配
 
核心结论:优秀的列表是兼容数据的容器规则,不是单一好看的视觉组件
 

 

二、再定框架:列表页的标准结构 + 2 种布局

 
列表页不是只有列表组件,完整框架固定且清晰,布局选择直接影响浏览效率。

image.png

列表页标准框架

image.png

从上到下依次为:顶部搜索栏 → 运营模块(可选)→ 筛选 / 排序栏 → 列表主体区域
 
  • 运营模块控制篇幅,避免挤压列表首屏展示
  • 可在列表中插入运营广告、内容推荐,平衡信息与转化
 

移动端 2 种核心列表布局

 

1. 单列列表:一行一个数据项

image.png

单列展示空间充足,适合字段多、需引导点击的场景,分两种类型:
 
  • 引导型:核心目的是跳转详情,比如商品、酒店、外卖列表,突出封面与核心信息
  • 展示型:直接呈现完整内容,无需跳转,比如朋友圈、消息列表

image.png

优势:单条信息展示完整,阅读舒适;劣势:单屏数据量少,浏览效率偏低。
 

2. 多列列表:一行多个数据项

image.png

移动端主流为两列,三列极少,分两种展示形式:
 
  • 等高布局:每条数据高度统一、对齐规整,适合字段统一、差异小的场景(如电商商品、图集)
  • 瀑布流布局:数据高度自适应,灵活度高,适合内容长短不一、视觉差异化大的场景(如笔记、穿搭、短视频封面)

image.png

优势:单屏展示数据多,浏览效率高;劣势:单条信息展示空间有限。

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

 

image.png

兰亭妙微ui设计公司带您了解筛选功能设计

清阳 移动端UI设计文章及欣赏

前言

 
“少即是多” 是设计的常用理念,但产品简化到一定程度,必然会出现不可简化的复杂性
 
诺曼曾说:复杂是世界的一部分,但它不应该令人困惑
 
筛选控件,就是让用户自主管理复杂信息的核心工具 —— 只要符合用户行为,合理的复杂反而会被用户接受。
 
兰亭妙微UI设计公司从类型、场景、维度、准则五个维度,完整拆解移动端筛选设计,帮你快速选对、用好筛选控件。
 

 

一、先搞懂:筛选是什么?为什么要用?

 

1. 筛选的定义

 
筛选 = 用户通过一个 / 多个条件,在海量内容里快速缩小范围,隐藏不匹配信息,高效找到目标。
 
筛选是过滤器,属于搜索框架的一部分。
 

2. 筛选 vs 搜索(核心区别)

image.png

 
  • 筛选:系统提供条件,用户被动选择 → 缩小范围
  • 搜索:用户主动输入明确关键词 → 精准查找

image.png

 

image.png

简单记:搜索找结果,筛选缩范围
 

3. 什么时候必须加筛选?

 
  1. 系统定义筛选(一级筛选)
     

    image.png

    大方向快速切换,如:订单(待支付 / 待发货)、优惠券(未使用 / 已过期)。
  2. 用户自定义筛选(二级 / 精细化筛选)
     
    在一级结果里进一步精准,如:价格、品牌、发货地、评分等。
 
最佳组合:一级分类 + 二级精细化 + 排序
 

 

二、5 种最常用筛选样式(直接对应场景)

 

1. Tab 筛选

 

image.png

  • 形态:横向 / 纵向常驻展示
  • 优点:一目了然、随时切换、无学习成本
  • 场景:内容大类划分(新闻频道、视频分类、商品一级类目)
  • 缺点:结果偏模糊,需搭配二次筛选
 

2. 弹窗式筛选

image.png

 
  • 形态:入口隐藏,点击蒙层弹出
  • 优点:省空间、多维度平铺、不占页面
  • 场景:电商列表、外卖、出行等高频精细化筛选
  • 适用:条件不多、操作快
 

3. 折叠式筛选

  • 形态:入口隐藏,点击展开、常驻页面
  • 优点:比 Tab 省空间,比弹窗更可控
  • 场景:中度筛选需求,需反复调整条件
 

4. 高级筛选(新页面)

image.png

 
  • 形态:跳转到独立页面
  • 优点:无干扰、可放大量细颗粒条件
  • 场景:汽车、房产、招聘、复杂 B 端筛选
  • 适用:条件多、层级深、需专注操作
 

5. 筛选 + 排序组合(移动端标配)

image.png

 
  • 形态:筛选按钮 + 综合 / 价格 / 销量等排序
  • 优点:一步完成 “缩小范围 + 重新排列”
  • 场景:几乎所有商品 / 内容列表
  • 代表:美团、饿了么、淘宝、京东
 

 

三、3 个筛选维度(决定怎么布局)

 

1. 单维度筛选

 

image.png

  • 一次只选一个条件,触发即生效
  • 标签简短(≤5 字)、语义清晰
  • 场景:订单状态、内容分类
 

2. 多维度筛选

image.png

 
  • 支持单选 / 多选 / 区间 / 滑块
  • 需配:确定 + 重置按钮
  • 移动端建议:一级维度≤9 个,多余整合到二级
 

3. 多等级筛选

 

image.png

  • 层级:一级分类 → 二级属性 → 三级参数
  • 移动端最多 3 级,避免迷路
  • 适合:类目复杂的电商、后台系统
 

 

四、筛选设计 3 大核心准则(必遵守)

 

1. 以用户效率为目标

image.png

 
筛选的本质不是 “好看”,而是帮用户更快找到
 
  • 不知道要什么的用户:靠分类 + 筛选引导
  • 知道要什么的用户:靠精准条件快速锁定
  • 最终目标:降低时间成本,提升转化与留存
 

2. 按产品类型定制条件

 

image.png

不要抄通用模板:
 
  • 电商:品牌、价格、销量、评分、服务
  • 新闻 / 内容:热度、时间、偏好、标签
  • 工具 / B 端:状态、时间区间、负责人、关键字
 

3. 按使用频率排优先级

 

image.png

高频条件前置,低频条件隐藏 / 后置
 
  • 买手机:品牌→内存→容量→价格
  • 买日用品:价格→销量→(品牌放高级)
 

 

五、总结(一句话记住)

 
筛选的核心价值:用最简单的交互,帮用户最高效缩小信息范围
 
选型只看两点:用户需求 + 使用场景
  • 简单分类 → Tab
  • 常规精筛 → 弹窗
  • 复杂深筛 → 高级页面
  • 列表标配 → 筛选 + 排序

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

 

image.png

高手总结!深挖体验设计中的交互组件

清阳 设计资源

组件是体验设计的核心基石,设计师日常高频接触 UI 组件,却常对交互组件理解模糊。兰亭妙微UI设计公司从底层逻辑切入,结合真实产品案例,拆解交互组件的定义、特性与运行机制,帮你建立系统认知。
 

一、什么是交互组件?

 
体验设计中,交互组件是可复用的功能型设计单元,核心用于落地产品功能、达成用户目标。
 
与侧重视觉呈现的 UI 组件不同,它更聚焦行为逻辑、操作路径与反馈闭环,是连接用户与产品功能的关键载体。
 

二、交互组件的四大核心特性

 

  1. 可复用性
    image.png
    同一 App 或设计系统内可跨场景复用,减少重复设计,降低研发成本,保障体验一致性。
  2. 模块化

    image.png

    按业务逻辑与交互规则模块化封装,便于团队协作、快速调用,显著提升设计效率。
  3. 可定制性

    image.png

    支持根据场景、业务需求灵活调整参数与样式,兼顾标准化与个性化。
  4. 易用性

    image.png

    自带清晰指引、低学习成本,操作直观,有效降低用户理解与使用门槛。
 

 

三、高频交互组件案例深度解析

 

1. 按钮:核心动作执行单元

image.png

image.png

 

按钮是最基础的交互组件,承载操作触发、状态反馈两大核心作用。
 
  • 交互层级高,是用户完成关键动作的入口
  • 文案需用动作动词(下载 / 保存 / 关注 / 登录),可搭配状态文案缓解等待焦虑
  • 热区为按钮本体,需覆盖默认态、点击态、禁用态、加载态等全状态
  • 核心价值:明确引导用户行为,同步系统处理状态
 

2. 搜索:信息高效获取入口

image.png

由搜索框、搜索按钮、联想词、结果页构成完整链路,支撑精准 / 模糊检索。

image.png

image.png

image.png

image.png

image.png

  • 固定于页面顶部,支持滑动隐藏,兼顾沉浸体验
  • 交互层级低于顶部导航,属于二级高频功能
  • 支持点击、输入、语音、长按、滑动等多手势操作
  • 优化方向:减少输入成本、强化联想推荐、提升检索效率
 

3. 顶部导航栏:平行模块快速切换器

 
用于单页面内同级内容的高效切换,是移动端核心导航形式。
 

image.png

image.png

image.png

  • 固定页面顶部,视觉优先级高
  • 操作:点击标签 + 横向滑动内容区均可切换
  • 模块数量≥2,可按业务灵活增减
  • 核心价值:降低页面跳转成本,提升内容浏览效率
 

4. 滑杆:连续数值精准调节器

 

 

image.png

面向连续型数值(亮度、音量、饱和度)的快速调节组件。
 
  • 操作:轻触 + 横向拖动
  • 调节效率高,优化阻尼可兼顾快速粗调精细微调
  • 适用:编辑类、设置类场景的连续参数控制
 

5. 滑动选择器弹窗:强干扰型数值选择器

image.png

image.png

image.png

 
弹窗式连续数值选择工具,交互层级最高,会强制中断当前流程。
 
  • 适用:日期、时间、年龄等固定区间连续值选择
  • 操作:点击唤起 + 滑动选择 + 确认保存
  • 特点:选择结果明确,但对用户操作干扰较大,慎用
 

 

四、总结与设计建议

 
交互组件是体验设计的基础工具,四大特性支撑产品体验的标准化、可复用、可迭代
 
转载:优设

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

 

image.png

兰亭妙微|7 步搞定玻璃态 UI 设计,零基础也能学会

涛涛 设计管理与成长

玻璃态(Glassmorphism)作为当下主流 UI 风格,凭借通透、轻盈、高级的视觉效果,成为界面设计的热门选择。兰亭妙微结合实战经验,把复杂效果拆解为7 个简单步骤,清晰易懂,新手也能快速做出质感玻璃态 UI。

UI 设计师必须懂情感化设计 —— 兰亭妙微深度解读

涛涛 交互设计及用户体验

在产品同质化严重、用户体验愈发重要的今天,情感化设计早已不是 UI 设计的加分项,而是决定产品竞争力的核心必修课。作为专注 UI 与用户体验设计的兰亭妙微,我们始终认为:好的 UI 不只是界面美观、功能可用,更是能与用户对话、传递温度、建立情感连接的设计语言。

U兰亭妙微公司带您欣赏国外优秀健身与学习类 App UI/UX 设计赏析

蓝蓝设计的小编 移动端UI设计文章及欣赏

健身健康类 App:数据可视化 + 陪伴感,打造高效健康管理工具

 
这款健身 App 的设计,精准贴合用户 “科学健身、高效管理” 的核心需求,亮点突出:
 
  1. 视觉风格温暖有活力:以暖橙色为主色调,搭配柔和的米白底色,弱化工具的冰冷感,营造出积极、陪伴的健身氛围,让用户在使用中获得愉悦的情绪体验;
  2. 信息层级清晰直观:首页以体重、步数为核心视觉锚点,用卡片式布局聚合健康指标、运动计划、营养数据,核心数据(如体重 72.5kg、步数 82641)突出展示,让用户一眼获取核心状态,快速掌握健身进度;
  3. 交互便捷高效:“+” 号快速录入健康数据、“STOP” 一键暂停运动,操作路径极简,贴合健身场景 “快速记录、高效管理” 的需求;同时用曲线图表直观展示体重、步数趋势,让用户清晰感知运动成果,强化坚持动力。

     

     

 

(二)Chegg Study 学习类 App:趣味化交互 + 学习闭环,让学习更轻松

 
Chegg Study 作为学习类 App 的优质范本,设计逻辑精准匹配学生用户需求:
 
  1. IP 化视觉贯穿全端:以可爱的 AI 机器人为品牌 IP,搭配 3D 卡通学生形象、趣味数学符号插画,将抽象的学习工具转化为有温度的陪伴角色,弱化学习的枯燥感,缓解学生的学习焦虑;
  2. 全流程学习闭环搭建:从启动页引导、学科分类、多入口提问(文字 / 拍照 / 语音),到题库管理、历史问题复盘,完整覆盖学生 “遇到问题→获取答案→复盘学习” 的全流程,操作路径极简,大幅降低使用门槛;
  3. 正向激励强化粘性:个人中心聚合提问数、已解决数、收藏数等核心数据,用可视化成果强化学生的学习成就感,形成正向激励,有效提升用户留存与使用频次。
 

  
兰亭妙微深耕 C 端产品 UI/UX 设计多年,拥有丰富的健身、教育类产品设计、改版、重构经验。近期,兰亭妙微成功完成上市公司竞业达教育软件事业部重点产品的 UI/UE 全案重构,覆盖教师端、学生端、教室端、平台端全系列软件,圆满交付并获得客户高度认可。
 
本次改版围绕 “贴合教育场景、提升教学效率、优化用户体验” 三大核心目标,兰亭妙微对全系列产品进行了全方位升级:视觉上实现全端风格统一,兼顾教师端的专业性与学生端的亲和性;信息架构上重构 “教 — 学 — 管” 全流程,让各端功能布局更合理、操作路径更简洁;交互体验上贴合课堂教学、课后学习、教学管理等不同场景,优化触控适配、数据展示、快捷操作等细节,真正实现 “全场景覆盖、多端一体化” 的使用体验,助力竞业达教育软件提升产品竞争力。
 
兰亭妙微始终坚持 “以用户为中心” 的设计理念,无论是健身类产品的陪伴感打造,还是教育类产品的学习闭环搭建,都以 “提升用户体验、赋能业务增长” 为核心。如果您有健身、教育类 App 的 UI/UE 设计、产品改版、界面重构等需求,欢迎随时与兰亭妙微对接,我们将以专业的设计能力,为您打造贴合场景、体验优质的产品解决方案。
 

 

三、设计总结

 
无论是健身类 App 的 “数据可视化 + 陪伴感”,还是学习类 App 的 “趣味交互 + 学习闭环”,都印证了 C 端产品 UI/UX 设计的核心逻辑:视觉贴合用户场景、信息架构服务核心流程、交互体验强化使用价值。兰亭妙微将持续深耕 C 端产品设计,以专业能力为不同赛道的产品赋能,打造更有温度、更高效的用户体验。
 
 

 

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

尼尔森十大可用性原则:用超多案例吃透交互设计核心

清阳 设计资源

在人机交互领域,雅各布・尼尔森博士 1995 年提出的十大可用性原则,是历经时间检验、贯穿 C 端与 B 端设计的经典方法论,至今仍是产品交互设计的核心指导准则。兰亭妙微ui设计公司结合海量真实产品案例,拆解每一条原则的落地逻辑,帮你把理论转化为可执行的设计思路。
 

一、状态可视反馈原则

 
系统需在合理时间内,对用户操作给出即时、清晰的状态反馈,让用户明确当前操作进度、结果与系统状态,消除不确定性与焦虑感。
 
核心要求:反馈速度匹配用户预期,形式直观易懂,覆盖操作响应、进度提示、结果告知等全场景。
 
  • 百度网盘下载文件时,实时展示下载进度、传输速率、剩余时间,精准缓解用户等待焦虑。
  • 360 安全卫士杀毒过程中,同步呈现查杀进度与完成倒计时,给予用户明确的操作掌控感。

image.png

二、现实世界隐喻原则

 
系统语言、图标、交互逻辑需贴合真实世界认知习惯,用用户熟悉的符号、短语传递功能含义,降低学习成本,无需额外解释即可快速理解。
 
核心要求:摒弃专业代码与晦涩术语,以生活化、场景化的表达完成人机沟通,隐喻可覆盖视觉与操作层面。

image.png

  • 360 安全卫士、腾讯电脑管家、嗨格式视频转换器的功能图标,均采用大众熟知的图形设计,精准匹配业务场景,美观且易识别。
 

三、操作可撤销回退原则

 
为用户提供便捷的错误修正通道,支持撤销、重做、修改、撤回等操作,让用户能快速恢复到误操作前的状态,提升操作安全感。
 
核心要求:回退操作简单易找,无复杂流程,覆盖高频误操作场景。

image.png

  • 微信支持 3 分钟内撤回消息,QQ 邮箱提供邮件撤回功能,避免误发送带来的困扰。
  • 虎课网支持用户随时修改头像与个人信息,赋予用户自主调整操作的权利。
 

四、全流程一致原则

 
产品在交互逻辑、视觉风格、操作反馈上保持统一,相同场景下的相同操作,结果与体验完全一致,帮助用户形成直觉化操作习惯。
 
核心要求:按钮、图标、色彩、空状态等设计元素全域统一,跨模块、跨场景体验无割裂感。

image.png

  • 飞书在联系人、邮箱、日程、消息等所有场景,采用统一的空状态页面设计,产品整体感极强,使用体验流畅舒适。
 

五、事前防错原则

 
预防错误优于事后补救,设计阶段预判用户误操作行为,通过禁用无效选项、状态区分、二次确认等机制,从源头减少错误发生。
 
核心要求:不可逆操作必须加确认步骤,功能状态清晰区分,避免用户误触、误选。

image.png

  • EV 录屏删除视频时,触发二次确认弹窗,有效防止文件误删。
  • 天翼云电脑专家将学习模式按钮设为彩色(可用)、置灰(不可用)两种状态,直观区分功能可用性。
 

六、减轻用户记忆原则

 
系统主动呈现关键信息、保留历史记录、自动保存内容,无需用户刻意记忆数据,降低认知负荷,提升操作效率。
 
核心要求:历史操作、输入内容、常用选项自动留存,切换页面时不丢失关键信息。

image.png

  • 花瓣、千图、哔哩哔哩的搜索栏,自动保存历史搜索记录,用户无需重复输入,一键选择即可快速搜索。
 

七、灵活易用适配原则

 
兼顾新手、中级、高级用户的使用需求,新手有引导、中级用户易上手、高级用户可定制,打造灵活适配的操作体验,提升用户满意度与粘性。
 
核心要求:提供个性化设置、快捷操作、自定义功能,满足不同用户的使用习惯。

image.png

  • 腾讯电脑管家内置 12 种个性皮肤,支持一键换肤,满足用户的审美与个性化需求。
 

八、简约去繁设计原则

 
剔除冗余信息与非核心功能,聚焦用户核心任务,通过信息归类、层级划分、动态交互简化页面,避免信息过载,让核心功能一目了然。
 
核心要求:页面简洁不杂乱,信息层级清晰,复杂内容轻量化呈现。

image.png

  • 联通应用商店仅在鼠标悬停应用图标时显示安装按钮,动态简化页面信息,视觉更清爽。
  • 飞书通过任务紧急度配色 + 图标归类,将复杂的任务页面梳理得清晰简洁,降低信息理解难度。
 

九、清晰容错提示原则

 
错误无法避免时,提供通俗易懂的错误说明 + 可执行的解决方案,摒弃晦涩错误代码,用直白语言告知问题原因与修复方法,缓解用户焦虑。
 
核心要求:错误提示可视化、口语化,附带明确指引,不让用户困惑无措。

image.png

  • 联想电脑管家客服页面异常时,给出清晰的文字提示 + 趣味插画,既说明问题又安抚情绪。
  • 联想电脑商铺应用无法查看消息时,直接告知原因并提供解决方向,引导用户快速处理。
 

十、便捷帮助支持原则

 
即使产品操作直观,也需提供易查找、好理解的帮助体系,复杂业务场景(尤其是 B 端)搭配精简帮助文档,前端加引导提示,解决用户使用难题。
 
核心要求:帮助入口显眼,内容简洁有步骤,C 端轻量化、B 端系统化。

image.png

  • 菜鸟裹裹邮寄页支持地址智能识别填充,一键完成信息录入,大幅提升操作便捷度。
  • 酷我音乐在设置中内置帮助入口,用户可快速反馈问题、获取官方协助。
 

总结

 
尼尔森十大可用性原则不是空洞的理论,而是融入产品细节的实用设计工具。带着这些原则观察日常产品、落地设计方案,既能打造易用、流畅的用户体验,又能兼顾视觉美感与功能实用性,是每一位设计师的必备核心思维。
 

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

 

image.png

日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档