TikTok Pay · UX Case Study
TikTok · Pay · Market LaunchTikTok · Pay · 市场上线阶段

TikTok Pay

From Delayed Refunds to an Actively Used Wallet 从退款痛点到信任建立

Card refunds could take 7–14 business days, while COD and unsupported payment methods required an alternative refund destination. TikTok Pay enabled eligible refunds to be credited to a regulated wallet immediately. I designed the journey from account activation and KYC through refund selection, balance use, security support, and account closure. 银行卡退款可能需要等待 7–14 个工作日,COD 与不支持原路退回的支付方式则需要其他退款承接方式。TikTok Pay 让符合条件的退款即时进入受监管的钱包。我负责从账户激活与 KYC、退款方式选择,到余额使用、安全支持和账户关闭的完整体验。

Role角色  UX Designer · Core journeysUX Designer · 核心流程 Markets市场  Vietnam · Malaysia越南 · 马来西亚 Delivery周期  Approximately 3.5 months · PRD to launch约 3.5 个月 · PRD 至上线 Balance MAU exceeded target余额 MAU 超出目标 Wallet-refund adoption increased钱包退款采纳率提升
00 · Project Overview

Designing a regulated wallet around the refund moment

TikTok Pay launched first in Vietnam and Malaysia. I designed the core customer journey across account activation, know-your-customer (KYC) verification, refund selection, balance use, security support, and account closure. The resulting framework was structured for reuse across subsequent markets.

Role
UX Designer for core journeys
End-to-end interaction design, information architecture, and launch support.
Collaboration
PIPO UED, Product, Legal, Risk, and TTS Engineering
A cross-functional delivery model shaped by local regulatory requirements.
Markets
Vietnam and Malaysia
A shared product architecture with configurable market rules.
Delivery
Approximately 3.5 months
From product requirements to the first market launch.
The project in one sentence

Refunds to the original payment method could take 7–14 business days, while COD and unsupported methods required an alternative destination. TikTok Pay allowed eligible refunds to be credited to a regulated wallet immediately and made the balance available for subsequent TikTok Shop purchases, subject to local rules.

01 · Problem Definition

Refund latency was both a service problem and an activation opportunity

Southeast Asian transactions span cash on delivery (COD), cards, and local payment methods. Card refunds usually return to the original payment method and may take 7–14 business days. COD and payment methods that do not support refunds to the original method require a separate destination.

Customer issue 01

Extended waiting time

Customers could not use the refunded amount while it remained in transit, interrupting the path to a replacement purchase.

Customer issue 02

Unclear refund status

Uncertainty about destination, amount, and arrival time reduced confidence and generated avoidable support demand.

Customer issue 03

No reusable balance

In COD-heavy journeys, the platform lacked a consistent way to receive funds and support a subsequent purchase.

Product transition

From a closed-loop balance to a regulated wallet

The existing TTS Balance could receive certain refunds and be spent only within TikTok Shop. TikTok Pay introduced a licensed account, broader funding and withdrawal capabilities, and mandatory KYC. The design therefore had to communicate additional value without obscuring consent or compliance obligations.

AccountA regulated wallet rather than a platform-only balance.
FundingEligible refunds and supported top-up methods.
UseTikTok Shop payment, balance management, and market-specific withdrawal options.
ComplianceKYC, account limits, transaction controls, and customer support requirements.
02 · Design Goals

Measure adoption without losing sight of trust

The success framework combined business adoption, refund behaviour, onboarding quality, and continued balance use. This prevented a single conversion metric from masking customer friction elsewhere in the journey.

01
North-star metric
Balance monthly active users
Whether customers returned to view or use their wallet after activation.
02
Refund adoption
Share of eligible refunds credited to TikTok Pay
Whether immediate wallet credit solved a meaningful refund need.
03
Journey quality
Onboarding and KYC completion
Whether customers understood the account and could complete required verification.
04
Continued utility
Balance payment volume share
Whether credited funds remained useful beyond the original refund event.
Principle 01

Reduce avoidable effort

Keep regulatory steps intact while removing duplicate input, unclear prerequisites, and unnecessary navigation.

Principle 02

Make status legible

Explain what is happening, how long it will take, and what the customer can do next.

Principle 03

Demonstrate utility

Connect activation to a relevant use case instead of presenting the wallet as an abstract financial product.

03 · Research and Market Context

Wallet adoption starts with a high-intent use case

A review of regional wallets, payment apps, and TikTok Shop journeys showed that successful wallet entry points were tied to an immediate customer objective. For TikTok Shop, refunds provided the clearest combination of urgency, customer value, and product relevance.

GrabPayEmbedded wallet utility in transport, food, and merchant payment journeys.
ShopeePayUsed checkout benefits and marketplace integration to support repeat use.
MoMoCombined local payment coverage with a broad everyday-service ecosystem.
Touch 'n GoBuilt familiarity through transport and daily payment use cases.
Research synthesis

Customers did not need another generic wallet proposition. They needed a faster and more predictable way to receive money already owed to them.

Southeast Asian wallet and payment brand research
Regional benchmark covering wallet entry points, onboarding requirements, payment utility, and trust signals.
Vietnam

Visible verification and status

Research indicated that clear authentication, refund confirmation, and transaction status were essential in a fast-growing wallet market.

Malaysia

Familiar payment conventions

A mature banking and wallet ecosystem made account tiers, FPX support, and clear limits important to the product model.

Shared opportunity

Refund as the activation moment

The refund journey gave customers an immediate reason to understand and activate the account, rather than asking them to register without context.

04 · Core Design A

Preserve regulatory requirements while reducing avoidable effort

As a regulated wallet, TikTok Pay required KYC. Longer registration flows increase abandonment risk, so the design focused on explaining value, setting expectations, and reducing repeated input without weakening verification.

Entry context

Explain the relevant benefit

Refund, top-up, payment, and withdrawal entry points used the same account flow but introduced the benefit appropriate to that task.

Expectation setting

Preview steps and documents

Customers saw the verification sequence and required information before committing to the process.

Consistency

Use one core verification sequence

A shared PIN, OTP, identity, and consent structure reduced divergence across entry points and markets.

TikTok Pay onboarding information architecture
A shared onboarding architecture supported several entry contexts while keeping compliance steps consistent.
Refund onboarding entry
Refund entry
Lead with immediate credit
The value proposition is tied directly to the customer's current refund decision.
TikTok Shop onboarding entry
Shop entry
Connect activation to checkout
Wallet setup appears in the context of a purchase rather than as a detached registration task.
Top-up onboarding entry
Top-up entry
Clarify supported funding
The entry explains why account verification is required before adding funds.
Withdrawal onboarding entry
Withdrawal entry
Set eligibility expectations
Market-specific limits and verification requirements are made visible before the task begins.

Validate the assumptions behind the onboarding design

Two comparative product experiments tested whether information structure and trust language changed customer behaviour. Commercial metrics, sample sizes, and absolute conversion values are confidential, so the findings below are presented directionally.

Hypothesis 01 · Value communication
Question

Should the landing page explain the full value in one view?

The page needed to establish five ideas before registration: broad payment utility, security, ease of use, relevant benefits, and official TikTok endorsement.

Single-page variantPresented the complete proposition in one scannable page.
Paginated variantDistributed the same proposition across several swipeable pages.
Single page supported

The single-page version produced stronger entry engagement and a modestly better activation outcome. Giving customers one coherent overview reduced additional navigation before a high-commitment financial registration flow.

Single page · Supported direction
Single-page TikTok Pay value proposition used in the onboarding experiment
Paginated alternative
Hypothesis 02 · Trust communication
Question

Would explaining data use reduce verification anxiety?

Research indicated that customers were less concerned about the number of steps than about why TikTok Pay needed personal information and how it would be protected.

ControlTask instructions explained what to enter or capture.
Trust-led variantEach step also explained purpose, protection, and encrypted handling where relevant.
Trust language supported

The trust-led version improved overall onboarding completion consistently across both major mobile platforms. The result supported keeping security explanations within the task, rather than relying on a separate policy page.

01 · Phone number
Control
Phone-number step before trust copy was added
Trust-led variant
Phone-number step with purpose and information-protection copy
02 · One-time password
Control
One-time-password step before trust copy was added
Trust-led variant
One-time-password step with information-protection copy
03 · Payment PIN
Control
Payment PIN step before trust copy was added
Trust-led variant
Payment PIN step with information-protection copy
04 · Identity document preparation
Control
Identity-document preparation step before contextual guidance
Trust-led variant
Identity-document preparation step with localized guidance and trust copy
Disclosure: Results are directional and desensitised. Exact traffic, sample sizes, conversion values, and market-level breakdowns are not published. The experiments informed the design decision but are not presented as proof that copy alone caused every observed change.
05 · Core Design B

Let speed and utility support an informed refund choice

The refund selector needed to explain a genuine service difference without steering customers through visual coercion. Immediate wallet credit was presented alongside the estimated 7–14-business-day timeline for the original payment method, with both destinations clearly labelled.

DestinationState exactly where the refund will be credited and which account will receive it.
TimingUse a concrete estimate rather than vague labels such as “fast” or “standard”.
UtilityExplain where the wallet balance can be used and whether withdrawal is available.
FallbackWhen account limits or eligibility prevent wallet credit, preserve a clear alternative route.
TikTok Pay refund method selection
The option architecture compares destination and timing directly while keeping the original payment method available.
Wallet balance limit state
Limit management
Explain why wallet credit is unavailable
A clear balance-limit state prevents a failed refund and provides an alternative destination.
Account upgrade during refund
Malaysia account tiers
Offer an upgrade in context
Basic-account customers can review the benefit, requirements, and implications before choosing to upgrade.
Wallet payment at checkout
Balance reuse
Maintain continuity at checkout
The same balance language and status cues carry from refund confirmation into payment.
06 · Core Design C

Design the wallet for balance visibility and customer control

After a refund was credited, customers needed to understand the available balance, transaction history, account limits, protection options, and how to leave the product. The wallet home therefore prioritised money visibility and the next relevant action over promotional content.

TikTok Pay welcome screen
First visit
Explain what changed
A short introduction confirms account activation, identifies the wallet, and directs attention to the available balance.
TikTok Pay wallet home
Regular use
Balance first, actions second
Balance, recent activity, limits, and supported money movement are grouped by customer priority.
Security support

Make protection and reporting routes understandable

The security centre explains available controls, the scope of account protection, and the information required when reporting an unfamiliar transaction. The language avoids implying guaranteed reimbursement and directs customers to the appropriate review process.

TikTok Pay security centre
Security controls and reporting entry points are grouped around the customer’s immediate concern.
Select an unfamiliar transaction
Report
Select the relevant transaction
Customers begin from a recognisable transaction record rather than entering details from memory.
Security report form
Provide evidence
Request only actionable information
The form explains why each detail is required and keeps the report focused.
Submitted security report
Confirmation
Set expectations after submission
A clear receipt, review status, and support route reduce uncertainty after a high-stress action.
Account closure

Treat exit as part of the product

Account closure remains self-service where eligible. The journey checks balance and pending activity, explains the consequences, and provides reactivation guidance in line with market policy and compliance requirements.

TikTok Pay account closure confirmation
Closure requirements and consequences are reviewed before final confirmation.
07 · Cross-Market Localisation

A shared product architecture with market-specific account and payment rules

Localisation extended beyond translation. Vietnam and Malaysia shared the same wallet principles, but differed in account tiers, limits, payment rails, verification logic, and the expectations created by their existing wallet ecosystems.

Vietnam
Initial launch market
AccountVerified onboarding with market-specific identity and consent requirements.
CurrencyVND presentation and locally familiar number formatting.
PaymentLocal bank transfer and relevant wallet references, including MoMo and ZaloPay conventions.
TrustProminent authentication, refund confirmation, and transaction-status cues.
Malaysia
Second launch market
AccountBasic and Verified tiers with explicit upgrade value and requirements.
CurrencyMYR presentation and tier-specific balance limits.
PaymentFPX and locally familiar wallet conventions, including Touch 'n Go and Atome.
TrustClear limit management and eligibility messaging at the point of action.
Stable layer

Shared product principles

Balance hierarchy, status language, consent structure, and security patterns remain consistent.

Configurable layer

Market rules

Account tiers, limits, identity fields, payment methods, and compliance copy are configured by market.

Validation layer

Local review

Product, legal, risk, operations, and local research validate each market implementation before launch.

08 · Results and Impact

Early indicators showed adoption and framework reuse

The figures below are directional and desensitised because absolute commercial values are confidential. They describe early post-launch performance and do not attribute every outcome to design alone.

Above target
Balance monthly active users
Early usage exceeded the launch target.
Increased
Wallet-refund adoption
Adoption rose from a pre-launch single-digit baseline.
Rapid growth
Vietnam non-COD TikTok Pay share
The new wallet gained meaningful early share in eligible flows.
Target exceeded
PIPO pay-in TPV share
Share exceeded the internal stretch target.
On schedule
Regulatory readiness
Vietnam and Malaysia completed required launch reviews on time.
Reusable
Design framework
Core patterns were carried into subsequent Southeast Asian and global market work.
09 · Reflection

What this project changed in my practice

01
Compliance constraints define the product
KYC, account limits, consent, and transaction controls cannot be added after the interaction model is complete. They must shape the information architecture, state model, and customer explanation from the beginning.
02
Transparent differences are more persuasive than visual emphasis
In the refund selector, the clearest reason to choose TikTok Pay was the service difference itself: immediate wallet credit compared with an estimated 7–14 business days. The design’s role was to make that difference easy to understand.
03
Global systems need a stable core and configurable rules
Reusable design depends on separating universal product principles from market-specific limits, payment rails, identity requirements, and legal language.
04
Reduce information density under stress
Refund problems, account restrictions, unfamiliar transactions, and closure are high-stress moments. Each screen should prioritise one clear decision, one next action, and an accessible route to further detail.
00 · Project Overview

项目概览

覆盖 Onboarding、余额首页、安全中心、账号架构等核心模块;首先上线越南(VN)与马来西亚(MY),设计框架后续延展复用至东南亚及全球市场。

我的角色
UX Designer
核心用户流程端到端设计
团队构成
PIPO UED × PM
× Legal × Risk × TTS 工程
覆盖市场
VN · MY
框架复用至东南亚及全球市场
项目周期
~3.5 个月
PRD 完成 → Go-live
业务北极星
MAU 超额完成
大幅超出业务目标
退款核心指标
SEA 非原路退款渗透率显著提升
VN 上线首月即达成核心市场渗透目标
一句话说清这个项目

原支付方式退款可能需要等待 7–14 个工作日,COD 等场景还需要替代退款路径。TikTok Pay 为符合条件的订单提供即时钱包退款,并让余额可以继续用于 TikTok Shop 消费,在缩短等待时间的同时提升余额使用率。

01 · Problem Definition

退款体验是 TikTok Shop 的"隐形差评"

在东南亚市场,交易同时包含 COD、银行卡与本地支付方式。银行卡退款通常原路退回并可能等待 7–14 个工作日;COD 与不支持原路退款的支付方式则需要额外的退款承接方案。

等待周期极长
银行卡退款需 7–14 个工作日。用户在漫长等待中失去复购意愿,流量流失至竞品。
核心痛点
不确定感强
用户不知道"钱退到哪、退了多少、什么时候到",客服压力极大。
信任损耗
🔗
复购链路断裂
退款期间用户不会在 TTS 再次下单,VN 的 COD 占比尤其极高,没有余额池的退款是软肋。
GMV 损失

业务痛点:闭环余额走到了边界

原有的 TTS Balance(闭环余额)存在本质局限,必须升级为持牌开环钱包。

旧方案
TTS Balance
闭环余额
牌照 无,不受监管
入金方式 仅退款
出金方式 仅 TTS 内消费
余额上限 (MY) 监管规定上限
KYC 不需要
新方案
TikTok Pay
开环持牌钱包
牌照 PIPO 本地持牌 (SBV/BNM)
入金方式 退款 + 主动充值
出金方式 TTS 消费 + 提现至银行
余额上限 (MY) 监管规定上限 (Verified 用户)
KYC 强制
核心矛盾

要提供更好的退款体验和余额能力,必须升级为持牌开环钱包;但持牌意味着强制 KYC,这本身就是一道用户门槛。设计的核心命题由此诞生:如何让用户愿意跨越 KYC 门槛,去换一个更好的退款体验?

02 · Design Goals

北极星指标与设计原则

📊
业务北极星
TikTok Pay 余额 MAU
月活跃余额用户数代表有多少人真正在用这个钱包,是所有设计努力的综合验证。
💸
退款侧
非原路退款渗透率
退款到 TTPay 的比例,衡量退款引导设计是否有效转化用户。
🚀
激活侧
Onboarding 完成率
从 Landing 到 KYC Verified 的完成率,衡量注册流程的摩擦程度。
🔄
留存侧
余额 TPV 在 TTS 支付占比
衡量用户是否真的把余额花出去,而非到账后立刻提现沉睡。
01
Reduce Friction
降低摩擦
KYC 是必须的,但我们有责任让它尽可能顺滑。每一步都要有明确的进度感、合理的预期管理和最少的输入负担。
02
Build Trust
建立信任
金融产品的第一课是安全感。每一个安全功能(Kill Switch、生物识别、ATO 补偿)都是建立信任的机会,而不只是合规负担。
03
Show Value
呈现价值
余额不是"存在那里的钱",而是"随时可以用的购物力"。设计需要主动让用户感知余额的价值,驱动消费意愿而非沉睡。
03 · Competitive Insights

钱包增长有一个底层逻辑:场景决定一切

研究竞品时,我们发现一个反复出现的规律:成功的电子钱包都是先在一个"垄断性场景"站稳脚跟,再向外扩展的。

🇨🇳 AliPay
中国
锚点场景
淘宝电商担保交易
电商必须用 余额沉淀 余额宝增值 日常生活扩展
生态内强制场景驱动海量冷启动,余额增值机制锁定用户长期留存。
🇨🇳 WeChat Pay
中国
锚点场景
熟人红包 / 社交收付款
发红包 绑银行卡 覆盖线下商户
社交货币驱动注册,低摩擦绑卡完成激活。
🇻🇳 MoMo
越南
锚点场景
手机充值 / 水电缴费
高频刚需 余额沉淀 外卖/机票/电影
高频场景建立使用习惯,再向高价值场景渗透。
🇲🇾 Touch 'n Go
马来西亚
锚点场景
高速公路过路费(硬件绑定)
物理场景锁定 TnG eWallet 数字化 线下零售
物理基础设施形成的垄断场景,数字化迁移顺水推舟。
关键洞察

TikTok Pay 的"垄断性起点场景"是电商退款。这是用户在 TTS 生态内最痛、最频繁、且情绪最强烈(等钱)的时刻。如果我们能在这个时刻做到"退款即刻到账 + 体验远胜竞品",用户就有理由开通并记住 TikTok Pay。

Market Research · SEA e-Wallet Landscape

东南亚电子钱包:竞争格局全景

东南亚5国正加速向无现金社会迈进,但各市场受银行体系普及度与政府支持力度影响,钱包发展路径差异显著。理解全局,才能精准定位 TikTok Pay 的切入优先级。

🇻🇳Vietnam重点
🟢 增速最快
银行渗透仅 42%,政府力推无现金化,2030 年将超越印尼成东南亚最大钱包市场。用户更信任国际平台钱包。
→ TTpay:开环 + 社交转账
🇮🇩Indonesia
🟢 线上最大市场
银行渗透 55%,QRIS 标准推动线下高速增长。头部品牌 4 个,用户按场景分割使用,聚合是关键。
→ TTpay:开环 + 场景聚合
🇹🇭Thailand
🟡 银行强势主导
银行渗透 96%,线下 TrueMoney 深度绑定 7-11,强优惠驱动,钱包难撼银行地位。
→ TTpay:闭环 + Paylater
🇲🇾Malaysia重点
🟡 线下快速增长
银行渗透 90%,TNG 线下强势,线上仍银行主导。信用卡渗透率东南亚最高,Paylater 接受度高。
→ TTpay:Paylater 线上切入
东南亚各国钱包品牌使用率
聚焦 VN & MY 的逻辑

越南:银行体系薄弱 + 用户天然信任平台钱包 → 开环壁垒低,TikTok 平台属性即竞争力。
马来西亚:支付方式成熟、用户决策理性 → Paylater 是差异化突破口,直播电商高频交易是天然切入场景。两市场覆盖「高速新兴」与「成熟有缝」两种 SEA 典型形态,研究结论具代表性与对比价值。

Competitive Deep Dive · VN & MY

VN & MY 竞品深度分析

结合竞品格局与用户访谈,深入理解两市场差异,明确 TikTok Pay 在 VN 和 MY 的差异化切入方向。

🇻🇳
Vietnam
MoMo 垄断趋势加速,平台内机会优于平台外
竞争态势
  • MoMo 推进 Super App 战略:新增 Golden Pocket 理财、机票 / 电影票务、AI 安全监控等
  • 与越南大企业战略合作(Saigon Co.op、PVOIL、Hanwha Life),品牌势能持续上升
  • ShopeePay / ZaloPay 线下扩张放缓,MoMo 竞争压力减小,垄断趋势加速
↑ 市场空缺度
不需要有
自动充值Play games to win
Must have · 市场有空白 ✦
和各种商家合作 线上 & 线下通用 社交 / 家庭属性
Nice to have
娱乐购票 储蓄生息 保险 / Cash Loan
Must have · 竞品已具备
系统稳定 / 使用便捷 有 Promotion 支付 / 提现 / 转账无手续费 支付各账单 / Paylater 绑卡直扣 手动充值 Loyalty Program
TTPay 切入策略
  • 平台内越南用户天然信任「平台自有钱包」(受 ShopeePay 教育),接受度高
  • 关键MoMo 在 TTS 支付无需 OTP / 密码,用户反觉安全感低 → TTPay 需强调认证透明
  • 促活价格敏感市场,10% off 即可大幅提升用户尝试意愿
  • 平台外依托 TikTok 平台,加强社交与娱乐功能
🇲🇾
Malaysia
多支付方式竞争,TNG 强势,Paylater 是破局关键
竞争态势
  • TTPay 需与 Online Banking、TNG、GrabPay、CCDC 全面竞争,不只是钱包之间的战争
  • 传统 E-wallet 便利性偏低(需充值)+ 优惠少,但 TNG 在线下和校园场景已深度渗透
  • 信用卡渗透率 24%,为东南亚最高之一,马来用户对 credit 接受度显著高于越南
↑ 市场空缺度
不需要有
自动充值
Must have · 市场有空白 ✦
提供 Paylater 服务 和各种商家合作 有 Promotion 线上 & 线下通用
Nice to have
社交 / 家庭属性 可以绑卡直扣 娱乐购票 储蓄生息 保险 / Cash Loan Play games to win 支付各账单
Must have · 竞品已具备
系统稳定 / 使用便捷 支付 / 提现 / 转账无手续费 Loyalty Program 手动充值
TTPay 切入策略
  • 破局内置 Paylater 是最强杠杆:申请流程简单 + 月结对账,直接蚕食 Online Banking 用户
  • 场景直播抢购是 TTPay 核心切入点:快速 checkout 需求强烈,体验优势最显著
  • 转化Online Banking 痛点明确(跳转繁琐 + 夜间维护),转化意愿相对最高
  • 族裔华裔需提升 TikTok 平台信任感;穆斯林需满足伊斯兰金融原则(无利息 Riba)
竞研推导 → 设计方向

VN:安全感是 TTPay 的核心差异化。用户反映 MoMo 在 TTS 支付无需认证,反而让他们感到不安全,这直接驱动了 Onboarding 中「审核态状态透明」的设计决策——让用户在每个支付关键节点都感知到 TTPay 的安全保护。

MY:Paylater + 直播购物 = 最强破局组合。这一洞察推动了 Wallet Home 快捷支付入口的优先级决策,确保直播抢购场景下 TTPay checkout 体验最优。

04 · Core Design A

Onboarding——把 KYC 的摩擦降到最低

设计挑战
持牌钱包的合规要求决定了 TikTok Pay 必须完成 KYC。注册流程越长,用户放弃的风险越高。设计挑战是在不削弱合规要求的前提下,清楚解释价值、管理预期并减少不必要的输入。

竞品 KYC 摩擦对比

Phase 1 最大的用户门槛是 KYC,我们研究了本地竞品的开户门槛:

Touch 'n Go eWallet
低门槛进入
GrabPay (MY)
生态内无感知
MoMo (VN)
先开通再升级
TikTok Pay
强制 KYC(合规)

设计启示:我们无法绕过 KYC(合规硬约束),但可以① 让 KYC 的过程感觉值得,以及② 利用 MY 的 Basic 账户机制先体验再升级,降低冷启动门槛。

Design Structure Overview

Onboarding 设计总览

01 · Goal
为 TikTok Pay 所有入口创建无缝注册流程
通过提升注册转化率,推动 TTPay 用户渗透率增长——确保每一个触发场景都有完整、顺畅的 Onboarding 路径覆盖。
02 · Context · KYC 账户层级
VN / MY 项目要求用户完成 Full-KYC 才能激活钱包服务,因此仅启用 L1 和 L3,并附带相应功能限制以满足当地监管要求。
L1 · Basic
较低余额上限
仅退款入账
不可提现 · 不可充值
L3 · Verified
更高余额上限
退款 + 充值 + 提现
Full-KYC 强制认证
03 · Workflow · 用户注册路径总览
触发层
核心注册流程(所有入口共用)
结束态
🛍 TikTok Shop
💰 Top Up
🏦 Withdraw
↩️ Refund
📢 Banner
Landing Page(各入口差异化)
📣 KSP 价值主张前置
📋 注册步骤预览
🎯 场景化利益点
Pure Onboarding(所有入口完全一致)
🔐
PIN 设置
📱
Phone OTP
🪪
KYC 认证
✅ 成功(有旧余额)
✅ 成功(无旧余额)
⏳ KYC 审核中
🔄 KYC 补件
✕ Drop off / 失败
规则: 结束态始终将用户引回他们原本想完成的操作(退款回退款页 / Top Up 回充值页 / Withdraw 回提现页)。
Design Principle · Landing 设计原则 · Landing
Motivate users with the right value proposition — before they commit. 在用户决策之前,用对的价值主张给出注册的理由。
For landing pages, motivate users with proper value proposition and information to increase conversion rate. Landing Page 是转化的关键节点——在用户进入注册流程前,以精准的价值主张降低决策门槛、提升转化率。
01
KSP · Scene-based Differentiation KSP · 场景差异化前置
Always Show KSP to Drive Upgrade Willingness 始终展示核心卖点,驱动用户主动升级
Low-demand entrance 低需求入口
e.g. TikTok Pay home — show all benefits to build full awareness 如 TikTok Pay 首页——展示全部权益,全面建立认知
High-demand entrance 高需求入口
e.g. Withdraw — show only benefits tied to the current scenario 如提现入口——只展示当前场景相关的利益点,减少认知干扰
02
KYC · Pre-disclosure KYC · 流程前置告知
Show Full KYC Steps Before Registration Starts 在注册开始前展示完整 KYC 步骤
Before users enter the registration flow, preview all KYC steps upfront — so they know what's coming, set proper expectations, and are far less likely to drop off midway. 在用户进入注册流程之前,先预告完整的 KYC 步骤——让用户建立心理预期,知道前方有什么,显著降低中途放弃率。
💡 Pre-informed → Expectation set → Drop-off reduced 💡 信息前置 → 心理预期建立 → 流程完成率提升
04 · High-level IA · 系统信息架构
触发点 → L1-L3 判断 → Landing → 纯注册流程 → 结束态。点击查看原始设计稿。
High-level IA
点击查看大图
注册漏斗中的三个关键跌落点
仅表达相对跌落位置,不代表真实流量或转化比例。
入口开始
Landing Page → 点击注册
用户心理:"这是什么?值得我花时间吗?"
风险:价值主张不清晰
↓ 第一处明显跌落
中段继续
协议签署 + 手机 OTP
用户心理:"这有点麻烦,我真的需要吗?"
风险:步骤感模糊
↓ 主要跌落点
末段完成
KYC 证件拍照 + 活体检测
最高跌落点
用户心理:"这是要干嘛?我的信息安全吗?"
注册流程拆解为 4 个明确步骤
🎯
STEP 01
价值前置 + 步骤预览
先让用户看到注册后能得到什么,再告知共 4 步完成
📱
STEP 02
手机 OTP 验证
绑定手机号,进度条始终可见
🔐
STEP 03
PIN 设置
6位支付 PIN,安全感建立
🪪
STEP 04
KYC 认证
证件拍照 + 活体检测,前置信任说明
决策 01 / 04
在注册前做"价值预期管理",而不是直接进入表单
在 Landing Page 明确传达五类核心价值主张——全场景一站式体验、安全可信赖、简单便捷易用、专属福利优惠、官方品牌背书——让用户在投入注册时间前先建立完整的价值认知,降低"这值不值"的疑虑。
决策 02 / 04
前置告知步骤总数 + 话术聚焦确定性
在注册开始前告知用户大概需要完成几步,能复用或跳过的步骤则动态略过,实际路径因人而异。关键在于话术——用「你还有 1 步完成注册」取代「请完成 KYC」,让用户始终清楚距离完成还差多少,确定性消除焦虑、显著提升完成率。
决策 03 / 04
Onboarding 全流程植入安全感文案
在手机号输入、OTP 验证、PIN 设置、证件拍照每个步骤中,持续明确告知用户信息用途(法律合规要求)与保护方式(加密存储、不共享第三方),消除"我的信息会被怎么使用?它安全吗?"的顾虑,而非仅靠步骤简化来提升完成率。
决策 04 / 04
审核态的"状态透明"设计(KYC 审核期间)
KYC 审核期间设计明确的"审核中"状态页:诚实展示当前进度与结果通知方式——多数情况下机审可秒级通过,无需漫长等待;提供"审核完成后通知我"选项;MY 审核期间允许继续使用 Basic 账户功能——退款仍可到账,不阻断当前需求。

用实验验证 Onboarding 的关键假设

两组对照实验分别验证信息组织方式与安全感文案是否影响用户行为。商业指标、样本量与绝对转化数据均属敏感信息,以下只保留实验方法、方向性结果与由此形成的设计决策。

假设验证 01 · 价值沟通
验证问题

Landing Page 是否应该在一页内讲清完整价值?

用户在开始注册前,需要理解支付场景、安全性、易用性、相关权益与 TikTok 官方背书五类信息。

单页方案在一张可快速浏览的页面中呈现完整价值主张。
分页方案将相同内容拆成多个页面,需要逐页滑动查看。
单页方向得到支持

单页方案带来了更强的入口互动,并在开通结果上保持小幅优势。对于需要较高投入的金融注册流程,一次建立完整认知比增加翻页探索更有效。

单页方案 · 支持方向
Onboarding 实验中的 TikTok Pay 单页价值主张方案
分页备选方案
假设验证 02 · 信任沟通
验证问题

解释信息用途,能否降低身份验证阶段的不安?

用研发现,用户担心的重点不是步骤数量,而是为什么需要提交个人信息,以及这些信息会如何被保护。

对照方案只说明当前需要输入或拍摄什么。
信任增强方案在相关步骤同步说明信息用途、保护方式与加密处理。
安全说明方向得到支持

信任增强方案在两大移动平台上都带来了更好的整体完成表现。因此,安全说明被保留在操作现场,而不是只放在独立政策页面中。

01 · 手机号输入
对照方案
加入信任说明前的手机号输入步骤
信任增强方案
说明信息用途与保护方式的手机号输入步骤
02 · 一次性密码
对照方案
加入信任说明前的一次性密码步骤
信任增强方案
加入信息保护说明的一次性密码步骤
03 · 支付 PIN
对照方案
加入信任说明前的支付 PIN 步骤
信任增强方案
加入信息保护说明的支付 PIN 步骤
04 · 证件拍摄准备
对照方案
加入场景化说明前的证件拍摄准备步骤
信任增强方案
加入本地化拍摄指引与信任说明的证件准备步骤
数据披露:以上结果经过脱敏,仅表达方向,不公开流量、样本量、绝对转化率或市场拆分数据。实验为设计决策提供了证据,但不将所有变化单独归因于文案。
🔑 MY 独特方案

MY 的 Basic 账户机制带来了额外机会:用户在申请退款时,如果 Basic 账户余额已满(账户余额上限)或需要提现,系统会自然触发 Verified 升级引导。这个时机比"首页弹 KYC 引导"更有效——用户在退款场景下有明确的升级动机("我需要提现这笔钱")。

关键设计文档 · Onboarding Entry Points

5 个入口,1 套核心注册流程

每个触发场景的 Landing 页上下文不同、结束态各异,但注册核心流程(L1-L3 Pin & Phone & KYC)保持统一——这是在有限工程资源下最大化设计覆盖的系统决策。

最复杂入口
触发自 TikTok Shop 多个位置(商品页、购物车、订单页),需处理"用户之前有 TTS 闭环余额"与"无闭环余额"两套结束态,Landing 需同时传递 TikTok Pay 相对于旧余额的升级价值。
TikTok Shop 入口流程图
点击查看大图
05 · Core Design B

退款流程——让用户自然选择沉淀余额

核心矛盾:用户更倾向于"退回原卡"(熟悉、确定感强),但对平台而言"退到 TikTok Pay"才能带来资金沉淀和复购机会。如何让用户主动选择退到 TikTok Pay,而不是依赖强制或默认勾选?

时效差异是核心说服力
即时到账
退至 TikTok Pay 余额
退款后余额立即可用
可直接用于 TikTok Shop 购物

受账户等级与余额上限约束
VS
🏦
7–14 个工作日
退回原支付方式
等待期间复购意愿流失
无法追踪实时退款进度

无余额上限限制

时效差异本身就是最强的说服力,不需要通过视觉层级压制竞争选项。

用户申请退款时的三个心理问题
1
"我的钱去哪了?"
用户首先关注退款目的地是否可靠 → 设计需建立信任感
2
"哪个选项对我更好?"
用户在比较选项时看时效和便利性 → 即时 vs 7-14天的差异是核心说服点
3
"我以后能用吗?"
在支付场景与退款场景中直接将 TikTok Pay 作为默认支付方式呈现,降低用户感知门槛
决策 01 / 04
时效差异是核心说服力,不做视觉层级压制
在退款选项页,高亮展示"即时到账"并搭配"立即可用于 TikTok Shop 购物"说明;原路退回正常展示,不刻意弱化。时效差异本身就足够有说服力,不需要设计师的"魔法"。
✦ Recommended
退款至 TikTok Pay 被选中
退至 TikTok Pay 余额
即时到账
选择原路退回
退款至原卡被选中
退回 Visa 原卡
7-14 个工作日
决策 02 / 04
余额上限满时的降级设计
当 TikTok Pay 余额已满(MY Basic 账户上限 / Verified 账户上限),无法再退款至余额时:清晰说明"当前余额已达上限"(而非静默降级);同步引导"提现余额腾出空间"或"升级账户提高上限";避免用户困惑"为什么我不能退到余额"。
余额已满提示
余额已达上限
明确提示 + 引导升级
上限详情页
上限详情页
透明展示 + 升级入口
决策 03 / 04
MY 退款流程中的账户升级插入(高难度)
MY Basic 用户退款时触发升级引导,面临核心约束:用户此时高度关注"我的退款",任何打断主流程的引导都会破坏体验。我们的解法:退款主路径不被打断,在退款方式选择页自然露出 TikTok Pay 余额选项——用户在比较退款时效时主动看到升级价值,无需额外跳出引导;KYC 支持机审快速通过,整体等待感知极低。
未激活状态
激活前
余额选项内嵌引导
激活引导弹层
激活引导
底部弹层,不打断主流程
激活成功后
激活后
即时退款自动选中
决策 04 / 04
TTS Cashier 品牌无缝切换
用户注册 TikTok Pay 后,TTS 结算页自动将"TTS Balance"替换为"TikTok Pay Balance"展示。设计核心是功能继承的连续性——让用户感知到这是升级而非替换,品牌切换在无感知中完成。
收银台 Order Summary
收银台
TikTok Pay Balance 置首
支付方式 Sheet
支付方式 Sheet
品牌连续性呈现
全屏支付方式
全屏收银台
完整支付方式列表
06 · Core Design C

余额首页——让余额"值得花"

设计目标不仅仅是"展示余额",而是让用户感知到余额是"有价值的、随时可以用的购物力",从而主动充值和消费,而非在余额到账后立刻提现离场。

决策 01 / 04
高亮余额数字,强化"我有钱可以花"的感知
首页不展示余额上限,而是突出高亮余额本身,让用户第一眼就感知到"我的账户里有多少钱"——强化余额的资产感与可用感,驱动"有余额 → 去花"的心理转化,而非让用户把注意力放在上限限制上。
✦ First Entry
余额首页首次进入
首次激活
Welcome Sheet 传达价值
Regular State
余额首页常规态
常规态
余额高亮 + 场景引导
决策 02 / 04
余额首页作为支付与金融服务的主阵地
首屏以余额卡片为核心,向下依次展示金融服务入口(PayLater、信用产品等)、支付安全模块(Security 快捷入口 + "Here's how we keep you safe");首页同时承载各类营销活动 Banner,将促销与金融产品推广整合进同一场景,让余额首页成为 TikTok 支付与金融服务的统一主阵地。
余额首页 MY
余额 + 金融服务
PayLater 信用额度 + 安全模块
余额首页营销活动
营销活动 Banner
促销与金融产品推广整合
决策 03 / 04
安全中心——从"我的信息安全吗"到"敢付敢赔"
在余额首页显著位置设置安全中心入口,持续强化用户安全感:展示加密保护、实名认证等安全机制;同时推出"敢付敢赔"承诺——明确告知用户在遭遇盗刷、误付等情况时平台的赔付保障,将安全从"我不担心"升级为"出事了有人兜底"的主动背书。
TikTok Pay 安全中心与风险报告入口
安全中心
TikTok Pay 安全保障信息页面
敢付敢赔承诺
选择需要报告的异常交易
选择交易
异常交易安全报告表单
填写详情
安全报告提交成功与后续处理状态
提交完成
决策 04 / 04
无痛退出 + 一键重启,让用户拥有掌控感
不想使用时,用户可随时无摩擦地关闭 TikTok Pay——无需客服、无需填表,操作清晰直接;关闭后余额与账户信息保留,再次开启只需一键重新激活,无需重新完成 KYC。设计核心是"我随时可以走,也随时可以回来"——掌控感本身就是留存的理由。
TikTok Pay 关闭账户原因问卷
关闭问卷
关闭 TikTok Pay 账户前的确认页面
确认关闭
TikTok Pay 账户关闭成功页面
关闭成功
重新启用 TikTok Pay 账户的入口
一键重开
07 · Cross-Market Localisation

同一套框架,两个市场的不同答案

同一套产品框架需要在两个市场产生截然不同的用户体验,同时又不能为每个市场单独做一套设计——工程和设计成本都不允许。

🇻🇳
越南 (VN)
2025 年 11 月上线
账户层
无 Basic 账户层,直接 Verified 注册
货币
VND,无余额上限
支付方式
State Bank 指定合作银行转账
本地钱包
Link MoMo / ZaloPay
🇲🇾
马来西亚 (MY)
2026 年 1 月上线
账户层
Basic → Verified 双层,退款可触发升级
余额上限
Basic 上限 → Verified 上限
支付方式
FPX 网银(18 家银行 H5 跳转)
本地钱包
展示 TnG · Atome 跳 App 绑定
本地化的三个层次
🎨 表层
文案与货币
VN:Rp → VND;Link OVO/Dana → Link Momo/ZaloPay
MY:Rp → RM;Link OVO/Dana → Link TnG/Atome
⚙️ 中层
支付方式与 PI 列表
VN:State Bank 指定合作银行清单,直接转账
MY:FPX 网银(18 家银行 H5 跳转)+ TnG 展示 + Atome 跳 App 绑定
🏗 深层
账户逻辑与流程
VN:无 Basic 账户层,直接 Verified 注册,不显示余额 cap 进度条
MY:Basic → Verified 双层,退款可触发升级,有余额 cap 进度提示,账户升级引导卡片
设计师的收获

这个项目让我深刻理解了"灵活性 vs 一致性"的设计权衡。正确的做法是找到"不变的骨架 + 可变的血肉"——骨架(信息架构、核心流程、设计系统)保持统一,血肉(文案、支付方式、账户规则)可配置。设计解法:参数化组件而非复制粘贴,PI 管理组件通过"支持绑定/仅展示/需跳 App"三种 mode 参数控制不同支付方式的交互行为。

08 · Results & Impact

设计结果与数据验证

量化成果为产品上线初期数据;定性成果来自监管审计结果与设计框架复用情况。

数据敏感 · 以下指标已脱敏处理,仅供展示参考
超额达成
12 月 MAU
月活跃余额用户数
大幅超出业务目标
快速增长
VN non-COD TTPay 占比
在越南非 COD 支付方式中的份额
上线仅 1 个月达成
显著提升
SEA 非原路退款渗透率
退款到 TikTok Pay 的比例
从项目启动前个位数增长
超额达成
PIPO Payin TPV 占比
在 TTS 支付中的 TPV 份额
超出挑战目标
稳步爬坡
展业国家 TTS TPV 占比
覆盖全部展业市场
稳步爬坡,持续增长
定性成果
✓ VN/MY 通过 SBV/BNM 监管审计,按时展业
✓ 设计框架复用至东南亚及全球市场
✓ 验证了退款场景作为核心激活路径的有效性
09 · Reflection

反思与成长

01
合规约束是设计机会,不是障碍
强制 KYC 是最初看起来最难绕过的限制,但当我们把它理解为"用户升级的仪式感"而非"注册障碍"时,设计思路完全打开了。每一个合规步骤背后都有用户可以感知的价值——它保护了他们的资金安全,解锁了更高余额限额,让他们有资格使用更多金融服务。
02
最好的说服是"时效差异",不是视觉强调
在退款选项设计中,我们试过很多方式让用户选择"退到 TikTok Pay",包括颜色高亮、推荐标签等。最终数据显示,最有效的说服点是朴素的时效对比:"即时到账" vs "7-14 个工作日"。好的体验设计有时候就是把真实的差异说清楚,不需要设计师的"魔法"。
03
跨市场设计需要"不变的骨架 + 可变的血肉"
设计框架的价值不在于它有多漂亮,而在于它有多容易被另一个市场复用。每一个设计决策都需要问:这是"这个市场特有的",还是"所有市场通用的"?前者做成可配置,后者做成规范。这是我在这个项目中最大的系统性收获。
04
高情绪化场景的设计密度要降,不是升
在退款时触发账户升级引导(MY),在账户被冻结时引导 Kill Switch 操作——这些都是用户情绪最紧张的时刻。我的早期版本在这些页面塞了太多引导信息。实际上,情绪紧张时用户的信息处理能力大幅下降,设计密度要降低,只留最核心的一个行动。
Next Project

Creator Card

A Visa debit-card experience connecting creator earnings with everyday spending.连接创作者收益与日常消费的 Visa 借记卡体验。

View next project查看下一个项目