Blend

重新设计小费体验,让顾客和咖啡师都觉得这件事有意义。

Blend —— 主视觉。
角色
UX/UI 设计师 服务设计师 视频原型制作
团队
Clemens Chen Peter Lin Louise Liu Ivy Tseng Kelly Zhong
工具
Figma, CapCut, Adobe Photoshop, Adobe Illustrator
主题
服务设计、客户服务、体验原型
时间
7 周
状态
华盛顿大学 MHCI+D 工作室项目

概览

问题

在咖啡馆给小费,已经变成顾客和咖啡师双方都觉得尴尬的一件事。收银台的电子小费屏在顾客还没拿到服务之前就要他做决定——本该是一次表达感谢的时刻,被压成了一项交易义务。

我的做法

和一个五人团队一起做了 Blend:一套把手机 App、POS 终端系统和一枚实体员工印章结合起来的服务设计方案,重新设计本地咖啡馆的小费体验。我主导了 Blend POS 终端的 UI 设计和最终方案的视频原型制作,并共同参与了实地观察和顾客访谈,产出了用户画像和用户旅程图。

概述

在咖啡馆给小费,已经变成顾客和咖啡师双方都觉得尴尬的一件事。

我们做了 Blend,一套小费方案,把手机 App、POS 终端系统和一枚员工印章结合起来,让顾客和咖啡师双方都能得到一次更有意义的体验。

我的贡献

我主要负责主导 Blend POS 终端系统的 UI 设计,以及整个 Blend 方案的视频原型制作。

此外,我还共同参与了在本地咖啡馆对顾客和咖啡师做的实地观察和访谈,并产出了用户画像和用户旅程图。

问题

在西雅图的咖啡馆给小费,会让顾客和咖啡师双方都陷入社交上的不适和尴尬。

  • 66%
    的美国成年人对小费持负面看法。
    Bankrate Survey
  • 50%
    的美国成年人是因为社交压力才给小费。
    WalletHub
  • 40%
    的美国成年人「强烈或比较反对」平台给出的建议小费档位。
    Pew Research Center

设计成果

Blend:把手机 App、POS 系统和实体产出物结合起来,重新设计本地咖啡馆的小费体验。

Blend POS System

小费滑杆与 Tip Later(稍后给小费)

可自定义的小费滑杆,加上 Tip Later 选项,让顾客对给不给、给多少更有掌控权,也缓解了站在收银台前的那份不适。

Blend App

实时更新与直接给小费

顾客能即时看到订单和奖励的更新。他们可以在任何时候给任何一位咖啡师小费,让咖啡馆这件事更方便、也更有人味。

Blend App

自定义留言与奖励追踪

顾客可以给咖啡师发一条自己写的「Thank You」留言,也能方便地看到自己到店的记录和奖励积分,让给小费这件事更有参与感、也更有回报感。

Blend App

咖啡师的被感谢与小费记录

咖啡师能看到自己当天的小费收入,也能读到顾客的「Thank You」留言——这给了咖啡师真正有意义的反馈,也让他们和顾客之间多了一点亲近。

研究

调研了咖啡馆当下的小费体验。

实地观察

我们团队走访了 7 家咖啡馆,观察给小费这一环的各个触点,特别是小费屏——它给出哪些档位、金额怎么设、用户流程是什么样,以及在那一刻员工和顾客之间的互动。

顾客与咖啡师访谈

我们在真实的咖啡馆场景里,对 4 位顾客和 3 位咖啡师做了 15 分钟的半结构化访谈,想同时听到服务接受方和服务提供方对咖啡馆小费这件事的看法。

定义痛点

  • 01

    当下的小费流程,让顾客没机会好好回想自己这次的服务体验。

    这个流程要求顾客在收银台就把小费定下来——那时他还没拿到自己的东西、还没体验到服务,给出的小费也就没那么真诚。

  • 02

    电子小费屏缺了人与人之间的那层连接,感觉像在走交易流程。

    电子小费屏用得越来越普遍,却没能照顾到顾客和咖啡师之间真实的人际连接,于是这次互动变得没有温度、像一种义务。

  • 03

    顾客对小费金额的自主权很有限,常常给不出自己真正想给的数。

    顾客面对的往往是几个预设档位,不一定对应他想表达的感谢程度;而社交上的不适又让他不好意思去选「自定义金额」。

  • 04

    在当下的小费流程里,咖啡师感觉不到被回报、也感觉不到被感谢。

    通过电子屏给出的小费,不一定能对应到某个人具体付出的努力,这可能影响他们的积极性和工作满意度。

用户画像

基于研究,我们产出了两份用户画像,设计就从这里出发。

概念发散

我们怎样才能重新设计本地咖啡馆的小费体验,让它对顾客更有意义、对员工更有回报?

定义 HMW

  • 对顾客有意义

    保住顾客自己决定给多少的自主权。让小费给到了谁这件事透明起来。

  • 对员工有回报

    去掉盯着小费数字的那份不适。给员工即时的回馈。

第一轮概念发散

在发散的那一场里,我们用了 情景演练、角色扮演等方法,把从很天马行空到比较落地的想法都先想出来。

用户旅程图

为了让我们的想法能更好地接进咖啡馆现有的运转方式,我们画了现有顾客的用户旅程图,把咖啡馆服务全程里各个触点上的痛点标出来。

方案收敛

基于研究,我们定了 5 条收敛原则:

  • 01 以人为本

    突出咖啡馆服务里「人」的那部分。

  • 02 自在

    缓解给小费带来的社交不适。

  • 03 自主权

    把给小费的决定权还给顾客。

  • 04 整体性

    把数字和实体两边的互动点都接进来。

  • 05 可行

    能在时间和成本都可控的前提下做出原型。

按这几条收敛原则,我们用点投票把想法筛了一轮。

最终方案

我们意识到,可以把不同触点上的想法组合起来,而且不必只盯着给小费这一个触点——可以为整个咖啡馆体验做设计。于是我们决定,方案可以从「支付与小费」扩展到「客户服务」。

竞品分析

和 Square、Stripe 相比,Blend 的重心在人与人的连接上,鼓励给小费,而不是去做完整的支付。和 Joe 相比,Blend 服务的咖啡馆规模更大,并且把不同的本地咖啡馆连成了一个小费生态。

体验原型

测试了第一版设计。

体验原型的搭建

我们在 MHCI+D 工作室里搭了一个模拟咖啡馆:一张高桌当柜台、投影出来的咖啡馆背景、一台 POS 终端、糕点、马克杯、奶精、一份菜单,还有清楚的指示牌,引导参与者走完下单和取单的流程。这个沉浸式的场景让我们能在接近真实咖啡馆的环境里,观察参与者怎么和我们的设计打交道、怎么做决定。

在这个场景里,我们跑了几项关键任务:

  • 角色扮演

    一位组员扮演咖啡师,让参与者能真正进入咖啡馆的情境,发生一次真实的互动。

  • A/B 测试

    我们想看参与者对 Tip Later 功能的态度,并对 Tip Now 这一屏的交互做 A/B 测试。

  • Blend App

    我们看了参与者对 Tip Later 通知的态度,并评估了 App 上 Tip Later 的用户流程和交互。

  • 员工印章

    我们观察参与者会不会注意到员工印章,以及他们怎么理解印章上写的信息。

迭代

根据参与者的反馈打磨了设计。

Blend POS System

发现 1

参与者对 POS 上的 Maybe Later 选项感到困惑:它是什么、怎么用,页面上都没说清楚。

如果它会把我带到 Blend App,那我希望 POS 上能有点提示。
— P3
我不知道它(「maybe later」)是什么意思、会带我去哪儿。点它的时候我感到焦虑。
— P2

方案 1

我们把 Tip Later 选项从「立刻给小费」的那几个档位里拆出来,让两种选择清楚地分开,并把 Maybe Later 改名为 Tip Later with Blend。

Blend POS —— Tip Later with Blend 被单独拆出来,标注清楚(改后)。
Blend POS —— Maybe Later 挤在小费档位旁边(改前)。

发现 2

参与者喜欢滑杆给的那种自主感,但有些人很难精确地调到某个百分比,过程里反而更紧张了。

我喜欢这个小费滑杆,交互挺好玩的。花钱还能得到一点奖励的感觉。
— P1
我希望能更自由一点,比如点一下按钮,直接输入一个具体的百分比或金额。
— P2

方案 2

我们保留滑杆来做精确控制,同时加上「-1%」和「+1%」两个按钮,让小步调整更快——在灵活和效率之间找平衡。

Blend POS —— 滑杆加上 ±1% 按钮,又快又准(改后)。
Blend POS —— 只有小费滑杆(改前)。

Blend App

发现 3

参与者不清楚奖励星星是什么意思,也希望能更早看到自己当前的奖励进度,尤其是它和自己给小费这件事的关系。

我不知道一颗星代表什么。
— P2
所以我有 20 颗星??我觉得应该有个地方告诉我现在有多少颗。如果我知道自己已经 19 颗、再差一点就能换东西,说不定我就多给一些了。
— P3

方案 3

顾客通过 QR 码或通知打开 App 时,我们立刻把他的奖励总数显示出来;并用不同的配色,把他在 POS 上选的是「现在给」还是「稍后给」清楚地区分开。

Blend App —— 打开即显示奖励总数,并用配色区分「现在给」和「稍后给」(改后)。
Blend App —— 奖励星星没有任何上下文(改前)。

发现 4

参与者表示,想在决定小费金额之前先看一下自己的订单明细——他们希望做这个决定时手上有更多信息。

我希望它能建议一个小费比例,这样我对该给多少更有数。
— P1
只知道一个总价就要我填金额,我感到焦虑。
— P3

方案 4

我们加了订单明细功能,引入 Usual Tip(常用小费)选项,并显示每一颗奖励星星对应的金额,让用户能基于自己的订单和可能拿到的奖励,做一个心里有数的决定。

Blend App —— 订单明细、Usual Tip 选项,以及每颗星对应的金额(改后)。
Blend App —— 填小费金额时没有任何订单上下文(改前)。

最终原型

把最终设计可视化出来。

服务蓝图

一张服务蓝图,把体验铺开在等待、下单、小费选项、支付、取单和 Blend App 这几段上。

风格指南

一份风格指南,涵盖字体、颜色(品牌色 36343B、黑 333333、灰阶、白)、logo、组件和图标。

验证

拿真实的生意验证了我们的设计。

哪些地方成立

  1. 01所有员工都认可 Blend 促成的那种人与人的连接,特别是能收到顾客留言这件事。
  2. 02所有员工都喜欢 POS 上的滑杆,尤其提到能看清小费金额和百分比之间的对应关系。
  3. 03员工认为 Blend 很适合那些经常来、而且基本都点同样东西的回头客,这验证了我们对目标顾客的判断。
  4. 04员工觉得有了 Blend,他们可以更专注在自己的活儿和服务上,而不是收到了多少小费上。

待改进之处与下一步

  • 01

    一笔小费分给多位员工。

    员工希望,当一单里咖啡师和收银员都出了力时,顾客能有办法同时给多个人小费。

下一步

做一个让顾客把小费拆给多位参与这一单的员工(比如收银员和咖啡师)的功能。

  • 02

    让「稍后给」真的会回来。

    有些员工担心,如果顾客在收银台没给,他们赶时间,之后会不会就忘了。

下一步

用地理围栏做基于位置的提醒,并为常点的订单引入可选开启的自动给小费,同时随时可以调整或关掉。

  • 03

    不要给员工带来新的偏向。

    有些员工担心这个 App 会改变员工的行为,比如大家都更想站收银台,因为那个位置和顾客打交道更多。

下一步

给咖啡馆提供灵活的小费设置,允许它们只开启「整店共享小费」。

成功指标

衡量 Blend 到底有没有用、影响有多大。

相关方层面

  • 顾客满意度

    和小费体验相关的整体顾客满意度分数提升。

  • 员工满意度

    和小费、被认可相关的员工满意度分数提升。

  • 顾客留存

    回头客到店次数增加。

App 层面

  • App 下载使用率

    下载并实际在用 Blend App 的顾客占比。

  • 留言率

    顾客在给小费时附上一条自己写的留言的频率。

  • Tip Later 转化率

    选了「稍后给」之后真的给出小费的比例。

  • 奖励计划参与度

    实际参与奖励计划的顾客数量。

生意层面

  • 给小费的频率

    包含小费的交易占比。

  • 平均小费金额

    每笔交易的平均小费金额变化。

关键收获

这个项目让我学到了什么?

  • 服务设计:同时面对多个触点。

    这是我第一次做服务设计,我因此看清了要在多个触点上做出一个完整方案有多复杂——从数字界面一直到实体互动。这个项目让我们对「设计一整段服务体验」理解得更深,也更清楚设计师在用户旅程中促成有意义的互动时扮演什么角色。

  • 在生意需求和顾客体验之间找平衡。

    我们是同时从生意和顾客两个角度来重新设计小费这件事的。「稍后给」这个功能看上去对眼前的收入有风险,但我们想做的是双赢——强调人与人的连接,把更多决定权交回顾客。这个做法想换来的是顾客的忠诚,以及更用心、可能也更大方的小费,让给小费从一项交易义务,变成一次真诚的感谢。

@2026. Designed & Built by Clemens. Powered by Claude Code.