阿里设计师把人机交互吃透了，这个项目案例暴露实力！-技术圈

#01

背景

1. POS收银机是什么？

POS（Point of Sale）是指在餐厅、商场、超市、酒店等消费场所中，用于结算和支付的一种设备。

传统意义上或我们印象中的POS机可能是刷卡机或集成式收银机，但随着餐饮行业数字化的深入，POS机也在不断变化，功能上不仅可以结账收银，还可以点餐叫号，系统操作上也不再被受限于硬件，硬件形态也是更加灵活多变。

▲ POS收银机的发展变化

在我们的日常生活中，POS收银机已随处可见，它可以是台式一体机、称重收银秤、电脑、平板和移动手持终端。所以，我们现在称呼的“POS机”或“POS收银机”都已经不再是指一种具体的设备，而是一套操作系统，它会以多种形态出现在商家的线下门店中。

▲ 就餐场景中的POS收银机

在客如云的业务中，我们也在不断地去适配兼容更多硬件设备，商户签约客如云餐饮SaaS系统后，可以选择购买客如云的硬件设备，也可以使用自己已有的硬件设备。

▲ 客如云的POS形态

2. 为什么需要设计原则？

尽管商户的POS硬件存在差异，但我们提供的是同一套系统，里面的功能非常丰富的，交互体验会直接影响到商户的日常经营。那么，在面向POS机进行产品设计时，我们是如何设计的？

▲ 客如云的POS收银机

其实，设计师也面临着困惑，POS端的设计什么样是好的，什么样是不好的，目前缺少一套设计评判标准。我们通过调研，发现目前市面上在餐饮POS收银领域的设计研究甚少，无法找到现成的答案。

▲ 调研情况

2023年5月，从“人民数据研究院”发布的数据来看，中国餐饮行业经营主体超过600万家，从业人员超过2000万人。每家门店至少需要1台POS机，由此可推测使用人数约在千万左右，而他们的体验不该被我们所忽视。

3. 设计原则的意义是什么？

通过对POS机进行全面的人因研究，提出对应的设计指导原则，为用户/产品/行业带来价值。

▲ 设计原则的意义

#02

了解用户

首先，我们需要了解一下使用POS的用户是谁。我们对50余家商户从用户、设备、环境三要素进行完整的人因研究，去洞察用户现状和需求，并对发现的设计问题进行剖析，开展相应的实验。

1. 使用POS收银机的用户有三类

一方面，我们发现使用POS的用户有三种典型角色。在“正餐”业态中，会严格区分“收银员”和“服务员”，他们都会使用POS机，但工作内容和职责会存在明显的差异；

而“点单收银员”则主要出现在“轻快餐/茶饮”业态中，顾名思义，既需要负责点单，也要负责收银结账，有些还需要同时负责商品制作，工作中也会更加追求效率，工作压力也会更大。

▲ 角色画像

2. 用户感觉自己的工作很“累”

另一方面，我们发现所有用户都会在某个时候感觉自己工作很“累”，在每天工作期间和结束后，容易有较强的「疲劳感」，可谓是身心俱疲，原因如下：

▲ 用户工作劳累的原因

3. 重视“低疲劳”需求

用户在日常工作已经很累了，为什么还要额外使用POS机，当然是为了更好地完成工作任务，希望POS机可以帮助到他们的日常工作。作为用户体验从业人员，我们应该重视用户的低疲劳需求，努力降低用户使用POS机乃至整个工作的疲劳度。

#03

POS设计原则

我们将疲劳分为以下四个类型，分别进行人因研究，分析该疲劳对用户的影响，并针对性地提出设计原则。

▲ 设计原则框架

#肢体疲劳

01.简化流程

通常POS一体机被放在一个柜台上，用户会站着使用触摸屏，较长时间的工作姿势容易损伤颈部、肩膀或手臂。

使用者身高与设备摆放的高度差越小，屏幕摆放越“直立”，使用者就需要将手臂高抬进行操作，长时间操作，手臂肌肉越容易酸痛；
使用者身高与设备摆放的高度差越大，屏幕摆放越“平”，使用者就需要大角度低头查看屏幕，长时间保持姿势不变，颈椎越容易损伤。

▲ 站立使用POS一体机

用户在使用PC终端设备时，多数是以站立使用为主，这是由于老板都会要求收银员在结账时，站立使用POS机进行收银结账，方便与顾客进行沟通。

由于摆放键盘鼠标的桌台高度较小，站立时需要大角度弯曲颈椎和手腕，长时间使用会损伤颈椎和手腕。

▲ 站立使用PC+键鼠

因此，设计时，应简化操作流程和交互方式，让用户能够使用最少的步骤和努力来完成他们的任务，降低肢体疲劳。

例如，在结账时，顾客告知收银员需要使用现金作为支付方式。简化流程的方式就包括如下：

1）提供默认值，输入框中直接默认当前的订单金额；

2）提供选项，根据订单金额，智能匹配出常见的收款金额作为选项，方便收银员一键进行更改；

3）可快速修改，输入框中默认为选中态，直接平铺展示键盘，需要修改时直接输入即可更换；

4）自动计算找零，按顾客实际多付金额进行找零，收银员直接点击或输入实时金额后，系统自动计算需找零的金额，省去收银员心算和使用计算器的流程，而且还可以减少计算出错。

▲ 案例：现金收款

例如，顾客在纸质菜单上勾选菜品后，服务员会对照着已勾选的菜品信息，再到POS上进行逐个搜索与加购，最后再下单给后厨。简化流程的方式就包括如下：

1）键盘不遮挡：搜索时，键盘不遮挡左侧的购物车，在完成点单后也无需收起键盘，可直接进行下单操作；

2）简化输入内容：服务员可输入菜品名称的拼音首字母，如“土豆”的“TD”，即可直接进行搜索；

3）考虑连续操作：在搜索结果中点击目标菜品，会自动清空搜索框中的内容，并保留键盘，以方便服务员进行输入新的菜品信息。

▲ 案例：连续搜索加购

例如，茶饮商户有统一备料，再统一打印效期贴的习惯，且发现每天早上服务员需要一次性打印的物料数量非常多，那么在设计时，就需要提供按“物料分类”的“全选”，让服务员可以进行批量勾选，一次性打印。

▲ 案例：打印效期贴

2.大拇指可及

用户操作触摸屏的不同区域时，习惯使用的手指会不同，对应易于操作的热区范围也会不同。

▲ 触摸屏操作场景

对多名实验者的大拇指进行多点测量，测量出可操作的舒适距离和最大距离，得到主要尺寸下的热区范围。

▲ 大拇指操作手势热区

因此，在设计时，需要用户较长时间操作的内容，应该放置在屏幕的左右两侧或顶部，且能够让用户自然触及的区域，方便用户将手掌托在设备的边缘后，使用大拇指进行单手操作，减轻手臂的负担，提升用户的舒适度。

例如，在结账时，除了常见的现金、扫码支付、团购核销，一般还可能会有储值卡、挂账、各大银行App的活动等，商户为了精准记账，就会分别为每种方式设置一个结账方式。

当顾客告知要使用的结账方式后，收银员就可以将手掌托在右侧进行滑动查找，而不是在中间区域手臂悬空进行查找。

▲ 案例：结账收款

例如，收银员需要去回查某个订金详情时，需要用户长时间去滑动查询的信息，那么就应该采用右侧的抽屉，而非居中的弹窗。

▲ 案例：查看订金详情

3.易操作性

1）触摸屏：用户操作很容易失败，包括同一元素需要重复点击和滑动容易卡顿。

▲ 触摸屏操作遇到的障碍

2）PC+键鼠：在PC电脑的右下角通常会长驻显示输入法或杀毒软件的悬浮窗信息，很容易遮挡住部分应用中的信息，造成用户短暂的视觉或行动障碍，不易于操作。

▲ PC操作遇到的障碍

因此，设计需要提供易于识别的点击目标，并采取一系列措施来确保点击目标在不同情况下都可以被准确地点击，以提高用户操作的效率和准确性。

例如，在弹窗中，底部的行动按钮需要更大，采用“充满容器”的布局方式，而非“固定尺寸+右对齐”，让实际的点击区域变得更大。在页面中，图标按钮的可点击热区需要根据情况进行扩大，让点击更容易。

▲ 案例：弹窗按钮和图标按钮

例如，在加购套餐时，行动按钮的位置需要避免在右下角被完全遮挡，可以采用位置左移或尺寸增大的方式，让用户使用鼠标点击更加方便容易。

▲ 案例：加购弹窗的按钮

#视听疲劳

4.可读性

对不同业态下的20多家商户，使用「光谱照度计」分别对店内的POS收银机从屏幕四角进行光数据的测量，得到以下环境光数据。

▲ 环境光测量

对数据进行分析，参考国家标准《建筑照明设计标准》GB 50034-2013，得出以下环境光的结论。

▲ 环境光测量结论

1）环境光照度过弱/过强对用户的影响：在不同的环境光下，用户分别手动调整屏幕亮度，以达到基础的“能看”水平，但由于大部分的环境都处于过强或过弱的极端光环境，用户很容易无法看清对比度较低的信息。

▲ “照度过弱/过强”对用户的影响

2）环境光分布不均匀对用户的影响：由于环境光线普遍不均匀，再加上安卓一体机通常采用高清的多点触摸电容屏，无论使用设备倾斜为任何角度，屏幕中都会出现局部反光或局部无光线的情况，用户很容易无法看清楚低对比度的信息。

▲ “光线分布不均匀”对用户的影响

因此，设计时，需遵循色彩规范，注重内容的可读性，需要确保界面元素之间有足够的对比度（符合WCAG的 AAA级标准），以使其在高亮度和低亮度的环境下都能清晰可见，同时也要避免使用大面积的强对比色，使用户在高亮度的环境下产生视觉疲劳。

例如，在订单模块的顶部导航栏会分Tab去展示来自不同渠道的订单，为了确保在不同亮度的环境下都能够清晰可见，Tab的文本与背景色对比度就需要至少大于7:1，而非4.5:1。

▲ 案例：Tab标签栏

例如，在弹窗内采用灰色背景+白色信息，既可以增强信息对比度，同时也去避免使用大面积的纯白色，带来持续性的视觉疲劳。

▲ 案例：叫号取餐

5.可听性

对多家餐厅在营业高峰时段进行实地噪声值测量，发现中式餐厅的噪音普遍高于70dB，显得比较嘈杂。

用户长时间（大约10分钟~5小时）处在噪音环境下，容易感到不舒服产生听觉疲劳，更严重会直接影响身体健康，损伤神经细胞，导致听力损伤。环境音普遍偏高，在排队叫号、取餐叫号等场景下使用的交互类音效需超过环境音才能被用户所听见，却会容易带来新的噪音。

▲ 环境音测量

因此，设计需建立声音标准，并根据不同的业务特征，给予不同的声音建议，让声音在使用时能够精准传递有效信息，同时保持自然流畅和调性统一，减轻用户在听取内容时的疲劳。

▲ 环境音使用标准与应用

#认知疲劳

用户容易因为以下四类原因产生认知疲劳，会直接导致用户在使用POS时记忆力变差、操作错误增加、作业效率降低。因此需要遵循一定的原则去降低用户的认知负荷。

▲ 用户认知疲劳的原因

6.简单易懂

设计应该尽可能地简单明了，包括界面布局清晰有序、使用用户熟悉的语言或图形、配置所见即所得等方式，让用户应该能够快速理解并上手使用。

例如，在收银结账时，当收银员想要给顾客打9折时，可以直接选择“9折”或输入“9”，这更符合现实场景中的“打几折”，而不是“90%”；在酒水寄存场景中，往往需要针对已有酒的刻度进行判断并记录在系统中，服务员只能通过目测预估，无法做到非常精确，系统通过图形化和“半瓶、大半瓶、小半瓶”这样通俗文案就会更易于用户选择。