B端系统下交互设计探究
Exploration of Interaction Design under B-End System
DOI: 10.12677/design.2024.93433, PDF, HTML, XML, 下载: 6  浏览: 14 
作者: 刘雪豪, 王 玮*, 吴 燕:南京林业大学家居与工业设计学院,江苏 南京
关键词: B端产品交互动作用户体验业务流程B-End Products Interactive Actions User Experience Business Processes
摘要: 随着信息科技的发展,5G时代的到来,传统产业工作方式正逐步向智能化、便捷化、高效率智能办公模式转变。用户体验中的交互动作在其B端产品中的作用受到越来越多的关注,在完成业务工作的同时,如何通过高效便捷操作,达成用户目标,如何通过交互设计中的语义符号,传达给用户直观有效的功能需求点,是其当前设计的重点。采用文献研究法、用户体验法和产品调研法对B端客户平台中政务类平台和企业类平台进行调研。在B端政务类系统中注重对信息层级、流程节点、交互动作进行研究,而企业类系统仓储模块的则从产品交互层与业务流程层进行研究。所得到的两种行业系统中对于交互动作与控件有着较为一致的统一性缺失,且对于页面的反馈、字符信息层级、状态可见也存在一定问题。该文认为,在保证业务事件目标达成的前提下,保证交互动作与控件的统一、多元化的交互方式、界面信息呈现一定条理,是未来B端客户平台交互动作的未来趋势。
Abstract: With the development of information technology and the advent of the 5G era, the working mode of traditional industries is gradually changing to an intelligent, convenient and efficient intelligent office mode. The role of interactive actions in user experience in its B-end products has received more and more attention, and how to achieve user goals through efficient and convenient operations while completing business work, and how to convey intuitive and effective functional requirements to users through semantic symbols in interactive design are the focus of its current design. The literature research method, user experience method and product research method were used to investigate the government affairs platform and enterprise platform in the B-end customer platform. In the B-end government affairs system, the information level, process nodes, and interactive actions are studied, while the warehousing module of the enterprise system is studied from the product interaction layer and the business process layer. The unity of the interaction actions and controls in the two industry systems is relatively consistent, and there are also some problems in the feedback, character information level and status visibility of the page. This paper argues that on the premise of ensuring the achievement of business event goals, ensuring the unity of interactive actions and controls, diversified interaction methods, and a certain degree of interface information presentation are the future trends of B-end customer platform interaction actions in the future.
文章引用:刘雪豪, 王玮, 吴燕. B端系统下交互设计探究[J]. 设计, 2024, 9(3): 1221-1230. https://doi.org/10.12677/design.2024.93433

1. 引言

随着时代的发展,针对政企系统也逐步迈向高效、便捷、智能、数据可视化凸显的B端系统,B端客户平台实际应用场景中对于业务的流程性与功能全面性比较注重,因而对于交互动作的简洁性与流畅性,有着较高的要求[1]。以规范化管理,依据实际调研的工作流程,提升政务工作组和企业内部工作效率为主要目标[2]。于一个固定的环境、固定的人员和相应的后保障,从而针对一个事件或业务进行一系列的指派、跟踪、修改、定性等一些列操作。在不同的用户角色,如内部人员、外部客户、外派人员、数据分析员等角色相互协同作用下,从而推进工作进度,保障工作高效保质完成[3]。经济因素——从经济价值来看,系统的高效性,减少用户重复操作,有针对性的设计与交互体验,从而减少在产品开发过程中,不必要的bug修复与数据编程;人文因素——对于用产品来说,用户体验感是否满意,是产品成功的关键因素之一[4]。应让用户在使用便捷、高效产品的同时,参与到产品的研发和设计中,提升用户的参与感,减少产品中不必要的设计,才能获得用户的肯定[5]。我们应运用相应的技术,附以惯性的交互操作动效,有目的、有需求的,针对相应的用户群体,设计相应的产品系统,满足业务场景的同时,能够有效提升工作效率的,使产品达到人、机和环境的协调统一[6]

业务系统的于不同行业不断应用,随之也产生了不同系统之间存在交互动作语言无法形成一定的规范规则。而伴随着的不同行业系统的应用实践,也为业务系统中构建交互动作语言的规范性提供了有力支撑,对该方面的研究,不仅仅能提升相关业务人员对事件的处理效率,在保证业务系统目标性的同时,也给予相关使用者良好的体验感受,且在一定程度上也对B端业务系统中政务端与企业端相通的交互动作语言的构建提供了一定方向[7]

2. 当代交互与B端系统

2.1. 交互设计

交互设计从其概念上讲,是定义、设计人造系统的行为的设计领域,它定义了两个或多个互动的个体之间交流的内容和结构,从而使之互相配合,共同达成某种目的[8]。交互设计努力去创造和建立的是人与产品及服务之间有意义的关系,以“在充满社会复杂性的物质世界中嵌入信息技术”为中心。随着近四十年的发展,交互方式发生质的飞越,伴随着手势交互、语音交互等方式、相应产生了AR (Augmengted Reality)、VR (Virtual reality)、MR (Mixed Reality)技术[9]

用户体验从其本身来看是用户在使用产品过程中建立起来的一种纯主观感受[8]。ISO将用户体验定义为“人们对于针对使用或期望使用的产品、系统或者服务的认知印象和回应”用户体验,即用户在使用一个产品或系统之前、使用期间和使用之后的全部感受,包括情感、信仰、喜好、认知印象、生理和心理反应、行为和成就等各个方面[9]。总体来说影响用户体验的三个主要因素为:系统、用户、使用环境[9]。智能互联时代下,运用新的交互技术如语音交互、手势交互(如图1)、姿势交互、视觉交互,产品

Figure 1. Gesture interaction diagram

1. 手势交互图

语义表现出交互的动态性,相对于静态的语义符号,用户对于动态的交互更易理解,这也是动态交互形式与用户操作行为的和谐统一,同时也是交互方式和信息技术相结合模式发展的客观结果,全新的交互方式为用户提供全新的产品体验、更加贴合用户的需求[10]

2.2. B端系统

B端是区别于C端产品围绕“用户”的交互设计宗旨,B端产品其业务体系相对复杂,最为突出的则是“链接”属性。B端产品更多服务于政府机关、企业等特定团体组织的系统。该类用户群使用B端产品的功能时,核心业务目的均和另外一类人群形成链接,如:销售人员与消费人群、客服人员与客户、税务人员与纳税者等[11]。除了对外业务具有业务目的链接性,对内管理也具有组织层级链接性,无论是企业、机关单位还是任何具有一定人员规模的团体组织,必然会具有一套呈现分层级、且具有多个分工部门的组织架构。B端产品所谓的“用户”,在组织架构中往往不是独立的存在,必然与其他部门、层级的组织内用户产生链接。

3. 调研与分析

3.1. 系统平台概述

平台一关于疑点集成归纳板块,完成用户体验与交互语义的直观输出,于固定的使用场景根据目标用户画像,输出的功能需求与痛点。以疑点管理功能模块为例,通过疑点创建,建立疑点跟踪时间轴,通过疑点数据调查取证、上传相应的文件与跟踪记录、针对一系列的疑点数据举证,疑点成立,从而创建相应的任务,输出案件任务需求。如何高效的创建疑点,针对重点信息的录入,通过什么方式弹出/抽屉,界面功能区的分布与信息的排列组合,都是用户在体验产品系统时,通过交互操作直观的感受。

平台二关于跨境电商ERP系统中仓储模块,完成业务中仓库入库、库存、出库等相关页面操作。入库前所需对SKU产品编码的录入→订单导入→入库计划单(创建、审核)→入库单(创建、确认);库存内产品主要是对相关订单产品进行出库/移库/调运/转运/等操作;出库中业务所关注的是产品条码、订单条码、存量、发出量等数据对比。以上业务流程中皆存在复用功能节点,对交互动作反馈性与界面跳转后,所存在的信息需要系统给予业务人员直观动态显示。

3.2. 政务平台与企业平台交互分析

3.2.1. 政务平台交互动作分析

通过对交互方式语义对产品系统进行设计,首要的便是针对用户场景进行剖析,以同理心的方式,模拟用户在该场景中主要需求点及操作步骤。根据不同的操作来匹配相对应的交互方式语义符号,从而减少冗余步骤,减轻用户体验负担[12]

疑点管理功能用于在系统内记录和跟踪涉案人员的疑点信息,并组织协调相关调查跟踪工作。涉案人员疑点的划定,可以来自多个渠道,包括:线索举报,数据分析,谈话,调证或者涉案人自述。疑点一旦被划定,就处于激活状态,需要内情工作人员创建不同的调查/分析/谈话任务来对疑点进行跟踪研判,直到积累了足够的证据资料能够确认该疑点是否有证据价值还是不相关信息,由内勤人员办结。其整体业务流程(如图2)。

(1) 疑点收集划定,疑点的划定工作可以通过以下三个功能分别完成(如图3)直接创建在疑点列表界面,用户可以通过创建功能调出疑点信息表单,录入疑点相关信息后,提交至系统即完成疑点的创建工作。将文档资料划定为疑点用户在涉案人员的文档资料界面、将数据分析结果划定为疑点。

Figure 2. Suspicion management business processes

2. 疑点管理业务流程

(2) 指派可以在疑点创建/划定时直接指派、疑点跟踪是对疑点相关涉案人员办疑点跟踪任务用户在疑点详情板块内,可通过创建任务功能调出任务信息表单,填写相关信息后提交、疑点证据关联用户在疑点详情板块内,可通过关联证据功能调出疑点证据关联的表单,填写表单相关信息后提交,即可将相关证据关联到疑点内、疑点定性处置疑点负责人在疑点详情板块内,可执行定性处置功能以完成对疑点的跟踪研判工作,做出处置结论。

(3) 功能层级,界面内容主要包括三个模块(如表1),疑点收集与划定、疑点汇案、疑点详情。在疑点收集划定任务过程中,用户所要进行的主要操作是选择和确定。所运用的交互方式语义符号包括:点击、选择、下滑、上滑、标签状态、按钮状态、疑点信息排列方式。

疑点汇案界面,用户所需要进行的操作,主要是导入和导出。在此过程中,所运用的交互方式语义符号包括:点击、跳转、上滑、下滑、响应操作;疑点详情界面,用户的功能需求是创建任务、关联证据、定性处置,在此流程中,创建任务所运用的交互方式符号包括:点击、抽屉、跳转、弹窗、下拉、

Figure 3. Suspicion management business process diagram

3. 疑点管理业务流程图

Table 1. Suspicion management function level

1. 疑点管理功能层级


一级模块

二级模块

疑点管理

疑点收集与划定

新增疑点、疑点指派

疑点汇案

疑点归档、疑点出库

下滑、上滑、按钮状态。相应的关联证据所运用的交互方式语义符号包括:点击、下拉、跳转,定性处置与关联证据功能交互方式基本一致。

上述案例,应从交互设计原则出发,结合相应的用户使用场景,运用合适的交互语义符号动效,使其用户体验达到最佳[12]。可视化方面:以符号和文字所表达的内涵来帮助用户理解功能的定义、操作方法、获得预期的操作结果。反馈方面:交互设计会通过反馈提示(通常用弹窗的形式)将系统运转信息反馈给用户。限制方面:交互设计会通过文字提示等方式来告知用户操作明确的操作限制。映射方面:交互设计要求控制和效果之间的关系能够被明确阐述。一致性方面:交互设计要求同一功能的表现必须在整个产品中保持一致。

3.2.2. 企业平台交互动作分析

(1) 产品交互层分析,基于尼尔森十大交互原则分析,环境匹配原则–用户体验层面下,大量信息的汇聚,与堆叠,其产生的后果,就是页面杂乱,无逻辑,无秩序;要让用户(客户方/管理方/入库方/出库方),看其信息,即可明白其含义,避免专业码/自创术语,应从人机交互环境的角度去设计与用户群体特性相匹配的,交互语言。以仓储–入库计划单产品详情页为例,其基本信息陈列上,则是以无序,无层级,无类别的状态置于页面上。

一致性原则,仓储–入库单/出库单,交互场景所使用的交互方式/ICON/文案须保持一致。同时,B端系统的交互功能重复性更强,所以更需要保持交互的一致性。文案一致:订单管理列表页,导入/出按钮与其对应内容,须保持一致性(功能的复用,建立在内容基础上)。交互方式一致:点击方式(单次/双次/滑动等)在应用的同时,须保持反馈的一致性,点击是否有动效展示/悬停是否效果展示。

简约性原则,简化操作流程→避免复杂的操作→用简单的交互来达成目标→强调页面上需要突出重点→功能体验需要有层次性。复杂操作:如添加出库产品添加,需在视线中心填写ERPSKU/出库数量等信息,再点击逐个添加,需删除时(几条/全部数据时),还需用户自行判断是“删除数据”/“清空数据”,增加用户负担和学习成本。突出重点:添加/删除/清空,处于同一层级时,是否需要在用户对删除/清空数据操作时,作出提示/警示提醒,同样也要突出删除/添加按钮重要性,可以通过纯色(大红/深蓝/橘橙)/ICON,作出突出显示。

帮助性原则,使用系统时出现疑问点→设计交互的时候就将提醒信息做好→操作的引导→字段信息的提示→帮助手册或者问答。操作流程上:正常流程–装箱→确认发货→关闭;目前效果–装箱→确认发货→关闭(处于同一层级),业务/客户在操作上增加了选择的成本,在操作完成某个功能后,系统是/否给到用户反馈提示信息(已完成某操作/未提示进入下一步操作)。在功能放置上,直排的摆放(隐藏/禁用/置灰–在完成上一级操作后,该功能项显示出/解除禁用状态)。

状态可见原则,用户时刻知道发生什么→避免让用户去猜→点击按钮瞬间的动态变化(加载进度提醒)。可见提示:状态放置,仓储入库单的流转状态需具有明确指向性;同一页面下,多个单子/状态同时存在,所产生的信息剧增,视觉所承受的量级与画面放置的信息,反馈给业务人员,无疑增加了业务/客户的负担。单子的流转状态,流程即通过导视图/流程节点进行操作,流程节点分类),数量的统计显示/展示(位置调整/数字符调整),同时在操作完成入库单该节点操作后,提示/状态改变至,业务/客户可见状态模式(如图4)。

Figure 4. Functional architecture of ERP warehousing system

4. ERP仓储系统功能架构

(2) 业务流程层,功能入口,布局较混乱—左侧功能表单,呈现一种无序状态(例:入库管理—既有单据创建入库,也有发运请款审批记录);流转,入库计划创建→查看单据状态→审核→装箱→确认发货→到港确认→入库单创建(同步推送WMS)→确认产品→上架→已收货。触达面:根据功能布局,用户所触达面与预期结果较为不同。仓储–入库管理(如图5),多口径信息汇聚–入库/业务/管理,页面功能侧呈现功能相同,用户触达不同,用户需从哪些端口进行操作/查看,能否满足触达结果与目标。权限层:权限分配,于页面中展示,没有合理分配与布局。库存–录入端,层级不明晰,既有库存变动明细类/批次类/库龄类。功能入口罗列摆放,无法开快速找对所需入口。

Figure 5. Functional architecture of ERP warehousing system

5. ERP仓储系统功能架构

3.2.3. 小结

识别产品与用户之间交互的核心问题,寻找需求核心层级,统一语言,业务的提出,到流程完成(流程的统一性性);同时考虑长期价值,设计系统规模扩展能力;明确系统关键角色权限,使其更具规范与限定化明晰;操作行为与结果分支,当用户按照业务流程(操作行为),自行标记排列常用功能(每个页面有不同的业务流程)。在结果分支上,单独页面的用户排列的常用功能,其结果分支导向,是建立在整体个系统的,用户体验感下降。

4. B端系统交互设计趋势

4.1. 业务导向下的动作统一

B端产品基本是业务导向型,更加关注业务事件的流畅、目标的达成与事件反馈速率。用户在业务场景中对于系统界面内,所关注的是交互方式、ICON、文案的一致性,交互方式下控件与动作——点击、弹窗、下拉、停留悬浮等为主要交互方式,以上它浸入在界面的各个节点与界面内,需要用户在进入页面内,在使用一个页面后对于其中的交互逻辑能够在系统各页面内通用,以减少用户的学习成本[13]

4.2. 多元交互方式

点击交互是B端客户平台中基本且易用的交互方式,本质上是我们人与PC系统的交互,嵌入实际应用场景。现有科技的爆发手势交互与眼部移动锁定交互已经应用在多个产品中,未来应用于B端客户平台中,利用眼部快速锁定无需手指的点击触觉交互,从而更快的完成业务事件。对于业务型产品来说枯燥2D或2.5D页面信息平铺性,融入BI可视化展示的页面,直观的展示使B端客户平台在保证信息准确与业务流畅性的同时,提升业务人员的体验感受[14]

4.3. 界面导向流畅性

常规B端客户平台页面中,字符占据着页面主要的板块,由于业务事件所需信息繁杂,对于信息在界面的展示保留着一定的全面性[15],力求保证触达95%业务场景下诉求。基于此,界面内信息的排列组合与层级罗列有着极高的要求,充分了解业务基础上,字符 + ICON + 交互动作 + 控件需要保证一致性的同时帮助用户更加高效的检索到所需业务事件信息。

5. 结语

B端客户平台逐步拓展至各个行业,为各个行业赋能。其人机交互动作设计与识别是计算机领域的重要研究课题,也有助于提升各个行业业务事件效率。当今系统与制造行业监测、预警信息系统、政务信息发布平台、通讯信息发布平台和供应链系统等有着重要的实践意义,也为交互动作研究提供了更多案例。然而由于不同行业之间的B端客户平台有着不同的业务导向,因而交互动作与控件的设计也难以保证其一致性。该文针对这一问题,对B端客户平台中两类政务类与企业类交互动作进行调研,得出系统本质上在业务事件目标达成流畅与规范有着一致性。如何帮助业务人员完成初始动作后,提供后置目标导向,提升用户价值,简化流程、突出核心信息、增加反馈时效等方面,是相关设计人员与研究者今后更加侧重的方面。

注 释

①图1来源:来源Axure组件库

②图2~4,表1来源:作者绘制

③图5来源:作者绘制(界面原型)

参考文献

[1] 顾天威, 王玮, 陈雪. 基于用户体验的博物馆App设计策略探究[J]. 包装与设计, 2023(1): 136-137.
[2] 郁舒兰, 郝颖婕. 空气健康领域智能家居交互界面设计[J]. 家具, 2015, 36(6): 82-85.
https://doi.org/10.16610/j.cnki.jiaju.2015.06.020
[3] 谭浩, 李薇, 吴永萌. 交互特征研究与设计应用[J]. 湖南大学学报(社会科学版), 2015, 29(2): 155-160.
https://doi.org/10.16339/j.cnki.hdxbskb.2015.02.027
[4] 李娟, 刘涛. 交互设计缘起、演进及其发展趋势综述[J]. 包装工程, 2021, 42(18): 134-143, 171.
https://doi.org/10.19554/j.cnki.1001-3563.2021.18.014
[5] 马广韬, 方钦朴. 交互设计要素情感研究[J]. 设计, 2020, 33(9): 103-105.
[6] 郭欢逸, 王瑶. 交互界面设计中的动态语义研究[J]. 才智, 2018(11): 187.
[7] 刘佳琪. 基于用户体验设计中的微交互设计应用研究[J]. 科技与创新, 2021(16): 25-26, 28.
https://doi.org/10.15913/j.cnki.kjycx.2021.16.010
[8] 郝颖婕, 郁舒兰. 基于iOS系统手机APP界面设计研究[J]. 家具与室内装饰, 2016(4): 70-71.
https://doi.org/10.16771/j.cnki.cn43-1247/ts.2016.04.021
[9] 许馑予. 互联网产品交互设计中动态语义的应用与研究[D]: [硕士学位论文]. 天津: 天津大学, 2014.
[10] 杨随先, 刘行, 康慧, 李晴. 互联网 + 智能设计背景下的交互设计与体验[J]. 包装工程, 2019, 40(16): 1-13.
https://doi.org/10.19554/j.cnki.1001-3563.2019.16.001
[11] 龚帅. 互联网C端与B端产品的交互设计场景差异研究[J]. 美与时代(上), 2021(10): 76-78.
https://doi.org/10.16129/j.cnki.mysds.2021.10.027
[12] 朱小意, 向云波. 基于模件化理论的用户界面信息架构设计[J]. 工业设计, 2021(11): 132-134.
[13] 冯志全, 乔宇, 冯仕昌, 等. 多种手势对应同一语义的柔性映射交互算法的研究[J]. 电子学报, 2019, 47(8): 1612-1617.
[14] 董峻峰, 边鹏. 基于场景理论的智能家居交互设计研究[J]. 工业设计, 2023(8): 111-114.
[15] 孟星彤, 钟佩均, 边卓. 基于情境感知的UI交互设计研究[J]. 工业设计, 2023(11): 96-99.