ui设计分享达人 - 设计每日一贴-专注优秀UI设计与软件开发-北京兰亭妙微

首页

212024-10

讲讲AI在B端设计上的应用方法

ui设计分享达人 B端ui设计文章及欣赏

B 端设计领域的 AI 应用

大多数同学目前对 AI 应用的认识只有文生图、对话、驾驶等领域，但 AI 应用的场景远远不止它们。

和头部的明星 AI 产品、模型相比，细分市场的 AI 应用就非常没有存在感了。比如使用 AI 进行财务的审核、饮料配方的调节、工程安全的模拟等等，它可以帮助企业节约大量的人力完成工作。

概括起来，就是一些可以通过计算机完成的（也不止）重复性劳动或标准化流程，都可以引入 AI 的技术进行降本增效。

那在 UI 设计领域中，这些重复性和标准化的工作内容有嘛？

有，但是并不会像外行或者新手想象的那么多。AI 难以覆盖的场景我们过去的分享探讨过，等等也会做进一步的说明，而这里我们先要探讨的，就是能用 AI 实现的 B 端设计场景，具体有哪些。

我们都知道市面上现在有很多开源的 B 端前端框架，各个大厂前赴后继地对它们进行更新和完善，里面包含了非常丰富的组件库。

这些组件库不不止是 UI 的组件，也包含了前端的对应代码，前端工程师可以快速调用这些代码组件而不用自己去重新写一遍样式和交互。

原则上，使用现成的组件开发就可以快速完成整套项目的前端内容，这可以给前端工程师节省大量时间。所以即使项目中有完整的设计稿，前端在开发过程中也会偷懒直接略过，直接套用框架内的组件实现。

这和设计师直接套用素材完成运营图设计一样，明明有现成的素材在那里，为什么要浪费一大堆时间自己重新画一遍还是用 3D 建模渲染？同理，要是组件足够丰富，满足项目的需要，设计师也可以直接复用官方的组件素材，不用自己设计。

组件化思维的运用，就是项目工作标准化和重复性的根源，不仅应用在设计领域，对于前、后端开发来说同理。

基于这种思路，催生出了一种新的 SaaS 模式 —— 低代码 Low-Code 服务。

即通过少量的代码，或者干脆不用代码，仅通过可视的工具和组件实现软件的开发，并完成相应的配置和部署的工具。

这概念咋一看不就是建站工具？比如有赞、微店之类的，用户可以在里面直接创建并配置店铺，然后以网页、H5 或小程序的形式发布。

但这只是最初级的应用，传统的建站工具属于帮你预制好了主要的参数和功能，用户只能在这个范围内做少量的自定义编辑和设置。但进阶的 Low-Code，会赋予用户更大的编辑范围和自由度，让用户通过可视化的界面创建自己想要的产品和功能。

这类产品已经衍生出一个规模不小的市场，因为有大量的中小企业不想投入太多的精力和成本进数字化平台的搭建上，

并希望能快速创建不同的管理工具来匹配企业日新月异的发展需要

。

这里要划重点，对于一部分企业来说，经营模式和业务流程是持续迭代的，如果使用传统的开发模式那么很难跟上这种迭代。

以连锁餐饮品牌举例，前期只在一个城市经营，和后期扩张到全省或全国，采购流程和供应链管理必然会持续进行调整，提交一个采购工单所需填写的字段就会发生变化，同理展示的表格、详情页也要跟着调整。

这类变化往往并没有修改界面的视觉、交互、组件，仅仅是增加和减少字段数据，而用传统的收集需求再输出进行开发的模式效率非常低，所以它们就成为 Low-Code 的最佳应用场景。业务方自己配置、修改直接上线，省掉产品经理、设计师、程序员中间耗差时……

并且对于很多企业来说，只需要应用一些非常基础的功能服务和页面类型。比如我经常提到的 B 端管理系统的四个核心页面类型：

Low-Code 就是把常规需求标准化，并运用组件化的框架，让用户通过简单的填写和编辑就能生成出想要的页面和功能。

既然需求不复杂，功能、组件、页面、代码都可以标准化，那不用 AI 降本增效还有王法嘛？

所以，使用 AI 生成 B 端页面（不是设计稿）的工具已经在大厂内部开始应用了，开发专属大模型，再把做好的组件喂给模型，用户只要在相应的表单内填入需求，就可以快速生成出落地的页面。

并且各家大厂内部的 B 端组件库，可远远不止对外分享的这些开源框架里包含的数量，还有很多特殊的业务组件，可以让模型得到更好的训练和产出，比普通 Low-Code 模式更简单高效，大幅度提升企业内部B端产品的落地和运用效率。

从已经了解到的信息中，有一部分业务部门已经开始进入实践环节了。且随着技术的迭代，这种工具必然会越来越强大，功能越来越丰富。

所以，了解完这个趋势，设计师和前端工程师迎来大结局了？要被AI技术清洗了？现在该捧起《从0到1学习炒粉》学习了嘛？

这就是下面要讨论的内容。

B 端 AI 和设计的关联

前面做了不少铺垫，就是为了强调，适用于 Low-Code 和 AI 生成的 B 端产品，是有前提条件的，包含下面这些要素：

完整成熟的前后端组件库
需求使用基础做法就能实现
需要经常变动调整的业务需求
对设计和交互本身要求不高

而这里面最关键的东西，就是标准化。必须要知道在今天的 AI 的应用发展中，要生成出符合实际工作需要的结果，绝对不是靠输入信息以后它自己 “蒙” 出来的。为了让结果尽可能准确，那么喂给模型的数据也就要越多且越有针对性。

理论上面向 B 端的 AI 工具，只要不断提供给他新的组件、页面，就能拓展它可以实现的范围。但不管你怎么训练它，都要满足标准化的前提。

而标准化，恰恰就是国内 B 端业务的命门……

我们都知道国内 SaaS 行业现在发展非常的混乱，虽然在不同的细分领域有自己的独角兽，比如财务领域的金蝶，OA 领域的钉钉，ERP 领域的用友等等。

但是这些公司就发展状况良好利润丰厚了？24年一季度的 SaaS 头部公司业绩非常萧条，比如网上找到的统计，和国外 SaaS 头部公司的估值和利润形成鲜明的对比：

为什么国内 SaaS 市场那么惨淡？说到底就是在国内 B 端领域很难实现真正的标准化，而不是国内 B 端市场规模太小。

比如钉钉、飞书这样的 OA 软件已经很成熟了，但它们的实际普及程度一点都不高，而中大型企业又有各种考量，现成的不用就热衷于开发一套自己的系统，简称定制化。这就倒逼 SaaS 工具为了满足更多的企业需求，拼命叠加功能，使得这些 SaaS 工具一个比一个臃肿。

而我们前面提到的 AI 生成，想要普及同样需要面对这种困境，因为模型不管怎么做，它都是基于特定标准化下的产物，它可以满足其中一部分需求，但难以满足其它需求。尤其是国内 B 端定制化需求中，混乱、抽象、联系复杂的问题非常突出。

换句话说，国内 B 端市场的大多数系统，是非标准化的，需要产品团队在面对这些非标准的需求下做出创新和适配，就必须要考虑很多抽象的因素，领导、背景、体验、交互、周期、难度等等。这个过程不可能由业务方自己完成，且最终导出的设计结果，往往会和常规方案有很大的差异。

按常规逻辑考虑的话，那有多少组件我们整理多少组件，早晚有一天不得穷尽设计师思考范围的边界？

且不说获得不同商业项目的业务组件有多困难，如果组件之间没有更底层的思路去规范它们的设计和交互，那么硬凑到一起的项目是非常割裂的，而 AI 在短时间内没办法做到真正理解交互的逻辑并根据使用场景做理性的推理。

所以基于一套团队产出的组件必然是有限的，它们或许可以满足自己项目，但不可能满足市面上所有项目的使用需求。

还有一个很关键的疑问，就是很多人会想，一个项目中的特殊组件往往只是少数，我们用 AI 工具生成多数页面，少数进行定制和独立开发不就行了？

这思路在逻辑上很合理，但实践起来的问题非常多。举个例子比如设计稿直接生成网页这种技术，从20年前我刚了解到网页设计那天说到现在了，这个实现逻辑理应不需要 AI 的参与都能做到，中间也问世了不少产品和工具，但没有一个做成了，反而网页前端工程师都成为一个独立热门职业了（以前是 UI 写）。

原因就是作为商业项目来说，团队需要 “可控性”，机器生成代码虽然容易，但是如果要修改里面的东西怎么办？实际情况就是前端对这些外部代码深恶痛绝，因为改起来太麻烦，而越大的项目改起来难度也越高。而且这个版本的一部分你改了，下个版本工具再生成的代码要不要兼容你前面写的东西？

所以现在即使有设计稿直接生成代码的工具前端也宁愿自己写，但当他们用到第三方框架的时候，能不动框架里面的东西就不动。想要理解这个感受，只要拿这些框架的组件素材用它们的组件、自动布局形式做完一个项目，你们就会产生 —— 还不如自己重做一遍的想法。

所以生成工具，要不然能一次性完整满足所有需求，要不然就会因为两三成的缺口形成致命的瓶颈。当然，还有远比这些复杂的进一步因素，我就不在这里展开。

标准化无法在定制化的面前获得优势，这是国内 B 端行业面临的直接困局，当然这里有坏的影响也有好的影响。

坏的影响，就是头部 SaaS 企业没办法得到快速的发展，推高整个 B 端软件业的收入水平和吸引力，AI 生成页面这些技术适用范围小，没办法真惠及全体，行业处于反复造轮子但根本没办法停下来。

好的影响，则是头部的 SaaS 企业发展不起来，市占率就低，它们就没办像 C 端市场一样形成非常显著的马太效应，形成事实的垄断。大家重复造轮子，那么提供的就业岗位才多，才能让我国的炒粉行业没有那么卷，竞争没有那么激烈（？？？）……

如果你关注过 B 端市场足够多年，你就会明白任何企图用一种标准、方法论直接平铺整个行业的做法，注定是徒劳的，而无序、野蛮、熵增才是不变的主旋律。

但 AI 的作用短时间内完全发挥不了吗？也不是。除了前面提到的一些简单的项目之外，还有一个非常大的可能，就是中小模型的开发会变得越来越容易，而基于项目自研的界面 AI 生成工具很有可能会普及起来。虽然它们不能随心所欲生成任何需求的样式，但可以完全根据业务方的实际需要进行定制，去服务小范围的群体。

这不代表项目里面就不需要设计师，符合这套项目的标准依旧需要设计师去制定，也需要设计师持续输出特殊的页面和组件。

所以，未来很长一段时间内 AI 和 B 端 UI 设计师之间会是互补的关系，而不是替代关系。这也会对岗位要求形成进一步的影响，所以下面是我对 B 端 UI 设计师所需技能的建议：

进一步提升交互能力，尤其是基于业务认知输出交互方案的抽象思维能力
进一步巩固项目设计规范的创建能力，深入了解规范的应用和落地流程
进一步提升全局性设计思维，能提炼核心价值观并在项目中进行应用
进一步了解编程开发逻辑，能更好的配合前后端完成项目的输出提高效率

这些能力的掌握是 B 端 UI 设计师应对未来市场变化的核心竞争力，也是 AI 在短时间内绝对无法替代的东西。

不管是作为已经入行的，还是准备入行的 B 端设计新人，都不用对 AI 技术在 B 端的影响太过担心，自怨自艾，因为

如果 B 端项目的设计都那么简单的话，那么从前端框架普及的那一天起，B 端 UI 设计师就可以集体下岗，而不用等到 AI 应用的那天

。

换个表述方式，祝大家不会菜到那么轻易就被 AI 给取代了……

作者：酸梅干超人
链接：https://www.zcool.com.cn/article/ZMTYzNzg4MA==.html
来源：站酷
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。我们建立了一个微信群，每天分享国内外优秀的设计，有兴趣请加入一起学习成长，咨询及进群请加蓝小助微信ben_lanlan。

关键词：UI咨询、UI设计服务公司、软件界面设计公司、界面设计公司、UI设计公司、UI交互设计公司、数据可视化设计公司、用户体验公司、高端网站设计公司、银行金融软件 UI界面设计、能源及监控软件 UI界面设计、气象行业 UI界面设计、轨道交通界面设计、地理信息系统 GIS UI界面设计、航天军工软件 UI界面设计、医疗行业软件 UI界面设计、教育行业软件 UI界面设计、企业信息化UI界面设计、软件qt开发、软件wpf开发、软件vue开发

评论(0) 浏览(102)

172024-10

打动用户的关键：用户体验地图实战攻略

ui设计分享达人交互设计及用户体验

一、什么是用户体验地图？

二、为什么使用用户体验地图？

三、什么情况使用用户体验地图？

四、用户体验地图的组成？

五、用户体验地图的制作流程

六、用户体验地图案例展示

七、用户体验地图总结

一、什么是用户体验地图？

用户体验地图（User Experience Map）是一种用于可视化展示用户在与产品或服务互动过程中所经历的各个接触点和体验的工具。它帮助团队深入了解用户的行为、情感和痛点，从而优化用户体验。

用户体验地图（User Experience Map）是产品设计前期——用户研究中很重要的一部分，视角化和图表的方式，从用户的角度来表现其和产品/组织/服务交互的过程，是连续的视觉时间和完整故事的多个互动点。

简单来说，在用户定义角色，搭配行为研究、表格调查和竞品分析等数据下，构思出这个角色在某个角色故事下要完成特定目标，以反应用户使用某个特定产品的真实特性，有助于我们评估现状、找出用户真正的痛点，与优化整体的体验流程（创造和谐的互动）。

二、为什么使用用户体验地图？

使用用户体验地图（User Experience Map）在项目中有很多重要的原因，能够给团队带来显著的价值，例如：

1、全面理解用户旅程

可视化用户体验：用户体验地图通过图形化的方式展示用户在使用产品或服务过程中的所有步骤和接触点，使团队能够直观地看到用户的整个旅程。

识别关键时刻：帮助团队识别用户旅程中的关键触点和情感波动，理解用户在不同阶段的需求和行为。

2、发现用户痛点和改进机会

识别痛点：用户体验地图能够揭示用户在使用过程中的痛点和挑战，使团队可以针对这些问题制定解决方案。

挖掘改进机会：通过分析用户行为和情感波动，团队可以找到提升用户体验的机会，从而优化产品或服务。

3. 增强团队协作和沟通

统一理解：用户体验地图作为一种直观的沟通工具，使跨职能团队（如产品经理、设计师、开发人员和市场团队）能够共享对用户体验的统一理解。

促进协作：通过共同创建和讨论用户体验地图，团队成员可以更好地协作，提出建设性的意见和建议。

4. 驱动以用户为中心的设计

以用户为中心：用户体验地图强调从用户的角度出发，关注用户的需求、情感和行为，推动以用户为中心的设计和开发。

提升用户满意度：通过优化用户旅程中的各个触点和体验，团队可以提升用户满意度和忠诚度。

5. 支持决策制定

数据驱动决策：用户体验地图基于用户研究和数据分析，为决策提供可靠的依据，减少主观判断和猜测。

优先级管理：通过识别用户体验中的关键问题和机会，团队可以更好地确定优先级，集中资源解决最重要的问题。

6. 提高用户体验设计的效率和效果

明确目标和方向：用户体验地图帮助团队明确设计目标和方向，减少反复修改和沟通成本，提高设计效率。

验证设计假设：通过用户体验地图，团队可以验证设计假设和概念，确保设计方案符合用户需求和期望。

三、什么情况使用用户体验地图？

用户体验地图（User Experience Map）在多种情况下都可以使用，能够帮助团队更好地理解和优化用户体验。例如：

1.产品或服务的初期开发阶段

定义产品概念：在开发新产品或服务时，用户体验地图帮助团队理解用户需求和期望，确保产品设计符合用户需求。

设计用户旅程：通过用户体验地图，团队可以详细规划用户与产品互动的每个步骤和触点，确保用户旅程流畅且无障碍。

示例：

一家创业公司在开发一款新的移动应用时，通过用户体验地图了解目标用户的需求和使用习惯，从而设计出更符合用户期望的产品。

2.现有产品或服务的优化

识别和解决问题：当现有产品或服务存在用户体验问题时，用户体验地图帮助团队识别痛点并制定改进措施。

提升用户满意度：通过分析用户在不同接触点的情感和行为，团队可以找到提升用户满意度和忠诚度的机会。

示例：

一家电商平台通过用户体验地图发现用户在结账环节遇到的困难，优化了结账流程，显著提高了用户满意度和转化率。

3.跨职能团队的协作和沟通

建立共同理解：在涉及多个部门的项目中，用户体验地图帮助不同团队（如产品、设计、开发、市场）建立对用户体验的共同理解。

促进协作：通过可视化的用户旅程，团队成员可以更有效地讨论和协作，提出有建设性的改进建议。

示例：

一家大型企业在推出一项新服务时，通过用户体验地图让产品经理、设计师和市场团队共同参与，确保各团队对用户体验的理解一致，从而提高协作效率。

4.用户研究和测试阶段

记录用户反馈：在用户研究和测试阶段，用户体验地图帮助记录和分析用户反馈，发现用户在使用产品过程中的实际体验。

验证设计假设：通过用户体验地图，团队可以验证设计假设，确保设计方案符合用户需求和期望。

示例：

一家金融科技公司在测试新功能时，通过用户体验地图记录用户的使用体验和反馈，优化了功能设计。

5.制定产品战略和路线图

战略规划：用户体验地图帮助团队从用户角度出发，制定产品战略和发展路线图，确保产品的发展方向符合用户需求。

优先级管理：通过识别用户体验中的关键问题和机会，团队可以更好地确定改进措施的优先级。

示例：

一家健康科技公司在制定未来两年的产品发展计划时，通过用户体验地图分析用户需求和市场趋势，确定了重点开发的功能和服务。

6.营销和客户支持

提升客户支持效率：用户体验地图帮助识别用户在寻求支持时的痛点，优化客户支持流程，提高用户满意度。

优化营销策略：通过了解用户在不同阶段的情感和行为，团队可以制定更有针对性的营销策略，提升用户转化率。

示例：

一家SaaS公司通过用户体验地图发现用户在使用过程中遇到的常见问题，优化了客户支持流程，并根据用户行为调整了营销策略，提高了客户留存率。

四、用户体验地图的组成？

组成用户体验地图（User Experience Map）可以分为八个部分，分别是：用户角色（Persona）、场景（Scenario）、阶段（Stages）、触点（Touchpoints）、用户行为（Actions）、用户情感（Emotions）、痛点（Pain Points）、机会（Opportunities）；组成部分整合到一张用户体验地图上，团队可以直观地看到用户旅程中的所有关键要素。帮助团队全面理解用户在整个体验过程中的行为、情感和痛点，从而制定更有效的优化策略，提升用户满意度。下面我们详细说明这八个部分：

1. 用户角色（Persona）

定义：用户角色是目标用户的详细描述，包括人口统计信息、行为模式、需求和痛点。

目的：帮助团队聚焦特定用户群体的需求和体验，使设计和决策更有针对性。

示例：

年龄：25-35岁

职业：城市白领

兴趣爱好：网上购物

需求和痛点：需要便捷快速的购物体验，不喜欢复杂的结账流程

2. 场景（Scenario）

定义：场景是用户在某一特定情境下与产品或服务互动的全过程描述。

目的：帮助团队了解用户的具体使用情境和目标，确保设计满足实际使用需求。

示例：用户在下班回家的路上，通过移动应用购买晚餐所需的食材。

3. 阶段（Stages）

定义：用户旅程的不同阶段，从开始到结束，包括用户在每个阶段的主要活动和目标。

目的：展示用户旅程的整体结构，帮助团队识别每个阶段的关键活动和目标。

示例：

发现（Discovery）、考虑（Consideration）、决策（Decision）、使用（Usage）、回访（Return）

4. 触点（Touchpoints）

定义：用户在每个阶段与产品或服务的具体接触点，如网站、客服、实体店等。

目的：识别用户与品牌互动的关键时刻，确保每个接触点的体验都得到优化。

示例：网站首页、产品页面、购物车、结账页面、客服

5. 用户行为（Actions）

定义：用户在每个触点上的具体行为，如浏览网页、咨询客服、购买产品等。

目的：展示用户的具体操作过程，帮助团队理解用户的实际使用方式。

示例：浏览产品、加入购物车、填写订单信息、支付、联系客服

6. 用户情感（Emotions）

定义：用户在每个触点上的情感体验，包括积极和消极的情感波动。

目的：帮助团队理解用户的满意度和痛点，确保在关键时刻提供积极的体验。

示例：

兴奋（浏览产品时）、犹豫（选择支付方式时）、沮丧（遇到支付问题时）、满意（收到产品时）

7. 痛点（Pain Points）

定义：用户在整个体验过程中遇到的困难和挑战。

目的：识别和解决用户体验中的问题，提升用户满意度。

示例：

结账页面加载慢、支付方式选择不便、客服响应慢

8. 机会（Opportunities）

定义：基于用户行为、情感和痛点，识别出改善用户体验的潜在机会。

目的：为团队提供改进用户体验的方向和具体措施，推动持续优化。

示例：

优化结账页面性能、增加支付方式、提升客服响应速度

五、用户体验地图的制作流程

制作一份完整的用户体验地图（User Experience Map）需要多个步骤，使用的方法也有很多，不用担心，下面我们进行详细步骤拆解：

1.定义目标

目的：明确制作用户体验地图的目标和用途，比如改善特定功能的用户体验、优化整体用户旅程等。

示例：

一家电商平台希望通过用户体验地图识别用户在结账过程中的痛点，并制定改进措施。

2.收集用户数据

方法：

用户访谈：直接与用户对话，了解他们的需求、行为和情感。

问卷调查：通过问卷收集大规模用户数据。

用户观察：观察用户在实际使用产品或服务时的行为和反应。

可用性测试：测试用户在特定任务中的表现，发现使用障碍和痛点。

数据分析：分析网站或应用的使用数据，了解用户行为模式。

示例：

电商平台通过用户访谈和问卷调查收集用户在结账过程中的体验和反馈。

3.定义用户角色（Persona）

步骤：

基于收集的数据，定义主要的用户角色，描述其特征、需求和痛点。

示例：

用户角色A：25-35岁，城市白领，喜欢网上购物，重视便捷和快速的购物体验。

4.描绘用户旅程

步骤：

划分用户旅程的不同阶段，从开始到结束，包括用户在每个阶段的主要活动和目标。

示例：

发现阶段：用户在网上搜索和浏览商品。

考虑阶段：用户比较不同商品的特点和价格。

决策阶段：用户决定购买某件商品。

使用阶段：用户完成购买并等待商品送达。

回访阶段：用户收到商品后可能会再次访问网站。

5.识别触点和用户行为

步骤：列出用户在每个阶段的具体触点和行为，展示用户的操作过程。

示例：

触点：网站首页、产品页面、购物车、结账页面、客服。

用户行为：浏览产品、加入购物车、填写订单信息、支付、联系客服。

6.记录用户情感

步骤：描述用户在每个触点上的情感体验，包括积极和消极的情感波动。

示例：

用户在浏览产品时感到兴奋，但在结账时因页面加载慢而感到沮丧。

7.识别痛点和机会

步骤：基于用户行为和情感，识别用户在每个阶段的痛点，并找出改善用户体验的机会。

示例：

痛点：结账页面加载慢、支付方式选择不便、客服响应慢。

机会：优化结账页面性能、增加支付方式、提升客服响应速度。

8.创建可视化地图

步骤：将所有信息整合到一张可视化的用户体验地图上，使团队能够直观地了解用户的完整体验过程。

工具：

手绘草图：用纸和笔绘制用户体验地图。

数字工具：使用工具如Miro、Lucidchart、UXPressia等创建数字用户体验地图。

9.讨论和验证

步骤：

与团队成员共同讨论用户体验地图，验证其准确性和全面性。

基于讨论结果进行必要的修改和调整。

示例：

团队成员共同审查用户体验地图，确认所有触点和用户行为是否准确，讨论发现的痛点和改进机会。

10.制定改进措施

步骤：根据用户体验地图识别的痛点和机会，制定具体的改进措施和实施计划。

示例：

优化结账页面加载速度，增加多种支付方式，提升客服响应效率。

11.实施和跟踪改进

步骤：实施制定的改进措施，并持续跟踪用户反馈和数据，评估改进效果。

示例：

电商平台实施优化结账页面的改进措施，并通过用户反馈和数据分析评估效果，确保用户体验得到提升。

六、用户体验地图案例展示

通过上面的介绍，相信你已经对用户体验地图（User Experience Map）有了一定了解，是不是已经想自己动手开始制作了，下面我们看几个案例：

案例 1：电商平台优化

背景：一家电商平台希望通过用户体验地图识别用户在结账过程中的痛点，并制定改进措施，以提升用户满意度和转化率。

用户角色（Persona）

姓名：张女士

年龄：30岁

职业：城市白领

兴趣：喜欢网上购物

需求：需要便捷快速的购物体验

痛点：不喜欢复杂的结账流程

触点和用户行为

1. 发现（Discovery）：通过搜索引擎和社交媒体广告发现平台

2. 考虑（Consideration）：浏览产品详情，查看用户评论

3. 决策（Decision）：将商品加入购物车

4. 购买（Purchase）：填写订单信息并支付

5. 回访（Return）：查看订单状态，联系客户服务

用户情感

发现：兴奋和好奇

考虑：谨慎和比较

决策：确定和期待

购买：焦虑和满足

回访：满意和信任

痛点和机会

痛点：结账页面加载慢，支付方式选择不便，客服响应慢

机会：优化结账页面性能，增加支付方式，提升客服响应速度

案例 2：健身App优化

背景：一家健身App希望提高用户的使用频率和忠诚度。

用户角色（Persona）

姓名：李先生

年龄：25岁

职业：程序员

兴趣：健身

需求：需要个性化的健身计划

痛点：课程选择不够个性化，计划制定过程复杂

触点和用户行为

1. 发现（Discovery）：通过朋友推荐和广告发现App下载并安装App

2. 考虑（Consideration）：浏览课程详情，查看评价

3. 决策（Decision）：选择并购买课程

4. 使用（Usage）：开始使用课程进行锻炼

5. 回访（Return）：查看锻炼记录，调整计划

用户情感

发现：好奇和期待

考虑：审慎和比较

决策：确定和信心

使用：满足和成就

回访：满意和忠诚

痛点和机会

痛点：课程选择不够个性化，计划制定复杂

机会：增加个性化推荐功能，简化计划制定过程

案例 3：银行在线服务优化

背景：一家银行希望优化其在线服务平台，以提高用户的操作体验和满意度。

用户角色（Persona）

姓名：王女士

年龄：45岁

职业：教师

兴趣：理财

需求：需要简单易用的在线银行服务

痛点：在线服务平台操作复杂，转账流程繁琐

触点和用户行为

1. 发现（Discovery）：访问银行官网，注册账户

2. 考虑（Consideration）：浏览平台功能和用户评价

3. 决策（Decision）：决定使用在线服务

4. 使用（Usage）：进行账户管理和转账操作

5. 回访（Return）：查看交易记录，继续使用服务

用户情感

发现：好奇和怀疑

考虑：审慎和信任

决策：确定和信心

使用：满足和便捷

回访：满意和忠诚

痛点和机会

痛点：操作复杂，转账流程繁琐

机会：简化操作流程，优化用户界面设计

七、用户体验地图的总结

用户体验地图（User Experience Map）作为一种强大的工具，在理解和优化用户体验方面具有显著优势。然而，制作和维护用户体验地图也存在资源密集、复杂性和动态变化等挑战。团队在使用用户体验地图时，需要平衡其优劣势，合理分配资源，确保地图的准确性和实用性，从而真正提升用户体验和产品成功率。

优势

1. 全景视角

优点：用户体验地图提供了用户体验的全景视角，涵盖了用户与产品或服务互动的各个阶段。这种全景视角有助于团队全面了解用户旅程中的各个触点和行为。

案例：电商平台可以通过用户体验地图了解用户从浏览商品到完成购买的全过程，识别出所有关键的用户触点。

2. 用户共情

优点：通过记录用户在每个阶段的情感体验，团队可以更好地理解用户的需求和痛点，增强用户共情。

案例：健身App可以通过用户体验地图了解用户在制定和执行健身计划时的情感变化，从而设计出更具吸引力的个性化健身计划。

3. 识别痛点

优点：用户体验地图有助于识别用户在使用产品或服务过程中的痛点和障碍，帮助团队找到改进的机会。

案例：银行在线服务平台可以通过用户体验地图识别出用户在进行转账操作时遇到的困难，进而优化转账流程。

4. 跨团队协作

优点：用户体验地图作为一个可视化工具，可以促进跨团队协作，使不同部门（如产品、设计、开发和市场）能够共同参与讨论和改进用户体验。

案例：电商平台可以通过用户体验地图汇集市场、设计和技术团队的意见，共同制定优化措施。

5. 数据驱动决策

优点：用户体验地图基于用户研究和数据分析，使决策更加数据驱动，有助于制定科学合理的改进策略。

案例：健身App可以通过用户体验地图中的用户数据分析，调整课程推荐策略，提高用户满意度和使用频率。

劣势

1. 资源密集

缺点：制作用户体验地图需要大量的时间和资源，包括用户研究、数据分析和团队协作。

案例：中小型企业可能难以投入足够的资源来全面制作和维护用户体验地图。

2. 复杂性

缺点：用户体验地图可能变得非常复杂，特别是当用户旅程涉及多个触点和渠道时，可能难以全面和准确地记录所有细节。

案例：大型电商平台的用户旅程可能涉及网站、移动应用、社交媒体等多个渠道，制作一个全面的用户体验地图可能需要大量的精力。

3. 动态变化

缺点：用户行为和市场环境是动态变化的，用户体验地图需要不断更新和维护，以保持其有效性和准确性。

案例：健身App的用户需求和市场趋势可能随时变化，需要定期更新用户体验地图以保持相关性。

4. 主观偏差

缺点：尽管用户体验地图基于用户数据和研究，但在数据解读和情感记录上可能存在主观偏差，影响决策的准确性。

案例：银行在线服务平台在记录用户情感时，可能会受到研究者的主观影响，从而无法完全准确地反映用户真实感受。

5. 过于理想化

缺点：用户体验地图有时可能过于理想化，忽略了现实中存在的限制和障碍，导致制定的改进措施难以实施。

案例：电商平台在识别改进机会时，可能忽略了技术实现上的困难，导致优化方案无法落地。

参考文献：

https://medium.com/@michaeljiager/user-experience-maps-6184f4044e48

https://liviayang-ms.medium.com/%E4%B8%80%E5%88%86%E9%90%98%E8%AE%93%E4%BD%A0%E4%BA%86%E8%A7%A3%E7%94%A8%E6%88%B6%E9%AB%94%E9%A9%97%E6%AD%B7%E7%A8%8B%E5%9C%96-user-experience-map-e28a1b8817c0https://uxmastery.com/how-to-create-a-customer-journey-map/https://medium.com/art-marketing/incorporating-customer-and-user-experience-data-into-holistic-journey-maps-502ae12072ac

https://uxplanet.org/empathy-map-user-persona-and-user-flow-5299ada245c8https://medium.com/@myskill.id/persona-user-journey-map-ebd84c15ae2f

作者：CANAAN8
链接：https://www.zcool.com.cn/article/ZMTYzMDA4MA==.html
来源：站酷
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

评论(0) 浏览(327)

172024-10

清晰展现关键信息，助力高效决策——数据图表

ui设计分享达人设计思维

合理使用数据图表可以帮助用户更好地理解复杂的数据，提高用户体验和数据的可读性。选择合适的图表类型并遵循最佳设计实践是确保图表有效传达信息的关键。

数据图表是一种非常重要的可视化工具，它能够

帮助用户更直观地理解和分析数据。

借助于图形化的手段，清晰、快捷有效的传达与沟通信息。从用户的角度，数据可视化可以让用户快速抓住要点信息，让关键的数据点从人类的眼睛快速通往心灵深处。数据可视化一般会具备以下几个特点：准确性、创新性、简洁性。

作者：Miao_C
链接：https://www.zcool.com.cn/article/ZMTYzMjk4NA==.html
来源：站酷
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

评论(0) 浏览(134)

172024-10

Web端设计语言库——数据可视化

ui设计分享达人 B端ui设计文章及欣赏

一、可视化原则

数据可视化是把相对复杂、抽象的数据通过可视化手段，表达数据内在的信息和规律，促进数据信息的传播和应用。

Dreawer Design 团队总结了以下四个可视化原则，供设计者参考及使用：

1. 准确

数据图表需精准、如实地反应数据信息的变化特征。

2. 清晰

让设计服务于数据内容，给用户以最为清晰、明确、迅捷的数据展示。用户看到可视化图表时，应能在 5 秒内了解到它的用途，而不是花几分钟都不能理解各个数据的含义。

3. 简单

可视化结果应该是一看就懂，不需要思考和过度理解，因而选定图表时要理性，避免为了视觉上的效果而选择一些对用户不太友好的图形。

下面为图标类型与认知成本对比：

4. 美观

优秀的数据可视化界面，会有一套非常严谨一致的版面。这里的一致性需要考虑到布局、结构和内容。

二、图表解构

1. 构成元素

我们从标题、坐标轴、图例、标签、提示信息、数据图形这 6 个大类，对数据图表进行进一步元素拆解及阐述。设计过程中，需遵循可视化原则来精简数据图表，让用户快速获取图表中的关键信息，完成任务。

图表构成 6 大类，元素细分：

1. 标题：图表标题；

2. 坐标轴：X/Y轴线、刻度线、网格线、X/Y轴标题、X/Y轴标签；

3. 标签：数据点、引导线、（文本）数据值；

4. 提示信息；

5. 图例；

6. 数据图形：线、矩形、扇形、环形等。

下面为数据图表的基本构成元素示例（为了便于观察，某些字母做了大写处理）：

除了以上的常规元素，还有常用于饼图、环形图中的“引导线”：

2. 标题

标题是概括图表主题的说明文字，一个明确、精简的标题可以迅速让读者理解图表要表达的内容。

2.1 位置

一般位于数据图表卡片的左上方。

2.2 使用建议

标题需言简意赅、符合图表主题；尽量控制在 20 个字以内，标题宽度尽量不要超过卡片宽度。

2.3超长处理

当标题超过长出卡片宽度时，省略标题中间的文字，保住首尾，如“我是...标题”。

3. 坐标轴

3.1 坐标系

坐标轴包含在坐标系的概念里，因此，我们需要先了解坐标系。坐标系是能够使每个数组在维度空间内找到映射关系的定位系统，更偏向数学/物理概念。

数据可视化中，最常用的二维坐标系有两种：

笛卡尔坐标系：即直角坐标系，是由相互垂直的两条轴线构成。常用于柱状图、条形图、折线图、面积图等。

极坐标系：由极点、极轴组成，坐标系内任何一个点都可以用极径 r 和夹角 θ（逆时针为正）表示。常用于饼图、圆环图、雷达图等。

补充说明：

1. 坐标轴由定义域轴（X 轴）和值域轴（Y 轴）组成。条形图中，定义域轴为 Y 轴，值域轴为 X 轴。

2. X轴为水平方向的横轴，Y 轴为垂直方向的竖轴。以下主要针对笛卡尔坐标系的坐标轴构成进行分析：

3.2 坐标轴

定义：坐标轴指二维空间中统计图表中的轴，是坐标系的构成部分，它用来定义坐标系中数据在方向和值之间的映射关系。

构成元素细分：X/Y 轴线、刻度线、网格线、X/Y 轴标题、X/Y 轴标签。

3.3 轴类型

根据对应变量是连续数据还是离散数据，可以把坐标轴分为：分类轴、时间轴、连续轴三大类。

3.4 X/Y 轴线

颜色层级：X/Y轴线要比网格线层级高、颜色深，这样能让图表有主次区分。

使用建议：有网格线时，柱状图/折线图会隐藏 Y 轴线，条形图则是隐藏 X 轴线，以达到信息降噪、突出重点的目的。

3.5 刻度线

轴刻度线是轴线上的小线段，用于指示数值标签在坐标轴上的具体位置。轴刻度线有 3 种放置方式：置内、置中（即交叉方式）、置外。

位置建议：刻度线置中/置内时，可能会和网格线、数据图形重叠，所以建议将刻度线置于数值坐标轴外侧，以呈现最佳显示效果。

显示建议：

折线图：刻度线、X/Y 轴标签、数据点需要保持在同一垂直线上；

柱状图/条形图：由于单个柱子有很强的对应关系，此时可以隐藏刻度线；

3.6 网格线

定义：网格线是用来辅助图表优化映射关系的，我们需要弱化网格线的视觉效果，来增加数据的可阅读性。

作用：1. 延伸数值刻度至可视化对象中，以便观察数据值的大小；2. 增加可视化对象之间的对比观察度。

使用建议 1 ：使用网格线时，需遵从主次原则，以轴线为主、网格线为辅；样式上可采用实线或虚线；避免颜色过重、使用纯黑/纯白色。

使用建议 2 ：网格线一般跟随值域轴的位置单向显示，柱状图、折线图等采用水平网格，条形图采用垂直网格。

3.7 X/Y 轴标题

轴标题主要用于说明坐标轴数据组的含义，也可理解为“轴单位”。当可视化图表标题、图例、轴标签等已能充分表达数据含义时，可隐藏轴标题。

这样处理体现了奥卡姆剃刀定律：如无必要，勿增实体。

3.8 X/Y 轴标签

轴标签是对当前某一组数据的内容标注，用于提高数据的可读性。

以下从 X 轴标签、Y轴标签两方面进行分析：

a. X 轴标签

X 轴标签的设计重点在显示规则上。卡片宽度过窄、标签过多、名称过长时，X 轴标签便会出现显示问题（如标签重叠等）。

为了解决显示问题，我们从连续/时间轴标签（数值类）、分类轴标签（文本类）两方面进行分析：

连续/时间轴标签

显示规则：建议等分抽样显示、旋转；不尾部省略。

建议等分抽样：连续/时间轴，通常由一组等差数列组成，具有规律性，缺失的数据用户会在脑海中自动补全。所以建议用等分抽样来避免标签的重叠问题。

注意：等分抽样尽量保留首尾数据标签；随机抽样没有规律，会影响用户的判断及辨认，不建议采取随机抽样显示。

连续/时间轴标签是由“关键数值”组成的标注点，一般都明确精简，尾部省略会影响用户对关键数值的辨认。

为了保证标签的辨识度，我们可以将标签旋转 45°、 90° 。极端情况下（图表宽度极窄），可以同时进行旋转+抽样。

分类轴标签

显示规则：建议旋转显示；不建议抽样显示。

分类轴由几个离散数据标签组成，标签之间独立存在，无紧密逻辑关系，用户无法自动补全缺失信息。因此，不能采取抽样显示，应尽量展示全部标签的全部文本。

若标签横向展示空间不够（文字重叠），我们可以将标签旋转 45°、 90° 来达到预期显示效果。若通过旋转无法满足需求，可使用条形图，将分类轴放在Y轴。

旋转方向说明：通常情况下，用户的阅读视线为从左至右、从上到下。因此，标签顺时针旋转 45° 更符合用户的浏览习惯。

b. Y 轴标签

Y 轴标签的设计重点在标签数量、取值范围和数据格式上。标签显示区域一般根据最长标签宽度进行自适应缩放。

轴标签的数量

使用建议：根据米勒定律（7±2 法则），Y 轴标签数量应控制在 5-9 个的范围内；Web页面中，Y 轴常用标签数为：6 或 7（含标签0）。

轴标签的数量越多，横向网格线就会越多。过多的轴标签及网格线会造成元素冗余，违背了清晰、准确的可视化原则，也不利于图表信息的表达及阅读。

对齐方式：右对齐

轴标签的取值范围

基准线： Y 轴标签取值应从 0 基线开始，以反映数据的真实性。如果展示被截断的 Y 轴数据，会导致用户做出错误的判断。

轴标签的数据格式

使用建议 1：标签保留的小数位数保持统一。

4. 数据标签

数据标签是对数据点对应数值的标注，用于直接观察每个数据点的具体数值。

若图表主要是用来看趋势变化、占比大小等，则不需要显示数据标签。若想精确了解每组数据的具体数值，则可以显示数据标签。

4.1 位置

数据标签位于数据点的上方。

4.2 显示规则

在不同类型的图表中，数据标签的显示规则不同。我们可以根据数据图形、数据值的特性，选择合适的显示方式，提高图表的准确性。

a. 柱状图

基础柱状图

：数据标签可显示在数据图形内部、外部。

数据标签在图形内部的显示规则：正常情况下，横向显示；数据标签超长时，旋转 90°；图形高度 < 数据标签高度时，不显示数据标签。

分组柱状图

：数据标签可显示在数据图形内部、外部。显示在内部的数据标签显示宽度不够时，解决方案同上。

堆叠柱状图

：数据标签显示在数据图形内部。

数据标签在图形内部的显示规则：正常情况下，横向显示；数据标签超长时，旋转 90°；图形高度 < 数据标签高度时，不显示数据标签。

b. 条形图

数据标签在图形内部的显示规则：正常情况下，横向显示；图形宽度 < 数据标签高度时，不显示数据标签；条形图高度需 >= 数据标签高度。

基础、分组条形图的数据标签也可以显示在图形外部：

c. 折线图

数据标签显示在数据点的上方。

图表宽度过窄，数据点多且密时，相邻的数据标签会出现重叠的问题。此时，我们会采用抽样的方式显示数据标签。鼠标悬停数据点，显示隐藏的数据标签。

d. 饼图、环形图

数据标签显示在图形内部、外部均可。

由于扇形有角度，且形状相对不规则，对数据标签的文本长度包容度较低，环形更是如此。所以，当扇/环形分割过多、面积较小时，建议将数据标签显示在图形外部。

当然，我们也可以内外部结合使用：

e. 数据标签颜色

数据标签显示在图形内部时，图形为背景，数据标签为前景。此时，数据图形作为背景色，会影响到数据标签的显色度及易读性。

为了确保良好的可读性，我们通过对图形颜色 HS 值的判断，来决定文字的颜色。这样对比度就在可控范围内，不会出现可读性低的问题。

由于篇幅问题，剩余内容接下一篇文章展示

作者：布鲁星人
链接：https://www.zcool.com.cn/article/ZMTYzNzI0NA==.html
来源：站酷
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

评论(0) 浏览(123)

172024-10

从对话到嵌入：多元场景AI形态浅析

ui设计分享达人行业趋势

前言

当我们一次次被AI技术带来的变革所惊艳，当ChatGPT一次次宣布其能力已经突破了人类的想象，你是否注意到现有产品与AI融合的新趋势？值得注意的是，新技术的出现也一定带来了新的交互体验。本文将以多种产品场景为例，梳理PC端多种主流的AI融合形态，希望能给大家带来启发。

多元场景下的主流AI形态

目前主流AI产品有如下3种主要形态，分别为沉浸式的AI智能体(Agent)、伴随式的AI副驾驶(Co-pilot)、嵌入式的AI场景化嵌入(Embedding)。这3种形态在能力、界面、操作体验和适用场景都上存在显著差异。

一、沉浸式形态

AI智能体(Agent)—功能强大的AI伙伴

一个富有主动性的独立伙伴，输出的结果不完全依赖用户的输入，启动AI问询后有2种主流的形态：

①「对话智能体」以对话流的形式展示信息，用户通过在当前语境下进行追问获取最终结果；

②「目标智能体」用户输入指令后，一次性给予用户“靠谱”的结果，配有侧边栏可进行多种辅助操作。

1.对话智能体示例—Gemini

以谷歌Gemini产品为例，其作为对话流的智能体，为满足搜索场景，具有以下特征：

1）冷启页Prompt形象化

相较于2023年初Gemini冷启时的样式，最近改版中冷启的Prompt卡片变得形象化，当然我们也在其他Agent产品中观察到了这一变化。

2）多模态内容

理解用户的文字意图，依据要求自主生成多模态卡片是对话智能体的主要特征之一，该功能可以极大地丰富AI反馈的多样性，并能提高信息传达的效率。

3）信息索引的显示

信息索引的展示是提升AI回答权威性和透明度的关键因素。然而，直接在阅读内容中嵌入索引标签，可能在某些情况下影响用户的阅读连贯性。以Gemini为例，当前的设计允许用户在卡片下方手动启用索引信息，这种灵活性平衡了信息的可信度和阅读体验，适合多数日常场景。

当然，从设计角度考虑，某些情况下默认收起索引并非最佳选择。在用户高度依赖信息准确性的场景中，如金融或医学领域，索引的可见性将会直接影响信任感。对于深入研究或延展阅读需求较高的用户，即时查看索引能更高效地获取信息来源。

与之类似，在涉及多方信息传播的业务分发场景，清晰可见的索引有助于减少误解，提高效率。在这些情况下，索引的默认展开不仅强化了内容的可靠性，也更好地支持了用户的深入需求。

2.目标智能体示例—Perplexity

Perplexity作为最近广受好评的AI搜索工具，相较于Gemini，它更注重给予用户最精准的答案。基于RAG技术的Perplexity为用户提供了一种新的“确定性”，而鉴于这种特征，Perplexity拥有双面板的形态，可以对当前确定性的信息进行深化处理。

1 ）输入即结果

相较于Gemini等对话智能体产品，AI Agent用户需要反复追问结果，而在体验Perplexity时的无对话场景感，更倾向于一次性给予用户“靠谱”的答案。

2）侧分栏—信息补充

因为Perplexity一次就可以给予用户最“准确”的信息，用户可能没有追问的必要，但可能会有对于当前问答进行深度搜索的需求，这时会有右侧GUI分栏的出现，以便用户进行辅助搜索。

3.思考：给予用户最佳答案的AI形态

在使用体验上，Gemini与Perplexity虽然走向两个不同的流派，但目的都是为了给用户呈现最佳的搜索结果。Gemini就像一位富有想象力的对话者，用户在对话中通过不断地追问来获得最佳的结果，而Perplexity更像一个AI版的知乎，它坚持“用户不会犯错”原则，冷静客观地为用户提供最精准的答案。

二、伴随式形态

AI副驾驶(Copilot)—被动性的AI助手

这种形态下的AI更多扮演“副驾驶”的角色，为用户提供建议和帮助，依赖用户精准的指令对当前内容窗口进行操作，一般以侧边栏形式展示，目前的Office文档类产品多采用此类形态。

1.AI副驾驶产品示例-Office

在近年的开发者大会中，微软提到最多的词就是“Copilot”，力推将AI技术快速融入到旗下应用中。其中，Office软件就融入了AI副驾驶的理念，该形态下的AI主要为用户提供产品的创作辅助、信息的查询总结等功能。

1）当前场景下的AI助手

AI的能力默认被限定在当前场景下，满足用户问询、信息检索、创作辅助等操作。

2）被动性AI助手

Copilot无法自动执行操作去修改当前页面内容，需要用户确认后才可执行，用户执行操作后会在侧边栏内显示操作记录与撤销操作的入口。

3）辅助Prompt

由于AI副驾驶的特性，常常需要准确的Prompt才能执行符合预期的操作，这对大部分用户来说门槛较高，因此在使用时需要及时给予用户合理的联想Prompt，辅助用户决策。

2.思考：提高用户工作效率的AI助手

作为被动性AI助手，用户即使不使用也不会影响其在整体页面中的操作，AI更多承担的是提升用户工作效率过程中的辅助角色。

三、嵌入式形态

AI场景化嵌入(Embedding)

嵌入式AI主要聚焦特定场景的AI辅助，如AI即时性地生成对当前评论的回复，此类交互无固定形态，AI会在用户进行高频重要操作时即时触发。

在多元化场景中，嵌入式AI的设计相较于前两类更加灵活和轻量，通常以LGUI(轻量化用户界面)为核心，强调用户与AI之间的无缝衔接与高效互动。

与对话式或结构化阿拉丁模式相比，嵌入式AI的设计思路更加通畅，摒弃了复杂的交互流程，更注重场景中的引导性和即时反馈，帮助用户在合适的时机获取所需信息。

1.嵌入式AI示例—One Drive

以微软One Drive为例，嵌入式AI不仅会在用户整理文件时提供智能建议，还能在用户分享文件时根据历史记录和内容精准推荐分享对象。这种场景化的嵌入，展现了如何通过LGUI设计最大化提高效率，而非依赖传统对话或复杂交互。

场景一: 文件整理AI建议

在AI为相关文件创建新文件夹的情境中，执行完成后，它会主动询问用户是否需要将其他可能相关的文件一并移入到新建的文件夹中，以帮助用户进一步整理文件。AI能够基于文件内容的上下文，敏锐地判断出哪些文件可能属于同一类别，进而为用户提供便捷的一键整理服务。

场景二: 智能分享建议

当用户准备在One Drive中分享文件时，AI助手会根据文件内容和用户的历史分享记录，预测出最可能需要分享的对象名单，为用户精准推荐受众人员。智能分享建议可以极大地节省用户挑选分享对象的时间。

基于上述2个例子，我们可以对嵌入式AI有进一步的思考：

合理的嵌入式AI操作只在用户进行重要操作时被“激活”，能够在当前场景下即时给予用户建议；

嵌入式AI一般情况下点击大于录入，方便用户快速做出决定；

设计此类交互时，需要深度理解用户使用场景，AI的唤起不应干扰用户对于主流程的操作体验。

2.思考：效率导向的AI嵌入设计

对于普通设计师来说，容易在纯对话交互和结构化设计两端摇摆，可能忽视了效率也是设计的重要原则。嵌入式AI的设计启示在于“什么合适用什么”，既不过度依赖复杂的对话式设计，也不拘泥于结构化方案。关键在于聚焦场景需求，以最简便和有效的方式帮助用户完成任务。因此，在嵌入式AI的设计中，保持界面的简洁与流畅，同时结合轻量化的LGUI原则，才是提升用户体验的关键。最终目标始终是“效率”，无论采用何种形式，选择最适合当前场景的交互模式才是设计的核心。

未来的AI设计

多样化形态下的平衡与共生

随着AI技术的迅速发展，各种AI形态在不同场景中不断涌现，如上述讨论的沉浸式、伴随式、嵌入式等设计形态。无论是主动性强的智能体、辅助型的副驾驶，还是轻量化的嵌入式方案，每一种设计都展现出其独特的价值。

然而，在这些多样化的形态背后，我们仍需回归一个核心问题：什么样的AI设计才是理想的？

首先，没有一种AI形态能够完美适用所有场景，真正成功的AI设计应始终围绕需求展开。在效率为先的原则下，设计师需要深刻理解用户在不同情境下的核心需求，并选择最适合的交互形态。复杂的对话式和高度结构化的设计并非万能，嵌入式AI的灵活性和轻量化设计则为平衡提供了启发—服务于效率与体验，简化不必要的交互，专注于解决用户的实际问题。

其次，AI设计的多样性并不意味着割裂，而是指向共生与融合。未来，AI技术将进一步打破不同形态之间的界限，形成更加灵活、动态的交互模式。这种融合不仅依赖更智能的技术，还要求设计师在实际应用中敏锐捕捉用户需求，提供真正有价值的解决方案。

最后，设计的核心原则是以用户为中心，强调合适性，而非追求炫技。无论是大型智能体的复杂场景处理，还是嵌入式AI的场景化介入，优秀的设计应始终聚焦用户需求，在不同场景中找到最优平衡点。随着技术的进化，设计师需要更加专注于如何将AI技术自然、无缝地融入用户的工作与生活，使每一次交互都变得更加高效和愉快。

在未来，AI的形态将会更加多元，但不变的仍是设计师对效率、用户价值和场景适配的持续探索。希望设计师在面对AI设计时，始终寻求既符合用户需求又能提升效率的最佳方案。

作者：百度MEUX
链接：https://www.zcool.com.cn/article/ZMTYzMzkxNg==.html
来源：站酷
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

评论(0) 浏览(168)

172024-10

用户体验一致性思考

ui设计分享达人交互设计及用户体验

前言

在团队内部，我们已确立了一套设计规范，在日常项目中使用设计规范输出变的高效、统一。然而，在实际操作中，不可避免地会遇到一些特殊情况：某些客户提出的个性化需求并不完全契合既定的设计规范,这些促使我们不得不在保持设计一致性的基础上进行灵活调整。因此，深入反思并优化一致性原则的应用策略显得尤为重要。我们需要探索如何在坚守设计规范核心精神的同时，灵活应对多变的需求，确保设计既保持统一和谐，又能满足特定场景下的独特需求，从而实现用户体验与品牌价值的双重提升。

在UI/UX设计中，雅各布·尼尔森的十条可用性原则中，一致性（Consistency and standards）位列第四。这一原则强调在界面和交互设计上需要遵循既定的规则，无论是在应用内部还是跨平台之间。

背后的心理学原理——重复定律，强调了信息重复对于巩固记忆的重要性。正如赫尔曼·艾宾浩斯通过“遗忘曲线”所揭示的，信息的有效保留离不开重复接触。一致性的应用正是这一原理的生动实践，通过不断重复统一的设计元素与模式，强化用户对产品的认知与记忆，从而提升整体的用户满意度与忠诚度。

艾宾浩斯遗忘曲线

用户侧

1、用户学习曲线：

一致的UI/UX设计可以降低用户的学习曲线。当用户在应用程序或网站中遇到一致的元素、布局和交互方式时，他们可以快速理解并准确预测如何与界面进行交互。这减少了用户的混淆和困惑，提高了他们的效率和满意度。

2、提升可用性：

一致性使用户界面更加易于使用。当用户在不同的页面或功能之间找到相似的设计元素和交互模式时，他们可以轻松地将已有的知识和经验应用于新的情境中。这种一致性帮助用户快速完成任务，减少错误和迷失，提供更好的导航和流畅的体验。

3、品牌认可度：

一致的UI/UX设计有助于树立品牌形象和增强品牌认可度。通过在不同的渠道和平台上保持一致的设计元素、标识和视觉风格，品牌可以建立起独特而可识别的形象。用户在不同的触点上都能感受到品牌的一致性，从而增加品牌的信任和忠诚度。

4、用户满意度：

一致性直接影响用户的满意度。当用户在使用应用程序或网站时感受到一致的设计和交互方式时，他们会感到更加舒适和自信。一致性传递了专业和质量的信号，让用户感到被关注和重视。这种积极的用户体验有助于提升用户满意度，并促使他们持续使用和推荐你的产品或服务。

产研侧

1. 降低设计成本，提高开发效率

无论是设计还是开发，复用已有的组件资源，保持界面的一致性可以有效地减少设计的投入，避免不必要的设计分歧点。

而在开发阶段，可以避免重复造轮子，提高开发的效率，保证落地效果，也可以减少上线前设计走查、测试的工作量。

2. 形成一致的设计风格

根据原子设计理论，通过原子组件的一致性，可以构建出统一的界面框架、布局，形成统一风格和用户交互认知，从而更好地保证用户体验质量。

色彩

色彩作为一种兼具物理属性与感官享受的复杂现象，其本质在于光波在人体视网膜上的特定波长被反射或吸收后，所引发的视觉感知结果。在设计领域，色彩的选择与运用不仅是视觉艺术的展现，更是品牌身份与个性的直接体现。诸如饿了么标志性的蓝色、美团鲜明的黄色、以及京东热情的红色等，这些品牌专属色彩不仅构成了品牌识别系统的重要组成部分，还通过其高度的一致性，在视觉层面上构建起强烈的品牌认知，营造出统一和谐的视觉体验。

色彩的一致性策略在品牌塑造中发挥着不可估量的作用，它能够有效增强品牌的记忆度与辨识度，深化品牌形象在消费者心中的烙印，进而提升产品的市场吸引力和用户忠诚度。同时，这种策略还促进了设计元素间的和谐共存，包括按钮、图标、字体、标签、背景、以及关键视觉元素如Banner等，均能在统一的色彩体系下实现视觉上的连贯与流畅，极大地提升了产品的可用性、无障碍性，以及用户在使用过程中的整体满意度与交互体验。

字体

字体作为设计中不可或缺的核心要素，其独特性在于能够精准地塑造文字的视觉形象，涵盖形状、尺寸、粗细、字间距等多维度特征。这些特征共同构建了一种独特的文字风格，不仅承载着信息的传递功能，更在无形中引导着用户的视觉流程，影响着信息的接收与理解深度。因此，在设计过程中，合理选择与应用字体显得尤为关键。

字体类型的多样性，如有衬线字体与无衬线字体的对比，不仅体现了风格上的差异，还隐含了不同的阅读体验与情感表达。字体的粗细变化（如细体、常规、粗体等）更是能够强调文本的重要性层级，增强信息的层次感与可读性。此外，字重的调整也是塑造视觉焦点、引导视线流动的有效手段，对于提升设计的整体美观度和信息传达效率具有不可小觑的作用。

然而，在实际的开发与实现过程中，若不加节制地使用多种字体，不仅会显著增加页面的加载时间，影响用户体验的流畅性，还可能因风格不统一而导致页面显得杂乱无章，破坏整体设计的和谐感。因此，制定一套统一、规范的字体使用策略显得尤为重要。这不仅有助于提升开发效率，减少后期更新迭代的复杂度，还能有效避免资源浪费，确保设计作品在视觉上的一致性与专业性。

图标

图标作为用户界面设计中至关重要的元素，风格直接影响到用户的使用体验与对产品的整体印象。图标以其简洁、直观且富有表现力的特点，在快速传达信息、引导用户操作方面发挥着不可替代的作用。在设计中，图标的设计与应用更是需要精心考量，以确保其既能够准确传达信息，又能够与整体设计风格保持一致，从而营造出专业、和谐且易于使用的界面环境。

设计中视觉上保持统一包括图标的大小、形状、色彩以及设计风格等多个方面，能够增强用户的认知连贯性，降低学习成本，提升使用效率。相反，如果图标风格混杂，不仅会让界面显得杂乱无章，还会给用户带来困惑和不安，进而影响其对产品专业性和安全性的信任。

按钮

按钮设计应统一于项目风格，无论是圆形、矩形、圆角矩形还是特定形状，保持一致性是关键。统一的按钮样式不仅彰显专业性，还能增强用户信任，确保体验连贯。过多变化的按钮样式会扰乱用户界面，降低操作直观性，甚至让用户误以为自己已离开应用环境。因此，精心设计的统一按钮样式对提升用户体验至关重要。

排版

设计中的排版一致性对于构建高效、用户友好的界面至关重要。一致的排版不仅能够让用户快速适应和理解界面的整体结构，大幅降低学习成本，还能在用户心中激发强烈的归属感和安全感。这种熟悉感使得内容更加易读，用户能够自然地依照既定的视觉动线流畅地浏览页面，迅速定位并获取所需信息，从而显著提升信息获取的效率。因此，在设计过程中，注重并维护排版的一致性，是提升用户体验和界面有效性的重要策略之一。

操作流程的一致性

标准化流程

：确保用户在执行相似任务时，如购买商品、搜索信息或提交表单等，能够遵循相同的操作流程。这有助于用户快速适应并高效完成任务。

逻辑清晰

：操作流程的每一步都应符合用户的认知习惯和行为逻辑，避免让用户感到困惑或不知所措。

交互元素的一致性

按钮和控件

：确保按钮、输入框、下拉菜单等交互元素的样式、位置和操作方式在整个应用或网站中保持一致。例如，所有按钮都应具有相同的视觉风格和触发机制。

导航和菜单

：导航栏和菜单的设计也应保持一致，使用户能够轻松地在不同页面或功能之间切换。

反馈机制的一致性

操作反馈

：当用户执行某个操作时，应用或网站应提供一致且及时的反馈，如加载动画、成功提示或错误消息等。这有助于用户了解操作结果并采取相应的行动。

状态提示

：对于长时间运行的操作或需要用户等待的场景，应提供明确的状态提示（如进度条），以减轻用户的不确定感和焦虑感。

在任何维度上，一致性不应成为设计的唯一导向。设计，这一融合了艺术与科学的复杂领域，要求我们在用户体验的细腻雕琢、功能需求的精准满足、美学价值的深刻体现及技术可行性的严格考量间游走。

“一致性”作为设计策略，其核心使命在于优化用户路径，降低认知门槛，确保用户在多元界面中穿梭时仍能感受到连贯与和谐。当我们在与设计团队（包括工程师、产品经理等）沟通时，仅仅提及“一致性”可能并不足以说明其必要性和价值。我们需要更深入地阐述为什么需要保持一致性，以及它如何具体帮助减少用户困惑、提高用户满意度和忠诚度。

同时，我们应清醒认识到，“一致性”并不是万能的。在某些情况下，为了追求极致的用户体验或解决特定的设计问题，可能需要打破传统的一致性规则。因此，设计师需要在保持一致性和创新之间找到平衡点，根据具体情况灵活调整设计方案。

实际落地执行时，要根据产品定位、用户场景，结合业务功能来确定设计方案，不能为了一致而一致。

当我们遇到一致性问题时，还是需要从以下3个方面深入思考，做出准确合理的设计决策。

真实项目

在SaaS产品设计中，特别是面向B/G端（企业用户）时，满足不同用户角色（如普通用户与高权限领导）的需求是至关重要的。

管理端布局设计

普通简洁明了

：为普通用户设计的管理界面应简洁直观，聚焦于日常操作，如数据查看、统计和下载。

功能分区

：通过清晰的导航栏或侧边栏将功能区域划分开，如“数据概览”、“报表下载”、“任务管理”等，便于用户快速定位所需功能。

操作便捷

：确保常用操作（如搜索、筛选、排序）易于触达，减少用户点击次数和页面跳转。

首页版心定宽设计

固定宽度

：为首页设定一个合适的固定宽度（如1200px、1440px等），以保证内容在大多数屏幕上都能保持一致的阅读体验。

信息模块化

：将首页内容划分为多个卡片，每个卡片承载一个独立的信息单元（如数据报表、通知公告、项目进展等）。

视觉层次

：通过颜色、大小、阴影等设计元素区分卡片的重要性，引导用户视线，提高信息获取效率。

交互性

：为卡片添加交互元素，如点击展开、滑动查看更多等，增加用户参与度和页面活跃度。

位置差异性分析

根据「认知负荷>视觉负荷>动作负荷」理论，在页面中我们首先要让用户能够找到按钮，然后完成操作。

相对于弹窗，页面的空间更大，边界感偏弱，用户的视觉重心更容易停留在左侧表单内容区域。所以按钮应该紧随搜索条件，便于用户快速发现按钮。

区域用户已经形成下意识操作习惯,虽然区别于规范,只能打破,遵循客户需求

一致性是规则

“一致性”作为规则或手段，服务于提升用户体验的原则。规则与原则一致时，促进业务共识与用户价值；冲突时，原则优先。用户体验原则指导下的一致性，要超越表面控件统一，更在于产品决策与价值取向的一致。必要时，为更好的用户体验，可在规则上让步以实现原则统一。打破规则需慎重权衡，确保用户便利足以弥补理解成本，需长期全局考量。规则非僵化教条，而是引导我们谨慎创新的框架。

一致性的底线

无论从哪个角度，一致性存在的必要性都是毋庸置疑的。

对于关键的设计元素，如专有名词和颜色体系，保持一致性至关重要。这不仅有助于维护品牌形象，还能减少用户的困惑。

特定设计语言在特定场景下的变体应用，虽然可能带来一定的视觉新鲜感或针对性优化，但往往需要谨慎评估其潜在风险。一旦变体打破了整体设计的一致性，可能会破坏用户对品牌的熟悉感和信任感，甚至引发误解。因此，在追求设计创新的同时，必须确保这种创新是基于一致性的原则之上，以维持品牌的整体性和用户的良好体验。

拥抱复杂性

一致性确实不应成为设计师的避风港或限制创新的枷锁，而应是基于对业务深刻理解和多样化设计能力之上的价值选择。设计师的核心任务始终是满足用户的多样化需求和偏好，这需要他们细致入微地观察、理解并解决每个用户的独特问题。

在追求一致性的同时，设计师应保持“第一性思考”的能力，即回归问题的本质，从用户需求出发进行创新设计。多样性页面的产出，不仅体现了设计师的创造力和灵活性，也是提升用户体验、增强产品吸引力的关键。

一致性与创新设计并非相互排斥，而是相辅相成的关系。真正的一致性不应导致单调或拒绝创新，而应是在遵循品牌或产品核心价值的前提下，鼓励设计师在细节和体验上不断探索和突破。当设计师感到被既定规则束缚时，应勇于质疑并重新评估当前的规范，确保所谓的“一致性”不是刻板的伪命题，而是真正符合用户需求和品牌发展的价值导向。

因此，设计师应时刻保持开放的心态和敏锐的洞察力，不断探索和尝试新的设计方法和理念，以更加灵活和创新的方式实现一致性与用户需求的完美融合。

重要的设计原则

「一致性」作为设计领域中的一项基础性原则，其重要性不言而喻。它不仅为设计过程提供了稳固的基石，还显著促进了开发效率与产品体验的全面升级。在设计实践中，一致性确保了界面元素的统一性和连贯性，使得用户能够迅速熟悉并掌握产品的使用方式，降低了学习成本，增强了操作的直观性和便捷性。

灵活变通使用

一致性原则并非一成不变的强制规定，而是需要根据产品的具体定位和市场环境进行灵活变通的应用。不同的产品可能面向不同的用户群体，拥有独特的品牌调性和功能需求，因此在追求一致性的同时，也需充分考虑这些因素，确保设计既符合品牌特色，又能满足用户的实际需求。

提升用户体验是价值所在

一致性的真正价值在于其能够显著提升用户体验。通过遵循用户的认知和习惯，设计师能够创造出更加自然、流畅的操作流程，使用户在享受产品功能的同时，也能感受到品牌所传递的舒适与和谐。因此，在追求设计一致性的过程中，我们始终应以人为本，将用户的体验和感受放在首位。建设有兼容性和长期价值的的一致性框架，在一致性中做到有用户价值的设计，是设计师应该不断探索的命题。

作者：cheny米鱼
链接：https://www.zcool.com.cn/article/ZMTYzNTAzNg==.html
来源：站酷
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

评论(0) 浏览(141)

172024-10

打动人心的直觉设计

ui设计分享达人

前言

之所以对“直觉设计”产生兴趣还要源于我们每次的设计评审，在跟其他设计师还有我们的业务方沟通时，大家常常会问到的且令人印象深刻的问题是：

“用户怎么知道点哪里？”、“这符合用户直觉吗？”

类似的灵魂拷问涉及到用户使用工具产品行为流程的每一步操作。作为设计师大家有时也会心生质疑，“这么明显用户注意不到吗？这么简单用户不可能不会操作吧...”。

但是随着我们的”新手体验官活动“的逐步进行，当亲自站在用户面前观察用户是如何操作和理解工具时，我们渐渐意识到小白用户

接触-认知-使用工具

的每一环都是至关重要的，即便是一个交互细节的设计都有可能带来认知和操作层面受阻，从而劝退用户。

因此，我们想去了解什么样的设计是符合用户直觉的，是易用的，同时也想去了解主流3D建模软件的核心建模逻辑（SU、Revit为代表）--于是开始了“直觉设计”的研究以及“建模课程”的学习。

1、什么是直觉设计？

首先来看什么是直觉设计，直觉设计是指用户无需进行有意识的思考就可以立即理解并知道如何去使用产品。国外有不少的用户研究机构也专门定义过直觉设计：

“在特定任务的背景下，技术系统可以直观地使用，而特定用户能够有效地交互，而不是有意识地使用先前的知识。”– 用户界面的直观使用 (IUUI) 研究小组。一个由跨学科研究人员组成的团队，致力于探索如何定义直观的使用和界面。

为了方便大家更好的理解直觉设计，我们先来看几个例子：

案例1-玩具收纳：小朋友在玩完玩具以后，把玩具摆的到处都是，如果发号施令告诉小朋友“去把玩具收拾起来”，小朋友通常不会去收拾。如果将收纳设计成为一种小游戏，小朋友会自然而然的参与其中并且会觉得非常有趣。

案例2-公共环境卫生：保持小便池的清洁，张贴告示语“注意保持清洁”大多是没有用的。荷兰的设计师在公共的男士小便池里设计了一个“苍蝇”，利用人们的嫌恶心理会发现小便时会不由自主的对准中心的位置，从而减少尿液四溅，维护公共环境卫生。

案例3-公共设施：设有传感器和扬声器的台阶，人们只要踩上去就能听到音乐声，从而达到鼓励人们爬楼梯的目标。

案例4-工业产品设计：很多耳熟能详的工业产品中也运用了直觉设计，例如深泽直人的CD播放器，Apple的Vision OS系统等等。

案例5-游戏设计：游戏中非常多的运用了直觉设计，比如超级马里奥，塞尔达，想必大家都深有感受。

通过上述案例我们发现其实直觉设计传达出来是信息包含两方面：用户看到就能够理解是什么，且能够不由自主地产生行动。

看到这里，大家可能会好奇为什么会产生这种”直觉设计“？接下来让我们一起来看看直觉设计是如何产生的。

2、直觉设计如何产生？

人的直觉设计是怎么来的？是天生的吗？带着这样的疑惑，我们阅读了相关书籍和文章。

先天视觉和经验直觉

先天直觉，也可以说是”本我“，是最原始的”心理现实“，在个体从外部世界获得经验之前就存在的内部世界，不需要经过学习或训练。比如婴儿时期的特征，希望立刻得到满足、躲避痛苦、强大的求生意愿等。

经验直觉，巴普洛夫的实验想必大家都知道。有机体能够把已有的经验迁移到新的学习环境中去，从而扩大学习范围。

先天直觉一般对应于人类的第一信号系统，是建立在人的直接感觉上的，通过人的感觉（视觉、听觉、触觉等）而进行的一种思维活动；经验直觉（逻辑性直觉直觉）思维虽然利用了人类的感性认识（感觉、知觉、表象等）形式，但它绝不是仅仅停留在这一步上，而是超越了逻辑思维形式达到了更高一个层次上的思维。

从表面上看，逻辑性直觉的结果是以直观的形式表现出来的，实际上它已经在头脑中进行了逻辑程序的高度压缩，迅速地越过了“理性认识阶段”，是简缩了整个逻辑思维过程的一种思维形式。

所以，逻辑性直觉既源于感性认识，又高于感性认识，是一种常常能在极短的时间内完成，并能够对问题迅速作出回答的一种无意识的、跃进式的直觉形式。

构建直觉，现有研究指出，分析加工和直觉加工两者可能处于不断的相互转换之中。一方面，分析加工可以通过熟练化形成经验图式，从而减少认知资源的消耗，并由此转化为直觉加工；另一方面，当直觉加工无法通过已有经验解决新的问题情境时，又需要调动更多的认知资源并转向分析加工，直到形成新的经验图式。

先天直觉大家都容易理解，接下来我们重点看一下经验直觉是如何产生的？

经验直觉的产生与人生存的环境密切相关，所以这里包含两个关键点：物理世界（环境）和生活环境。

来自物理环境的经验

物理环境主要包括我们生存的自然环境，以及我们与物理环境的互动所形成的感官运动。人类在婴儿时期就开始体验和实验物理环境。这种体验建立在我们第一次拿着一个物体、第一次把它扔到地板上、第一次学会爬到我们最喜欢的玩具等时学到的基本感觉运动技能上。我们对物理世界的体验它已成为日常生活的一部分。经过物理环境互动所形成的直觉是跨越国界、且不会被遗忘的。

来自文化环境的经验

通俗的讲指社会文化环境。它包括人类通过其获得的知识和技术开发的所有物质文化元素。例如，房屋、村庄、城镇、公路和铁路网络、交通方式、工业单位、田野、医院、体育场馆、娱乐设施、市场、港口以及日常和特殊用途的物品。除此之外还包括价值观念、道德信仰、语言、符号、审美观念、风俗习惯等各种规范。

例如播放图标“►”是许多文化中的人们在年轻时学习符号的一个很好的例子。在任何可以使用媒体播放器的文化中，人们都知道 ► 图标的含义。它的直观性几乎与物理世界中的对象行为一致。

因此，在媒体播放器中，人们理所当然的希望可以延续“►”符号的含义。来自文化环境的知识也可以变得很直观，但是由于没有来自物理世界的持续提醒之后，很容易被遗忘。

因此在提供直觉设计时，应尽量符合用户从物理世界中获得的经验与技能。但如果我们的用户群体是具有相同文化背景下的人群，符合文化环境的知识与经验也可以作为直观设计的决策依据。

3、为什么要符合直觉设计？

给用户留下良好的第一印象，助力产品赢得并且留下用户。

当我们开始使用某款产品时，用户往往在几秒内就会产生第一印象并且往往会保持不变，少则几分钟多则十几分钟用户就可感受到产品的价值。

渥太华卡雷顿大学的Gitte·Lindgaard和她的研究小组发现：人类对事物的初始印象在50毫秒内就会形成。研究小组准备了一批要么极易入眼要么混乱不堪的网页，让一批志愿者在快速变换中投票。虽然这些网页以50毫秒每张的速度一闪而过，但是研究发现他们的评价与长时间观察后的结果基本无异。

这就说明了用户的第一印象非常明确且重要，帮助用户判断出这是否是一个设计合理的网站。如果用户停留时间再长一点，那么用户足以判断出网站上的信息是否是满足自己需要的信息，从而影响用户是否继续停留下来去使用该网站。

更容易让用户达到心流状态、沉浸式的使用产品，并且持续吸引用户使用产品。

符合用户直觉的、熟悉的操作模式，作为用户直观使用的基础，更容易产生积极的审美评价。相反，如果用户的认知流畅性受阻，则不太会产生正面积极的评价。简洁有力的设计会促使用户再次使用产品，是保持产品吸引力的最佳方式。

4、如何使设计符合用户直觉？

因为工作中涉及到3D建模软件的设计，所以这部分将结合3D建模软件来探讨。

如果您接触过3D建模软件，一定用过SU、Rhino吧，我们在使用后不久，就能清晰的感受到它们的核心逻辑，比如SU的推拉，Rhino的曲面建模等，进而能够举一反三的学会相关功能，使软件的学习变得更简单更直觉。那么怎样的功能设计才能打造出软件的核心逻辑，让其在使用时更加符合用户的直觉？

为了得到以上问题的答案，我们进行了SU和Revit这两款建筑领域主流软件的使用，感受两款软件在直觉设计方面的表现，进而找到了一些设计原则指导我们在实际业务中应用。

充分了解你的用户

每个人在自己生活的世界里，都会形成自己的一些认知，这个前面也已经介绍过。所以要充分了解用户的知识、技能、经验，尽可能减少用户当前具备知识与完成目标所需具备的知识之间的Gap。当用户已具备的知识和完成目标需要的知识之间的差距越小，越符合用户的直觉，越容易实现目标。

SU和Revit都是充分了解自己的用户，基于用户群体的知识、技能、经验等特点，去打造自己软件的核心逻辑，符合目标用户群体的使用直觉。

▽

SU的Slogan 是“3D for Everyone“，人人可用。他的用户群体非常广泛，所以它是一个业务属性较弱的工具，界面设计和操作使用上更简单，普适性和灵活性更强。使用面作为基本单元建模，推拉面成体，推推拉拉就可以快速完成建模。对于小白来说很容易上手。

Revit

▽

Revit的用户主要是专业的建筑师，场景聚焦在建筑相关领域，所以它是一个业务属性较强的工具，将更多的业务场景包含在里面。比如标高、工作平面以及模块化的构件等，这样的设定对于建筑背景的用户来说，可以更符合他们的已有认知。

将从物理世界和文化环

前面反复提到过过，用户总是利用她在物理和文化环境中的经验来了解她通过界面可以采取哪些行动。因此我们需要熟知用户已有的这些经验，并考虑到设计中。

通过联想或类比，将物理世界的经验运用到数字产品设计中，使得全新的事物变得熟悉。

▽

SU的图标非常直观好懂，比如画笔、橡皮擦、油漆桶、量尺、放大镜、材质刷、垃圾桶等等，图标的语意和其在物理世界的功能是相符的，哪怕是第一次接触建模软件的人，只看图标也能大概猜出对应的功能。

Revit

▽

Revit将物理世界中房子映射到设计中。比如像墙、门、窗、柱、屋顶等，这是作为一个房子基本组成结构，对于建筑师来言，非常熟悉。所以在软件设计中，功能也是基于这种具象的构件分类的，在用户使用之前，内心已经有了房子的认知，从而也能在产品中找到对应的功能，理解成本很低。

结合用户在已有的文化环境中获得的认知与经验：比如在类似产品中或你的产品所教给他的一些知识、经验，并保持这些经验的一致性。

▽

很好的匹配用户已经存在的认知。提及SU就会想到它的推拉交互，推拉面成体。一方面它底层的点线面逻辑是我们学习数学或绘画最基础的知识，几乎人人都知道；另一方面推拉的操作也是和我们已有的推敲形体的过程体验是一致的，我们在绘制草图时，会在纸上勾勾画画，涂涂抹抹，这跟在SU上推推拉拉有异曲同工之妙，我们使在用它时能够享受手绘一般的乐趣，很难忘记这个操作。

Revit

▽

同为Autodesk公司产品，Revit的用户与Autocad有着大量的重叠，因此在交互上也延用了不少CAD的固有逻辑，将用户在CAD获得的认知与经验沿用在这里。与AutoCAD一样，Revit快捷键

也

是该命令英文单词的第1个或前面2个字母，这使得用户无需再学习。

以及为了让用户切换软件成本最小，Revit中还支持一个指令可以设置多个快捷键，这样可以兼容喜欢自定义快捷键的高阶用户的习惯。例如在AutoCAD里习惯用Ctrl+1 呼出属性面板，而如果按 Revit 快捷键的逻辑则应该是"属性"英文取用 PP，对于已熟悉AutoCAD操作的用户来说，这么高频的指令改变会造成极大的不适应，默认兼容多个快捷键就是非常优雅的解法。

用户认知和行为要足够简单

关于1+1=？，大家看到后会自然而然的想到答案；28×4=？，稍加思索也能给出答案；那么3927÷23=？，看到这个问题，可能几乎没有人想要解开了。有些问题无意识的解开了，有些问题看到就想放弃解答。由此可见改变人们行为方式的通常是能否足够简单和容易，当眼前的问题复杂时，人们不会试图解决它。

▽

吸附非常的自然。当我想移动到某个位置的时候，很自然将鼠标靠近目标对象，就会帮我精准的吸附到对应的位置

补面非常简单。当形体发生破面的时候，自然的想要绘制线去补全，当我沿着要补全的路径绘制两个点的时候，整个面被补好了。

5、实战：应用最佳设计原则

将我们在建模软件中学习到的有助于直觉设计的内容进行总结，得出几条原则，并将这些设计原则应用到实践当中，指导我们进行设计。

心理学中也提到，人的大脑处理不同的信息时所消耗的脑力资源是不同的，他们的排序是认知>视觉>行动。用户花费的脑力资源要多于点击按钮或移动鼠标时（动作负荷）。所以我们在设计的时候，首先要从认知上降低用户的认知负担，其次在行为上确保操作丝滑顺畅。

认知上，降低认知负担

提升信息的识别性。

比如位置、信息分组的逻辑、颜色、比例等的使用等。作为别墅设计软件，在进行功能分类时，要以用户使用的流程、场景，识别的效率等为依据进行合理分组。

提高和用户已有认知的匹配。

作为别墅设计软件，设计要与用户已有的对别墅对房子的认知相匹配。比如檐口线、浮雕、墙裙等构件，人们在现实中的房子中都会见到，只是不熟知这些叫法。因此我们采用建造一个真实小房子的做法，当用户点击某个构件，对应的构件就会在房子上高亮，用户瞬间就会明白，哦原来是它，跟已有的认知匹配上了，会有一种恍然大悟的感觉。同时也让用户大概知道这个构件位于房子的哪个位置，对后续的操作有预期，知道要摆在哪个位置。

保持医学认知的一致性。

任何产品都很难做到匹配用户已有的所有认知，总会有一些内容是需要重新学习获得的，那么就要保证我们教给他的这些认知逻辑始终一致，让用户能做到举一反三。作为别墅设计软件，用户要完成一个完整房子的建造，需要用到20+的构件模块，我们希望用户学会使用一个构件之后，就不需要再学习，能触类旁通的使用同类构件。因此归纳出通用操作流程，找到相对统一的方式，串联起我们用户的心智。

行为上，让操作丝滑顺畅

提供场景化的行为设计，并将操作聚焦在手边。

在我们的别墅设计软件中，当用户要修改老虎窗和飘窗的时候，如果看到这个窗户的样式不是自己想要的，可能会想去绘制。按照我们现有的流程，用户要先去左侧面板找到自由绘窗入口，然后再选择要在哪个面上绘制，操作流程是有点绕的。后面我们就想，用户要修改这个窗子的时候，直觉上会去点击它，那么在选中这个对象的时候，在手边提供自由绘窗的入口，让他能够快速的绑定这个对象去绘制窗户，操作上顺畅了很多。

一次只聚焦做一件事情，减少其他干扰。

我们现在的大部分操作，都是是激活命令后，左侧面板还在。观察到很多新用户在激活了功能后，不知道下一步需要干什么。因为界面上需要他关注的事情太多了。所以，我们尝试用户在激活功能后，将当前步骤中不需要他关注的面板隐藏，聚焦到他当前需要做的事情上面去。

操作要足够简单，简单到不需要有太多思考，是一个自然而然的行为。

以下介绍的是我们的照片还原功能，对于外墙漆、门窗等用户，他们可以现场拍好房子照片，导入后基于照片还原出别墅方案，再进行后续的外立面和门窗设计。最初，我们需要用户手动摆放两组消逝线去确定透视角度、然后调整比例尺、在尺子上选取点划分楼层、拖拽点调整边界、通过输入开间数量确定开间。整个过程比较复杂，也涉及很多专业的概念，用户不知道该如何操作。

后面优化后，我们结合算法识别出照片中的房子，默认给一个box,用户通过拖动box上的角点和边线去调整整个形体。因为用户对box的概念是熟悉的，拖拽box去拟合背后的照片就变得容易的多。楼层和开间的划分也采用这种切豆腐块的方式，用户一下一下去切就好。不用再去输入数字，想象会是什么样子。而比例尺只需要用户输入他想要的1楼的高度即可确定。优化后，生成方案的转化率提升了将近20%。

6、小结

直觉设计需要用户看到产品时产生一种熟悉感，但是这种熟悉感判断起来并不简单，其中一部分人熟悉并不代表所有人都熟悉。所以设计师需要充分了解他们的用户，了解产品的市场，并充分获取用户熟悉内容的信息才有助于作出符合直觉设计的决策。

做出符合直觉的设计是困难的，需要充分考虑用户在物理世界和文化环境中获得的知识和经验，并将其应用到具体的设计实践中，也就是用户的心智模型和产品概念模型达到基本吻合甚至去塑造与产品概念模型一致的用户心智模型。

苹果公司创始人兼前首席执行官史蒂夫·乔布斯解释说：“我们设计中最重要的是，必须让事情直观明显。

建议每一位设计师同学也多去感受和认识自己的知道，尤其是首次打开某个网站时，要更加关注自己的视觉动线和心理感受、无意识产生的操作行为等。同时也不要让竞品变成你的直觉，始终去思索有没有体验更加友好、创新的交互方式。

当然，连续的直觉操作也可能会让用户觉得疲倦，可以适时考虑引入惊喜设计，为用户打造Amazing的感受。

去认识和感受自己的直觉
不要让竞品的设计变成你的直觉
连续的直觉设计也可能也可能会给用户带来疲劳和厌倦，需要考虑在适当的时候给用户进喜设计。

本文在以下书籍和文章中予以引用，同时也推荐大家阅读，想必大家对直觉设计会有更加深刻的认知和理解。

注意：文中数据皆为演示数据，非业务真实数据

参考书籍：

《创意选择》
《福格行为模型》
《一目了然-Web软件显性设计之路》
《峰值体验-影响用户决策的关键时刻》
《任天堂的体验设计-创造不知不觉打动人心的体验》
《玄机设计学：改变人们行为的创意构思法》

参考文章：

Intuitive UX design an approach beyond usability
https://uxdesign.cc/the-power-of-intuition-designing-beyond-usability-2899cb37f98a
https://www.interaction-design.org/literature/topics/intuitive-design
Intuitive Web Design: How to Make Your Website Intuitive to Use

作者：蓝胖、瑶一

作者：群核科技MCUX
链接：https://www.zcool.com.cn/article/ZMTYyNTkwMA==.html
来源：站酷
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

评论(0) 浏览(135)

172024-10

善用设计洞见，提升设计效用

ui设计分享达人

引言

好的设计师不仅仅要有专业能力，更重要的是与产品达到同频，最终更好赋能业务指标达成。

目前设计行业的现状，大部分设计师还停留在设计思维的角度，存在一些和业务格格不入的情况，只关注好不好看，做一个交互原型的美化者...

自己做了很多，但是与实际脱节。出了很多个方案，产品（或运营/商务伙伴）觉得没什么变化；打磨了很多细节和创新点，产品却只想快速上线……

设计师自己的工作被各种“非专业”的指导意见干扰；而其他职岗伙伴眼里，我们的付出，却变成了一种“设计师的自High”。

究其原因，还是把以用户思维去进行设计。

想要改变这样的状态，最核心的是思维转变，从技能导向的思考方式变为价值导向的思考方式。

本文主要从讲述，如何通过方法，在项目进入期获得有效设计洞见，提高设计效用，带来客户价值（用户价值）。

什么是设计洞见？

先举一个例子：如何做一个新款剃须刀产品？

飞利浦这些大公司，给出的答案是更好的刀头，更贴合面部，更安全和更容易清洗，一个黑灰塑料材质、工业风格的“更好用”的剃须刀确实诞生了。

但是有一个很有意思的公司，给出了另一份答案：极简造型、合金材质、超 mini 尺寸和丰富配色，最重要的是：

于是 2019 年，这个疫情开始的时间，这家剃须刀横空出世。

这款产品获得成功的原因，本质上就是产品的设计者带着更高、更广的视角，洞见了“剃须刀不仅是一个工具，它更可以成为一种礼物”这个更深层次的客户需求，打破现有市场概念，获得成功。

——如果说，设计洞察是发现和理解问题的能力，是设计师在研究和解决问题时所产生的观察力和创造力。那么设计洞见可以帮助设计师更好地识别问题、提出创新解决方案，并为设计师提供思考问题和做出决策的指导。

Brown.Tim在《设计思考改造世界》中说："未来的设计师将扮演科技的诠释者（洞见能力）,人性的引领者（观察能力）,感性的创造者与品位的营造者（同理心）的角色"。

通过设计洞见，可以让我们看更高、想更全，与业务贴合更紧密，让设计得到认可，产生业务共鸣，赋予用户/客户价值，才能让设计变的更有价值。

如何获得设计洞见？

接下来我们将通过一一探索获得洞见的三个阶段。

第一阶段：设计洞察

洞察阶段的核心，是获得现象背后的动因。是一个获得信息与问题的阶段

产品的设计产出是一个抽象到具象化的过程，在设计和迭代的过程中，会经历非常多的流程。而大多数的设计洞见有效过去在更前置的节点，才能产生更有效的价值。

所以我们首先做的是：“提升设计的主动性”，在项目的进入期最大化实现设计洞见的价值。

项目进入期通常会有一个通病，即问题泛化，无法具象。在一个比较“泛”的问题下，挖掘目的/目标，找到问题最简单的办法就是“调查分析”：了解行业生态与业务背景，确定或推测自身产品的发展方向，分析定位与关注指向-Pointer（即当下会产生哪些具有指向性的任务方向）。

这个阶段，我们的主要目的是通过最初始的源头数据，正确的了解业务或者项目的背景，避免因信息传递所产生的认知误差，以免发生“指向”偏差。而要做到这一点，洞察就不能仅仅停留在表面的观察，询问，记录和数据分析，而要随时通过联想和反思来回归本质——客户（用户）和场景。调查中获得的数据只有放在合适的情境中才能获得准确的解读。

1. 知识准备

了解各种市场调研的方法与过程，对调研方法进行分类。

如下图所示，（戴力农《设计调研》）横轴区分了该方法得到的数据是客观的（人们的行为）还是主观的（人们的目标和观点），纵轴区分了该方法的类型是定性的还是定量的。

2. 选择正确的调研办法

不同的产品生命周期，对应不同的调研方法，根据产品的不同时期选择合适属性的调研办法。

互联网设计师的常规调研手法，受困于资源，多是在桌面进行。我们通过二手资料研究、竞品和线上走查获得问题，进行虚拟对象的研究，极易发生偏差。

拓新场景和成长初期，通常资源紧张且缺乏具象客户，很难进行大样本调研数据挖掘。对于设计师来说，在了解业务信息，对称业务方向时可以依赖其他职岗提供的资料进行研究；但是对于设计息息相关的关键点，建议还是通过自己实地考察、焦点实验去获取真实的体验信息。

成长后期与成熟期，关键在于保证和提高产品质量，缩短与头部产品之间的差距，实现产品的高增长。大样本的用户与竞品调研可以帮助我们更可观的看到真实的客户需求。再输入到我们的日常桌面研究中去。

3. 掌握信息收集、数据统计分析方面的知识

4. 了解调研的流程

确定调研目标 → 制定调研计划 → 准备调研材料&环境 → 邀请调研对象&执行调研过程 → 分析整理信息与数据 → 输出调研结果。

调研的实际操作流程在数据采集和调研分析方法中已经涉及的比较多了，也有很多好的执行案例可供我们学习与参考。

得到大量信息，进行吸收、理解和处理后，我们将收获大量的问题。接下来就是如何解决问题。

第二阶段：定位价值

定位价值是洞见的关键阶段，是能给业务带来价值的核心，是可以改变客户（用户）习惯和行为的关键博弈。

那么如何定位价值呢？

1. 问题整合，提炼与确认指向

将调研获得的问题进行归纳与整理，如简单的 Card Sorting ，确认所有问题的核心指向（Pointer）。

接下来就需要不停的切换指向，并深入每个关键 key 下进一步拆解，确定你收获的是否是一个真正且重要的 Pointer。

EG 海底捞 ▽

餐厅高峰期经常人满为患，排队体验差。常规餐厅的做法：约束更快的出餐、收台，拆分更多的餐位，引导拼桌服务等等等等..短期可能会带来改变，但是达到一个极限点以后，就很难再提升了。

类似的场景还有曾经的外卖小哥：30 分钟以内还能更快吗？答案是：很难。

那怎么让客人愿意多等待一点，或者不觉得“等待完全是无价值无意义的”？

海底捞选择在你排队等待的时候，提供免费美甲、护手、零食等等各种周到服务，让客人等待的过程中不至于无事可做。获得了认可，赢得了口碑。

如果你留心观察，你会发现海底捞的标志也是用了一个打招呼的气泡Hi，来强调服务为先的品牌定位，解决的是情感需求中的「过程体验」。

2. PDS（问题-检测-研究）调查分析

PSD 调查分析的核心思想，是调查客户（用户）与预期（行为/认知）的偏差，或不满与问题来发现洞见。

EG BBDO反烟推广 ▽

BBDO 的英国公司层接到过这样一个推广任务：是让年轻人，特别是十几岁的小女孩儿戒烟。

其实这个问题特别棘手。一方面，吸烟是一个生理上瘾的事情，要戒掉很困难；另一方面，吸烟最大的问题是有害健康，但是对于年轻人来说在这个角度的感触不深，很难起到效果。用常态的思考模式似乎很难找到正确的解决方案，但是借助洞见以后就不一样了。

通过了解更多事实，看目标群体关注什么，哪些问题对我们要实现的目标有影响。在这个案例里，BBDO的做法是派了一个年轻的女助理在购物区找了一家咖啡馆，连着5天坐在那里听那里的女孩儿在聊些什么。

结果这5天内她就发现，这些十几岁的女生大部分聊的是买衣服、做头发、选什么样的指甲油和减肥药，怎么整容等等。当女助理把这些内容列在自己的本子上的时候，洞见就自己呼之欲出了：原来对于这些无所事事，十几岁的年轻女孩而言，没有什么比她们看起来漂亮更重要了。

因此，你不需要告诉她吸烟可能缩短寿命，你只要告诉她一件事情：“吸烟会让你变得难看”，就足够让她戒烟了。

所以，想要获得洞见，就去调研目标群体真正关注的事情。当你通过调研发现真正的问题时，洞见往往就会产生。

3. 规避技能导向

设计的职岗角色是单薄的。我们一定要带着指针与方案，多职岗评估价值与可执行度，这是一个设计前期任务的过程。它的输出可能为设计Demo、简单的笔记、方案的列表，或者是一个说明效果的故事版……不一定具备完整的落地性，但是可以让伙伴更好的理解你的观点。

第三阶段：系统输出

设计的解决方案要从起心动念、贯穿至产、研、运营甚至上市宣传的全路径方案。

在分析阶段我们通过“3步走”的视角思维，明确了任务重点同时帮助我们明确不同指针的优先级。

设计师要考虑的维度不仅仅在用户体验层面，更应在执行时候要考虑业务的实际需求，考虑上下游不同职能的工作内容，始终保持全局与系统的思维，要从客户价值出发，回落到企业成本中去。

通过设计洞见，从更本质的层面去洞悉问题，重新定义和设计任务。

与业务产生共鸣才是好的设计。

让你的设计方案保持在更高、更广、更全局的维度。真正融入和助力业务，提升设计的效用。让“提升体验”这件事真正落地。

改变我们看世界的方式，亦改变世界看待我们的方式。

作者：群核科技MCUX
链接：https://www.zcool.com.cn/article/ZMTYzNjkxNg==.html
来源：站酷
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

评论(0) 浏览(81)

192024-9

以B端小二拣货场景为例 - 视觉思维在交互体验中的运用

ui设计分享达人

在当今时代，现代 UI 用户交互体验设计具有极为重要的地位。它绝非仅仅局限于单向的视觉设计，也不是单纯地围绕用户的可用性进行研究设计。实际上，如今的 UI 用户交互体验设计已经对视觉与可用性操作提出了更高层次的混合化要求。

对于现代的 UI 设计而言，我们需要从多个角度进行更进一步的深入解读。这不仅涉及心理学方面，去探究用户的心理需求和行为模式，以便更好地满足他们的期望；还涵盖视觉设计领域，通过精心打造的视觉元素，吸引用户的注意力并传达有效的信息；同时也不能忽视交互设计，确保用户在与界面进行互动时能够获得流畅、便捷的体验。

而将视觉思维理论应用于新一代的 UI 交互设计，则具有重大的意义。通过这种方式，用户能够凭借敏锐的视觉，灵敏地捕捉到屏幕上的信息轨迹。大脑可以快速地从不同抽象平面水平上获取意象，实现表象形态感知与抽象思维的紧密连接。这样一来，用户便能够高效地获取有效的视觉信息，从而提升整体的交互体验。无论是在工作场景中还是在日常生活中，一个优秀的 UI 交互设计都能够为用户带来极大的便利和愉悦感。

今天我们先介绍下理论知识，然后将产品设计案例结合（视觉思维分析模式的具体应用方法）来告诉大家怎么应用，希望可以帮助到大家。

开始话题前我们需要了解格式塔心理学是什么

我相信格式塔心理学大家都听过，主流对于格式塔心理学的观点是：格式塔心理学强调经验和行为的整体性，认为整体不等于部分之和，意识不等于感觉元素的集合，行为不等于反射弧的循环。它主张心理现象最基本的特征是在意识经验中所显现的结构性或整体性，反对构造主义心理学把心理现象分析为简单的元素，认为心理现象是一个整体，一种有组织的完整结构。

主要原则

1.接近性原则

在知觉过程中，距离相近的物体容易被知觉为一个整体。例如，在一张纸上分布着一些点，距离较近的点更容易被看作一组。

接近性原则图例

2.相似性原则

具有相似特征的物体容易被知觉为一个整体。比如，颜色、形状、大小等相似的图形更容易被组合在一起进行认知。

相似性原则图例

3.连续性原则

在知觉过程中，人们倾向于将具有连续性的物体知觉为一个整体。例如，一条曲线即使中间有部分被遮挡，人们也会倾向于将其看作是连续的整体。

连续性原则图例

4.闭合性原则

人们倾向于将不完整的图形知觉为完整的图形，即通过心理上的补充使图形达到闭合。比如，一个有缺口的圆形，人们往往会自动脑补出完整的圆形。

闭合性原则图例

对设计领域的影响

以上是大家所了解对的，而对于设计于界面设计、图形设计、用户体验设计都有影响：

界面设计：在网页设计和移动应用界面设计中，格式塔心理学的原则被广泛应用。例如，通过合理布局元素，利用接近性和相似性原则将相关的内容组合在一起，使用户能够更快速地理解和操作界面。颜色的相似性可以用来区分不同的功能模块，提高界面的可读性和易用性。
图形设计：设计师常常运用闭合性原则创造简洁而富有吸引力的图形。利用连续性原则可以引导用户的视线，创造出动态和富有节奏感的设计作品。
用户体验设计：格式塔心理学有助于设计师理解用户如何感知和理解复杂的信息环境。通过创造整体的、有组织的设计，可以提高用户的满意度和使用效率，减少认知负担。

界面设计图例

鲁道夫・阿恩海姆的格式塔心理学理论中提出了四种 “力” 的概念，GUI 设计师对其在界面中的角色进行了深入阐释。

第一种力是由视觉对象的外在形状和构造所生成的力。

例如，独特的图标设计通过其具象的形态传达出明确的语意，让用户能够迅速理解其功能。这种力如同一个无声的向导，引领用户在界面中准确地找到所需的操作。

第二种力是物体间或物体各部分之间的聚合张力。

它虽有强度但没有特定方向，就像界面中各个元素紧密结合，形成一个有机的整体。各个组件相互呼应，共同营造出和谐统一的视觉氛围，增强了用户对界面的整体认知。

第三种力是在视觉对象中知觉到的有方向性的张力。

其载体具有一定的 “动力”，表现为具有方向标识性意识的标识及层级关系。比如，清晰的导航箭头或色彩渐变，引导用户在界面中进行有序的浏览和操作，确保用户不会迷失方向。

第四种力主要是指视觉式样本身及其组合所形成的视觉冲击力。

在界面中，涵盖引导性的动态效果可以吸引用户的注意力，激发用户的探索欲望。例如，微妙的动画效果或交互反馈，为用户带来更加生动的体验。

四种 “力” 的概念

这四种力是 GUI 设计中讨论视知觉的核心内容。

它们是形状、颜色和运动的固有属性，并非观赏者凭借记忆中的想象强加给知觉对象的。阿恩海姆将格式塔心理美学视为一种

“视知觉形式完形理论”

。

在 UI 设计中，以格式塔心理美学为指导，视觉上的 “完形” 形式生成机制发挥作用。用户在设计师精心构建的色彩图形语言引导下，无意识地进行目的性的视知觉形式达成。这种方式为无缝接入交互提供了卓越的解决方案。

在 UI 设计中运用格式塔心理学，为人机互动形式的形成和建构提供动力机制引导，让我们对格式塔心理美学有了全新的理解。它不仅提升了界面的美观度，更重要的是增强了用户体验，使界面更加直观、易用。通过合理运用格式塔心理学的原理，设计师可以创造出更具吸引力和功能性的 UI 设计，为用户带来更加愉悦的交互体验。

视觉思维

人类对于艺术的感知与生俱来，积极主动。对于现代优秀交互设计师而言，掌握并了解人类视觉的基本原理是必备素养之一。视觉思维与人类的生理和心理因素紧密相连。

1.生理方面看

这与我们的感官系统及其特性息息相关。人类的视觉系统犹如一条完整的视觉分析链，涵盖了眼球、大脑皮层以及它们之间的视觉传导路径。

视觉大脑皮层位于大脑后端，围绕枕叶的距状裂周围分布。其中，V1 区和 V2 区主要负责一系列特征处理，V4 区承担图案模式处理工作，而前脑叶和中脑则负责高层注意力的控制。信息由皮层 V1 通过两条线路进行输送。第一条路线为背侧流，即位置通道，从 V1 传输至 V2，再进入 V5，最后抵达顶下小叶，此段主要处理视觉的空间位置信息以及相关的运动和控制部分。第二条线路为内容通道，从 V1 到 V2 和 V4，最后进入下颞叶，用于物体的识别和长期记忆。

大脑皮层图例

2.心理方面看

视觉思维与人类的现有生存条件以及以往的生活经验紧密相关。生理与心理因素相互作用，形成了独特的视觉思维特性。

多年来，艺术、设计心理学家在对人脑及其视觉生理机制的研究上取得了显著进展。在视觉艺术作品中，一系列色彩、图形和空间关系的呈现，都是视觉艺术家经过反复斟酌的结果。他们思考着哪种颜色和图形会更加醒目，如何合理组织空间，以及在何种情况下应该用图像代替文字来表达概念。这样经过深思熟虑的作品，能够有效规避人类视觉的弱点，充分激发用户对主体的能动性和创造性认识，让观赏者和使用者获得愉悦的视觉体验。这种主动的视觉感知能够更好地传达作品所要表达的思想与内涵。

如果设计师能够深入了解并分析用户的视觉系统和心理，就能设计出更符合目标用户需求的 UI 交互产品。例如，通过对用户视觉注意力的研究，设计师可以在界面中合理布局关键元素，使其更容易被用户察觉。同时，根据用户的色彩偏好和心理预期，选择合适的色彩方案，营造出舒适的视觉氛围。此外，设计师还可以利用用户对图形的认知习惯，设计简洁明了的图标和界面元素，提高用户的操作效率。总之，对视觉思维的深入理解和运用，将为 UI 设计带来更多的创新和突破。

UI 设计中的视觉设计

人类的感知系统丰富多彩，主要分为听觉、味觉、视觉、触觉、嗅觉这五大类别。其中，令人惊叹的是，高达 90% 的感知竟然来源于视觉系统。这一特性使得界面产品的设计紧紧围绕着用户利用视觉刺激思维以及人机交互细处理模式来实现人机互动，进而达成传递或获取信息的目标。

比如当下流行的各类手机 APP，以其精美的界面设计吸引着用户。当我们打开一款音乐播放软件，绚丽的色彩搭配、简洁明了的图标布局，瞬间抓住我们的眼球，让我们能够快速找到自己想听的歌曲。这就是视觉设计在人机交互中的重要作用，通过视觉刺激引导用户进行操作。

在这个过程中，我们常常能听到界面产品的开发人员发出这样的抱怨：“我们讨厌交互设计。” 而交互设计师则会坚定地表示：“我们不需要图形。” 然而，视觉设计师却往往对来自各方面的意见持相反态度，显得一厢情愿。

但事实上，视觉设计绝非孤立的存在，它是在 UI 设计中可用性和交互设计研究的综合体现。例如一些知名的电商平台，其界面设计既考虑了用户的操作便捷性，又通过精美的商品图片展示和富有创意的页面布局，满足用户的视觉需求。用户在浏览商品时，流畅的交互体验和美观的视觉效果相辅相成，提升了用户的购物体验。

视觉思维，宛如一座神奇的桥梁，将感知与思维、艺术与科学紧密地结合在一起。它能够将人类本能的视觉感知、图形设计以及视觉可视化巧妙地联系起来。在满足使用功能设计的基础上，现代 GUI 设计已然成为一种辅助交互的强大力量，它不仅能满足用户的感知需求，还能迎合审美需求以及自我实现需求，成为功能性十足的视觉设计杰作。它就像一颗璀璨的明珠，在数字世界中散发着独特的魅力，为用户带来前所未有的体验。

计算机和用户

视觉思维在 UI 交互体验设计中的作用

在 UI 交互体验设计中，我们确实应当将这样的交互设计视作用户对品牌的认知工具和用于信息传递的重要渠道。

从处理平面图像的角度来看，人类的大脑具有强大的能力，能够在一定程度上通过思维进行心智图像的建立。想象一下，当我们在脑海中构思一幅美丽的风景或者一个复杂的场景时，各种元素在思维的画布上逐渐清晰起来。然而，当这些图像被纸张、荧幕等媒介物表现出来时，情况又发生了变化。我们能够把网页、图标、信息图表等可视化指令经过视觉思维的处理过程，快速地解决问题。比如，当我们浏览一个设计精美的网页时，清晰的布局、醒目的图标和直观的信息图表能够迅速引导我们找到所需的内容，让我们在短时间内获取关键信息。

而在 UI 交互体验设计中，“视觉思维” 手段更是发挥着独特的作用。它能够帮助用户提前整理视觉引导任务，为用户的交互之旅提供清晰的方向。不同的用户有着不同的需求和偏好，“视觉思维” 可以根据这些差异增加视觉注意力的多样性。对于喜欢简洁风格的用户，简洁明了的界面设计和少量但突出的视觉元素能够吸引他们的注意力；而对于追求丰富体验的用户，多彩的色彩搭配和动态的视觉效果则更能满足他们的需求。这样的差异化设计使得不同类型的用户都能在交互过程中找到满足自己需求的视觉引导。

同时，“视觉思维” 能使人类本能的认知线索在视觉图形语言处理中直接快速切换。在用户潜意识的情况下，利用用户自身的视觉引导去完成交互任务，大大缩短思考的时间。例如，在一款游戏应用中，巧妙的色彩变化和图形动画可以在用户不经意间引导他们进行操作，让他们在享受游戏的过程中自然地完成各种交互任务，而不会感到繁琐和困惑。

总之，在 UI 交互体验设计中，“视觉思维” 以其独特的优势成为了连接用户与品牌、实现信息高效传递的关键手段。通过差异化的设计和巧妙的视觉引导，它为用户带来了更加便捷、愉悦的交互体验。

成功运用 “视觉思维” 的 UI 交互体验设计案例

一、苹果 iOS 系统

苹果的 iOS 系统以其简洁、美观的界面设计而闻名。图标设计简洁直观，色彩搭配和谐，能够让用户一眼就识别出不同的应用功能。例如，相机图标是一个逼真的相机造型，让人一看就知道其功能。在交互过程中，动画效果流畅自然，如打开应用时的渐显效果、关闭应用时的收缩效果等，这些动画不仅增加了视觉吸引力，还为用户提供了操作反馈，引导用户的视觉注意力，让用户在操作过程中更加流畅和舒适。

二、Airbnb

Airbnb 的界面设计充满了故事性和吸引力。在首页，精美的图片展示了各种独特的房源，吸引用户的目光。图片的选择和排版都经过精心设计，能够让用户快速了解房源的特色。在搜索结果页面，清晰的布局和简洁的信息展示让用户能够轻松比较不同房源的价格、位置等关键信息。同时，地图视图的交互设计也非常出色，用户可以通过拖动地图直观地查看不同地区的房源分布，这种视觉引导方式大大提高了用户的搜索效率。

三、微信

微信的界面简洁易用，图标和文字的搭配恰到好处。绿色的主色调给人一种清新、舒适的感觉。在聊天界面中，不同类型的消息有不同的显示方式，如文字、图片、语音等，让用户能够快速区分。朋友圈的设计也充分运用了视觉思维，用户可以通过图片、视频等多种形式分享自己的生活，点赞和评论的互动方式也通过视觉效果进行了明确的提示，增加了用户之间的互动和交流。

用户交互体验设计过程中的视觉思维

为了更好地体现用户交互性能，我们确实需要在整个用户交互体验设计过程之中引入视觉思维分析模式来规范指导设计。这一模式就如同一位智慧的导航者，引领着设计的方向，确保每一个环节都能最大程度地满足用户的需求和期望。

对整个设计过程中一系列层级结构进行视觉归纳，是一项至关重要的任务。

从 UI 设计过程中最初的方案构架开始，就如同搭建一座宏伟建筑的基石，需要深思熟虑。设计师要以视觉思维为导向，考虑如何让方案构架既具有创新性又符合用户的使用习惯。草图阶段，则是将创意初步呈现在纸上的过程，此时要充分发挥视觉思维的作用，捕捉那些瞬间的灵感，用简洁而有力的线条勾勒出未来产品的轮廓。

动态 layout 的设计更是离不开视觉思维，它要让页面的布局在动态变化中保持流畅和自然，给用户带来舒适的视觉感受。而后期特效的安排，则如同为产品披上一件华丽的外衣，需要恰到好处地运用，既不能过于耀眼而分散用户的注意力，也不能过于平淡而无法引起用户的兴趣。

例如，如何使整个方案更符合目标用户的色彩定位，这是一个需要深入思考的问题。

不同的用户群体对色彩有着不同的偏好和情感反应。设计师要通过对目标用户的调研和分析，了解他们的文化背景、年龄层次、性别差异等因素，从而确定最适合的色彩方案。比如，对于年轻的用户群体，可能更倾向于鲜艳、活泼的色彩；而对于商务用户，则可能更喜欢稳重、大气的色彩。通过精准的色彩定位，能够让用户在第一时间对产品产生好感。

如何让复杂的层级关系在视觉上显示得更为简单且明朗化，也是视觉思维分析的要点之一。

结合设计认知心理学总结出一套适合当前项目的用户交互体验设计的视觉规范，是实现优秀设计的关键。设计认知心理学研究人类在设计过程中的认知和心理活动，它可以为设计师提供宝贵的理论支持。设计师可以借鉴设计认知心理学的研究成果，制定出符合用户认知习惯的视觉规范。比如，遵循简洁性原则，避免过多的视觉干扰；运用一致性原则，让用户在不同的页面和功能模块中都能保持一致的视觉体验；注重可读性原则，确保文字和图标易于识别和理解。通过建立一套科学合理的视觉规范，能够提高设计的效率和质量，为用户带来更加出色的交互体验。

下面介绍下我在过往项目中的实际案例，看看如何处理复杂的视觉层级

案例分享

首先我们了解一下背景：

盒马店仓拣货是门店仓储作业中的一个重要环节，员工需要用到PDA实时接收仓储系统分配的拣货任务，并为拣货员提供清晰的任务指引，包括商品的位置、数量等信息，它就像一个智能导航仪，指引拣货员快速找到目标商品，PDA中就需要进行界面设计，保证拣货员能高效的完成任务，但是实际仓的环境是极其复杂的，往往店仓环境较为昏暗且存在温差，同时拣货员往往是边走边拣货，整体过程是非常紧张和匆忙的，这就对视觉识别效率要求非常高。

拣货员的具体工作流程如下：

1.接收订单：当顾客在盒马 APP 上下单后，订单信息会同步传输到门店的仓储系统。

2.拣货任务分配：仓储系统根据订单内容，将拣货任务分配给相应的拣货员，并将任务信息发送到拣货员手中的 PDA（掌上电脑）设备上。例如，某顾客下单购买了苹果、牛奶和面包，系统就会指示拣货员去相应的区域拣取这些商品。

3.商品拣选：拣货员根据 PDA 上的指示，前往指定的货架区域。通过 PDA 扫描货架上商品的条形码或二维码，确认商品信息无误后，将商品拣选出来放入拣货篮或推车中。在拣货过程中，拣货员需要严格按照商品的数量和规格进行拣选，避免出现错拣、漏拣的情况。

4.复核与打包：拣货完成后，拣货员将拣选好的商品送到复核区，由复核人员对商品进行再次核对，确保商品的种类、数量、质量等与订单一致。复核无误后，根据商品的特性和订单要求进行打包，例如，对于生鲜商品需要使用特殊的包装材料和方式，以保证商品的新鲜度和品质1。

5.出货：打包完成的商品被放置在出货区，等待配送人员前来取货，进行后续的配送环节，确保商品能够及时、准确地送达顾客手中。

在这个过程中我们可以发现从“行为、感受、环境、设备”几个维度来看，我们需要关注的点是非常多的，如下面所示我们需从效率和步骤感入手，保证界面清晰无障碍的基础上对小小的屏幕进行占比的优化，同时加入情感化和温度感，这是最理想的设计目标。

设计前需关注的内容

提炼设计目标和原则

对目标用户群体进行深入调研，了解他们的年龄、性别、职业、文化背景等基本信息。

这些因素会影响用户对色彩、图形、布局等视觉元素的偏好。分析用户的视觉感知优势和弱势。例如，对于老年用户，可能需要更大的字体和更鲜明的色彩对比；对于视力受损的用户，可能需要高对比度的界面和清晰的图标。通过用户访谈、问卷调查、观察等方法，收集用户对现有产品或类似产品的视觉反馈，了解他们的喜好和不满之处，为后续设计提供依据。

色彩定位根据目标用户群体的特点和产品的定位，确定合适的色彩方案。

色彩可以传达不同的情感和氛围，如蓝色通常给人沉稳、可靠的感觉，红色则充满活力和激情。考虑色彩的对比度和可读性。高对比度的色彩组合可以提高文字和图标的清晰度，便于用户阅读和识别。同时，要确保色彩在不同的设备和环境下都能保持良好的显示效果。

设计规划阶段（视觉层研究）

方案构架运用视觉思维，从整体上规划产品的架构和布局。考虑用户的使用流程和场景，将功能模块进行合理的分组和排列，使界面简洁明了，易于导航。确定主要的视觉焦点和引导路径。通过大小、颜色、位置等方式突出关键信息和重要操作，引导用户的注意力，提高交互效率。

功能色视觉研究保证视觉可读性和清晰性

中性色研究保证对比度清晰可读

字号字阶优化

设计实施阶段

特效应用谨慎地选择和应用特效，如阴影、渐变、发光等。特效可以增强界面的视觉吸引力，但过多或不当的使用可能会导致视觉混乱和性能问题。考虑特效对用户操作的引导作用。例如，使用特效来突出可点击的区域或提示重要信息，可以提高用户的交互体验。

通过视觉明确任务

时效思考

设计方案

测试评估阶段

用户测试邀请目标用户进行用户测试，观察他们在使用产品过程中的视觉反应和行为。注意用户对不同视觉元素的关注程度、理解程度和操作效率。收集用户的反馈意见，了解他们对界面设计的满意度和改进建议。根据用户的反馈，及时调整和优化设计。
数据分析利用数据分析工具，收集用户在使用产品过程中的行为数据，如点击次数、停留时间、页面跳转路径等。通过分析这些数据，可以了解用户的视觉注意力分布和交互习惯，为进一步优化设计提供依据。

方案调研

方案验证可行

组件沉淀

对设计组件进行沉淀和归纳，同时定义好设计样板间。

组件识别，需要对已有的设计项目进行全面梳理，识别出其中重复出现的元素和模块。这些元素可以包括按钮、输入框、图标、导航栏、卡片等。例如，在一个电商网站的设计中，商品展示卡片、购物车按钮、搜索框等都是常见的组件。同时，也要关注不同项目中具有相似功能或外观的元素，它们可能经过适当调整后可以归纳为同一类组件。比如，不同页面的提示信息框，虽然在内容和位置上有所不同，但在风格和交互方式上可能具有共性。
规范制定对识别出的组件进行规范制定，包括尺寸、颜色、字体、间距等方面的统一规定。例如，确定按钮的标准尺寸、颜色搭配和文字样式，确保在不同的页面和场景中都能保持一致的外观和交互效果。制定组件的使用规范，明确在什么情况下应该使用哪种组件，以及如何进行组合和布局。例如，规定导航栏的位置和结构，以及不同级别页面的导航方式。
分类整理将规范后的组件进行分类整理，建立一个清晰的组件库。可以按照功能、类型或使用场景进行分类，方便设计师在后续的设计中快速查找和使用。比如，将组件分为界面组件（如按钮、输入框等）、交互组件（如弹窗、下拉菜单等）、布局组件（如网格系统、分栏布局等）。
持续更新随着设计项目的不断进行，新的组件可能会不断出现，旧的组件也可能需要进行优化和调整。因此，需要建立一个持续更新的机制，定期对组件库进行审查和更新，确保组件库始终保持活力和实用性。

总结：

在现代的 UI 设计中，往往存在着众多的功能模块和信息层级。如果处理不当，就会让用户感到混乱和困惑。设计师可以运用视觉层次、分组、对比等手法，将复杂的层级关系进行梳理和简化。例如，通过不同的字体大小、颜色深浅、图标形状等方式来区分不同的层级，让用户能够轻松地理解和操作。

如何保证特效的使用恰到好处，不会引起用户的使用误解，同样需要设计师的精心考量。特效可以为产品增添趣味性和吸引力，但如果使用不当，就会适得其反。设计师要根据产品的特点和用户的需求，合理地选择特效的类型和强度。比如，在一些需要强调操作反馈的地方，可以使用适度的动画特效，让用户清楚地知道自己的操作是否成功；而在一些重要的信息展示区域，则要避免使用过于花哨的特效，以免干扰用户的阅读。

设计师不仅需要对人类视觉系统有一定的了解，同时也需要对目标用户视觉感知的优势和弱势进行分析和归纳。人类的视觉系统是一个复杂而神奇的系统，它有着自己的特点和规律。设计师要了解人类视觉的注意力机制、色彩感知、空间感知等方面的知识，以便更好地运用视觉元素进行设计。同时，不同的目标用户群体在视觉感知方面也存在着差异。比如，老年人可能对色彩的对比度要求更高，而视力有障碍的用户则需要更加清晰的文字和图标。设计师要通过对目标用户的视觉感知优势和弱势进行分析，制定出相应的设计策略，确保产品能够满足不同用户的需求。

谢谢！

作者：小鸡小小小小鸡
链接：https://www.zcool.com.cn/article/ZMTYzMzYzNg==.html
来源：站酷

评论(0) 浏览(269)

192024-9

B端产品设计优化-基于用户需求调研与分析

ui设计分享达人

在当今设计和产品开发领域，用户研究扮演着不可或缺的角色。理解用户的需求、行为和体验，是设计师们打造成功产品和服务的关键步骤。

用户研究不仅是设计师和产品团队的重要工具，更是提升产品竞争力和用户满意度的关键因素。通过深入的用户研究，我们能够更准确地捕捉用户需求，创造出创新产品。

这篇文章将深入而全面的讲解用户研究的方法与具体实践，包括用户研究的重要性、用户研究的核心因素、定性定量研究方法、基于产品生命周期的用研方式、用户研究在设计流出中的具体应用等多维度探讨用户研究的核心概念及其实际应用方法，帮助读者更好地理解如何通过有效的用户研究提升产品的用户体验和市场竞争力。同时提供清晰的方法论和实际操作指南，帮助在设计和开发过程中有效地应用用户研究，实现产品与市场的良性互动与成长。

杰夫·贝佐斯是亚马逊集团创始人，他曾说：“用户的需求是创新的源泉，只有深入了解用户，我们才能创造出真正有价值的产品。”这句话强调了用户需求在创新过程中的核心地位。

他指出，真正有价值的产品来源于对用户需求的深入了解。

也就是说，创新不是凭空产生的，而是通过仔细观察和理解用户的实际需求和问题而实现的。只有当我们真正了解用户的痛点、期望和行为模式时，才能开发出满足他们需求并解决他们问题的产品和服务。

通过以用户为中心的设计，并通过数据驱动的决策，我们可以解锁设计的无限潜力，创造出更好的产品和服务。

想让用户爱上你的产品，你必须先爱上你的用户。

一、我作为设计师的小思考

作为设计师，过往我常常在思考：设计的价值是什么？用户体验的价值又是什么？在设计之路上不断前行的过程中，这个问题始终如影随形。

我在企业中遇到很多困惑，系统的 BUG 会造成用户体验不好，这只是其中一个方面。比如，当用户在使用一款软件时，突然出现的系统错误提示，会打断他们的操作流程，让他们感到沮丧和无奈。又或者，在一个购物平台上，如果因为系统的漏洞导致商品信息显示不准确，用户可能会对产品的质量产生怀疑，从而放弃购买。这些看似小小的 BUG，却可能对用户体验产生巨大的负面影响。

而除了系统 BUG 之外，还有很多因素也和体验有关。界面的设计是否简洁美观？操作是否便捷流畅？信息的呈现是否清晰易懂？这些都是影响用户体验的关键因素。例如，一款音乐播放软件，如果界面设计过于复杂，用户可能很难找到自己想听的歌曲；而如果操作不够便捷，比如切换歌曲需要经过多个繁琐的步骤，那么用户的使用体验也会大打折扣。

再比如，一个企业的官网，如果页面加载速度过慢，用户可能会失去耐心而直接关闭页面；如果网站的信息架构不合理，用户难以找到自己需要的内容，那么这个官网就无法发挥其应有的作用。在移动应用领域，推送通知的频率和内容也会影响用户体验。如果推送过于频繁或者内容不相关，用户可能会感到厌烦，甚至卸载应用。

总之，在设计和用户体验的领域，每一个细节都至关重要。设计师需要不断地思考和探索，如何在满足功能需求的同时，提升用户的体验，为用户创造真正有价值的产品。

二、用户研究的核心

用户研究（User Research）是一种系统性的方法，旨在通过了解用户的需求、行为、态度和痛点，来改进产品或服务的设计和功能。它通过各种研究方法，如访谈、调查、可用性测试和观察等，收集和分析用户的数据。这些数据帮助设计团队和开发者更好地理解用户，从而做出更明智的设计决策。

在实际设计和开发过程中，通过收集和分析以上信息，设计团队可以更有针对性地制定商业模式、服务方式、策略重点和盈利模式，确保产品不仅能够满足市场需求，还能够提供良好的用户体验，从而提升产品的竞争力和市场份额。

总之，用户研究的核心在于通过深入理解用户，为设计和开发团队提供关键的信息和见解，以便他们能够有效地创造出符合用户期望和需求的产品或服务。

用户研究（User Research）确实是设计和产品开发过程中至关重要的一环。它通过系统性的方法和工具，深入研究用户的目标、需求、能力以及体验，旨在指导如何优化设计、产品架构或工具，从而提升用户的工作和生活体验。

在进行用户研究时，主要关注以下几个方面：

1.用户体验（User Experience）：

这是用户与产品或服务互动的整体感受和反应。通过用户研究，可以了解用户在使用过程中的体验如何，哪些方面需要改进，从而优化产品设计和功能。

2.用户痛点（Pain Points）：

指的是用户在使用产品或服务时遇到的困难、不便或不满意的地方。通过深入了解用户的痛点，可以针对性地改进产品的功能和设计，提升用户的满意度和忠诚度。

3.用户需求（User Needs）：

这是用户在特定情境下必须满足的条件或期望。通过用户研究，可以准确把握用户的需求，确保产品或服务能够有效地解决用户的实际问题。

4.用户行为和态度（User Behavior and Attitudes）：

研究用户在使用产品或服务时的行为模式和心理态度，包括他们的偏好、习惯以及对新技术或设计的接受度。这些信息有助于设计团队调整产品策略和功能，以更好地迎合用户的期望和习惯。

三、产品生命周期的用户研究考量

一个0-1的产品，在产品设计前，可能没有大量的用户或数据,而又需要了解用户的偏好，来定义产品需要解决的用户痛点等问题,所以需要采取一些定性研究(访谈、用户角色定义等)的方式来收集产品设计的核心需求。

1-N的产品，在产品设计前就拥有了一定比例的用户和数据，可以参考一些数据来确定产品优化的方向和指标。产品设计后，根据项目，也有两种验证方法: 一是做A/B测试，慢慢推向市场小范围收集反馈，待稳定后再大规模推向整个市场。这种做法属于定量的范畴。二是可用性测试，招募符合要求的用户来参与新产品的试用，提前设计一些任务要求用户来完成，并可以增加一些定性研究(眼动实验、用户访谈等)辅以完善。

在用户研究中，定性和定量研究恰似一对相辅相成的伙伴，二者互为补充，紧密结合使用能够为我们提供全面而深刻的用户洞察。

首先，在发现问题方面，定性研究发挥着至关重要的作用。

通过深入的用户访谈、焦点小组讨论以及实地观察等方式，我们能够走进用户的世界，聆听他们的声音，捕捉那些细微之处的潜在问题和珍贵的机会。比如，在一款新的社交软件的研发过程中，通过与用户的面对面交流，我们可能会发现用户对于隐私设置的担忧，或者对于特定功能的强烈需求，这些都是定量研究难以直接触及的领域。

接着，验证假设环节，定量研究则展现出其强大的实力。

利用大规模的数据收集和统计分析，我们可以对定性研究中发现的假设进行验证和量化。例如，我们在定性研究中发现用户对某个新功能的兴趣较高，那么通过定量研究中的问卷调查或数据分析，我们可以确定这个兴趣的具体程度以及在用户群体中的普遍性，从而为产品决策提供有力的数据支持。

最后，在迭代设计阶段，定性反馈成为了改善设计的关键。

用户的具体意见、感受和建议，能够为设计师提供精准的改进方向。同时，定量数据的评估效果也不可或缺。通过对关键指标的监测和分析，我们可以客观地评估设计迭代后的成效，如用户留存率的提升、使用时长的增加等。这样的循环往复，使得产品在不断的优化中逐渐趋近于用户的真正需求。

总之，定性和定量研究的结合，如同为用户研究搭建了一座坚实的大厦，为打造出卓越的产品和服务奠定了坚实的基础。

四、项目实战-星汉低代码平台基础建设提升产品体验

1.项目介绍：

星汉低代码平台是一款将先进的AI技术与低代码开发理念完美结合的智能化开发平台

旨在通过简化且智能的开发工具

赋能开发者，提升研发效能、降低开发门槛，并增强应用效果

2.项目背景：

低代码平台去年下半年开始支撑教育数字基座应用开发助手的建设,去年主要处于内部打磨阶段，今年上半年随着应用开发助手前三单的推广，直面真实客户的需求和交付压力，暴露出来了许多问题：功能性的、非功能性(性能、安全、稳定性)、架构、协作与流程等。for商业化，为保障教育规模化交付，解决影响应用交付的基础功能问题及风格换新，包括账号权限体系、多租户与资源隔离、第三方平台对接、业务逻辑编排。基于此需求对平台的础功能进行完善，存在一下两个问题：

1.基于多租户与资源隔离问题：

无法支持多租户及多租户管理；多应用不支持共享数据、账号权限、工作流；不支持按交付项目管理和复制多个应用等。使用优先解决底层资源隔离的技术架构调整、基础项目管理产品功能，调整产品基础功能架构，租户配置、模板的措施才优化体验。

2.基于业务逻辑编排问题：

无后端（1.业务逻辑处理，2.数据处理功能）均需要硬编码；硬编码部分无法随产品升级而更新，与产品脱节需要独立维护；教育助手无法修改硬编码的逻辑，无法最终提供给信息化老师（弱开发者）修改的问题。优先解决业务逻辑脚本和SQL脚本代码在低代码平台中可留存可复用可调式的基础功能。

3.设计目标及方法：

基于产品的背景，明确了设计目标是打造

“好用、易用”

的平台操作体验。

通过设计洞察，从易操作性、易学性和易见性的角度重新定义问题并寻求最优解决方案。

首先通过用户调研&体验度量了解平台现状和用户痛点，然后进行竞品分析和体验自查发现问题，最后基于发现的问题明确设计优化点梳理并优化产品。

4.三大指标分析：

在用户体验的领域中，满意度、净推荐值和费力度这三大主观指标犹如三把衡量产品或服务质量的关键标尺。

满意度：短期内衡量用户幸福感的用户得分

适用所有场景，适合作为补充指标做体验评估。

满意度的适用性非常高，可以用于询问用户各种问题，可以看整体的产品体验满意度，也可以看具体的某个功能的满意度。满意度能够体现出用户对产品短期内的幸福感。

满意度的缺陷是无法体现用户对产品的长期态度。

净推荐值：长期内衡量用户幸福感得分即客户忠诚度

头部厂商常用，适用于高频高竞争对外用户的产品。

是一种计量某个客户可能会向其他人推荐某个企业或服务可能性的指数。

NPS被用于衡量目用户长期的幸福感，广泛用于互联网产品来衡量用户忠诚度。

费力度：短期内衡量用户完成任务的难易程度

主要应用于，ToB任务效率度量，相对于满意度，企业内部产品度量准确度更高。

费力度通过询问用户产品是否容易处理用户的问题，来发现用户对产品最真实的评价和用户的痛点，从而解决用户关注的问题以提升用户忠诚度。

4.对整体平台进行调研

对平台进行分析后总结出我们的平台更适合于用费力度进行度量，得到的结果如下

费力度度量：了解现阶段平台体验费力度情况，为提升搭建效率10%做基准线辅助定位。

体验纬度认同度度量：了解现阶段平台操作效率、容易上手、界面美观、系统稳定、功能全面五个维度的认同。

过程中发现平台整体

产品服务路径和体验非常费力，系统稳定度低

。

拆分操作效率、容易上手、界面美观、系统稳定、功能全面五个维度，结果认同度均低。 最低的为系统稳定度，最高的是界面美观度。

我们的主要竞品产品是宜搭、轻流、明道云、简道云。

宜搭

：是阿里巴巴自主研发的低代码应用开发平台，基于阿里云的基础设施和钉钉的企业数字化操作系统。具有高度灵活性和适应性，支持多种应用场景和业务模式，提供丰富组件和模板，能快速构建高质量、可靠的应用。例如，在企业级通信、项目管理、客户关系管理等方面表现出色。它还具备出色的可扩展性和易维护性，可与阿里云其他产品无缝集成，实现数据共享和协同办公，同时支持自定义业务流程和数据字段。

轻流

：是一个无代码系统搭建平台，能帮助用户轻松搭建各种场景应用，如进销存、客户管理、OA 协同办公、项目管理等。其特点是操作界面简洁，通过拖拽添加字段、设置业务流、分配权限等简单操作即可让业务数据规范严谨地流转。它还支持自定义门户打造业务枢纽，实现不同业务场景，并且有多种视图类型，让业务人员以自己的方式高效工作，能够满足绝大多数企业信息化建设的需求。

明道云

：可零代码构建各种企业中后台应用，功能较为强大和灵活，例如在数据处理和分析方面有一定优势，支持复杂的业务逻辑搭建和数据整合。它提供了丰富的接口和集成能力，方便与其他系统进行对接和扩展。其应用场景广泛，涵盖了项目管理、业务流程管理、数据分析等多个领域3。

简道云

：是一个零代码应用搭建平台，以表单为核心，擅长数据的收集、整理和分析。用户可以通过拖拉拽的方式轻松创建个性化的表单，实现信息收集管理。在流程自动化方面表现突出，可视化调整业务流程，让业务处理有条不紊。同时具备领先的报表能力，支持多表数据连接、权限管理、异常报警等，能帮助用户进行高效决策，数据全打通，可消灭数据孤岛

我们对其视觉层的形、色、质、构，与体验层均做了详细的竞品分析

调研完成后进行视觉侧梳理优化点：基于用户原声/竞品分析/体验走查纬度等维度梳理优化点，进行设计优化。