a
命名与信息架构不清晰
"I don’t know what ‘Thrive’ means, is it skincare?"
"Is Out of Studio out of stock?"
Kayanee
沙特高端零售电商与数字体验设计
概述
Kayanee 是一个健康与生活方式品牌，背后由沙特公共投资基金（PIF）支持。 在该项目中，我担任 UX&UI 设计师，与体验设计团队、Web（电商）产品团队及 Shopify 技术团队紧密协作。我负责 Kayanee 双语、 电商平台的关键用户路径与BU页面模板的 UI 上线交付，涵盖核心体验与界面设计、设计系统迭代、响应式页面架构搭建，以及 Go- To-Market 测试支持与上线后的持续优化。过程中我通过设计评审、需求对齐与开发协作，推动方案从设计落地到稳定上线并持续迭代。
GTM 测试结果
100+ 在关键用户路径中记录并追踪了 100+ 个问题；上线前修复了 35 个高严重性阻塞问题导航成功率
~84% 用户点击Mega Menu后 60 秒内到达目标商品集的会话占比约 84% 背景 
把愿景落到体验：PIF 面向沙特女性的健康生活方式平台
Kayanee 是沙特首个面向女性的健康与生活方式生态系统 — 将内容、运动、学习和奢华电商融为一体。 项目由沙特公共投资基金（PIF）支持，并与“2030 愿景”方向一致，覆盖电商、iOS/Android 应用以及线下门店触点等多端体验。
第一版于 2024 年初与利雅得旗舰店同步发布。
挑战与目标 
电商上线前的体验验证与打磨
我加入项目时处于上线前阶段：品牌识别已确定，核心支柱也已定义。 到 2023 年 10 月，电商网站成为最关键的消费者触点，原生 App 紧随其后。 当时我们的目标是在正式上线前对两端体验进行验证与加固： 端到端跑通关键用户路径、消除主要摩擦点，并在移动端与桌面端稳定关键功能。
验证与综合分析
上市前（Go-to-market）测试
在上线前，团队开展了 Friends & Family 上市前测试计划， 结合远程与线下面对面引导式测试，对 Kayanee 电商 MVP 进行压力验证与可用性检验。
目标
验证平台性能
平台在电商、运营与履约层面是否按预期运行？
识别并排序问题优先级
哪些问题必须在上线前修复，哪些可以在上线后解决？
评估真实用户行为
首次使用的用户是否能在第一屏理解价值主张？
用户能否轻松完成浏览、加购、结账与订单追踪？
方法
90 分钟现场引导式测试
工具：Kayanee 网站（桌面与移动设备展示）; Dovetail
90 分钟线上引导式测试
工具：Maze、Zoom 通话；Dovetail
参与者：
48 名参与者来自广泛的目标客户群体，形成具有代表性的样本参与 Friends & Family 测试。
用户任务
A. 网站探索 （10 分钟） - 首因印象
B. 端到端购买流程 （60 分钟） - 导航/搜索、分类页、BU 页面、结账、配送、支付、退货
C. 反馈 （10 分钟）
问题归纳
基于线上与线下测试结果，我们分析了 100+ 个问题，并归纳为四个与目标一致的关键主题
功能性
Bug、系统错误或流程中断
40 个问题体验
针对整体用户旅程的更广泛反馈
46 个问题履约与服务
履约与服务相关问题
8 个问题展示
品牌感知与 UI 内容缺失
5 个问题 UX & UI 改进 
主菜单（Mega Menu）关键痛点
上线前GTM测试显示：菜单导航是用户困惑的主要来源。 用户在进入商品页之前，就已经在“发现内容”和“建立信心”这一步被打断，直接影响后续浏览与购买。
主要发现
- 37.5% 的参与者反馈导航困扰
- 4 位用户完全跳过导航，直接搜索
- 5 位用户因为菜单中的“当前状态/所在位置”不清晰而迷失路径（不知道自己在网站的哪个层级）
用户引言
b
购买路径和权益不清晰
"I have to click around to understand the business."
"I’m not sure which items are products and which are services"
c
搜索体验差
"I searched for 'activewear' and only one result came up, even though there are more in the store."
GTM 测试中标注问题标记 (A–C) 的超级菜单。
探索
我探索了不同的 mega menu（大菜单）结构，以提升可扫读性、降低“商品 vs 服务”的理解歧义，同时保持品牌的高端陈列感。
Version A
以商品陈列为主导的布局：
顶部一级结构中将 “Shop” 作为独立入口突出显示，并与 Move / Learn / Our World 等体验与内容入口做明确区分
双列布局 + 重点图（featured images），横向子类目标签
优势
- 标签更清晰
- 视觉陈列更强
- 商品与内容分区更明确
- 提供“查看全部（View All）”的兜底路径
不足
- 可扩展性有限
- 响应式适配问题
Version B
以结构为先的布局：左侧导航栏与一致的多栏分类体系。
左侧纵向分栏导航（Left-rail）
多列文本层级（Multi-column text hierarchy）
优势
- 更符合"F型"浏览模式
- 列结构更清晰
- 分类体系更一致
不足
- 促销/陈列的视觉冲击力会下降
迭代
项目相关方要求
利益相关者要求在顶层导航中展示全部五个业务单元（BU），这增加了信息密度并导致分组冲突。
要求：在顶层导航中展示全部五个业务单元。
- 顶层导航栏过于拥挤
- 购物路径被拆散，整体体验更碎片化
利益相关者要求在顶层导航中展示全部五个业务单元后的迭代。
解决方案
以业务线为核心的双层菜单结构（BU-Driven Split Navigation）
我将顶部主菜单拆分为两层：第一层是工具层；第二层聚焦业务线/内容支柱， 用于探索，并将“Shop（购物）”与“Discover（发现）”等行动入口独立出来，以降低顶栏拥挤度，并与业务优先级对齐。
- 与业务优先级对齐
- 双层结构提升信息清晰度
- 第一层 = 顶部功能栏 （搜索/收藏/购物车/账号/语言）
- 第二层 = 主要业务线+行动入口（Shop、Discover 等）
- 搜索入口被强化：激活后增加清晰的输入底纹与焦点状态，并在输入后以内嵌的”搜索建议”展示匹配商品
更清晰的导航指引
我强化了选中状态，简化了内页菜单样式，让用户能即时理解所在位置和可操作选项——无需依赖重度模糊遮罩。
- 加强各支柱和子分类的选中状态，让用户始终清楚所在位置。
- 在非首页页面，超级菜单在干净的白色背景上展开（减少模糊），提升可扫描性、无障碍性和性能
响应式与本地化的 Mega Menu
我还为移动端与桌面端设计了 Mega Menu，并同时适配浅色/深色两种模式，覆盖英文/阿拉伯语（EN/AR）双语场景。
上线后验证 (GA4)
我们如何衡量
上线后两周内，我们重点追踪了两类 GA4 信号：
(a) 顶层导航点击率（CTR），用于验证意图分层是否有效（Shop vs 体验支柱）；
(b) 与数据/工程协作在 mega menu 的点击链路埋点，并在 GA4 里用漏斗衡量导航成功率：
点击后 60 秒内到达 collection 页面并且浏览物品 90秒，按 EN/AR 与设备分段对比。
结果
"Shop" 是最强的意图信号：其点击率（CTR）显著高于体验支柱入口； 同时，菜单使用成功率达到约 84%（即：用户点击顶部菜单后 60 秒内到达某个 collection 页面的会话占比约为 84%）。
构建与本地化 
交付响应式双语设计系统及全生命周期CRM邮件模板
我主导 Kayanee 各业务线（BU）页面的核心版式与视觉设计，打造了英语和阿拉伯语（RTL）双语的响应式、可交付模板，并扩展设计系统能力，以支持更高效、可规模化的页面搭建。
同时，我负责 Kayanee 英文/阿拉伯语的 CRM 邮件模板体系，覆盖完整客户生命周期；交付包含交付规范、QA检查表、预发布验证和正式发送支持，帮助团队在多渠道中更快上线，并保持一致的界面体验。
成果 
上线亮点与影响
2024年1月电商上线
上线后，Kayanee 以“贴近本土文化、包容多元”的女性健康内容与体验获得积极反馈。 PIF 官方披露其目标触达 100 万+ 消费者，显示出强劲的品牌扩张与影响力预期。
影响
降低上线风险：推动并支持上线前测试，暴露并汇总 100+ 个可用性问题，并在上线前补齐顶部主菜单与业务线页面的关键体验缺口。
Mega Menu 优化：提升路径指引与商品发现效率，帮助高意图用户更快到达商品集合页，并降低购买路径中的摩擦与跳失。
关键收获
- 快速交付 + 小闭环协作：从概念到上线快速推进，控制范围（scope）清晰，并与产品、开发、设计保持高频闭环。
- 面向不同干系人的清晰叙事：用“问题—证据—方案选项—影响”来组织表达，并根据听众调整细节深度。
- 跨语言与文化语境的严谨处理：英文与阿拉伯语（RTL）并行设计；默认以母语用户的视角评估；RTL 从一开始就作为默认设计前提；文案与图像尽量选择“文化语境成立”的表达，而不是堆术语。
- 与工程团队讨论“选项”而非“偏好”：同时提出多条可行方案，明确取舍（trade-offs）与实现成本，选择更可扩展、可长期维护的路径。
- 以电商指标驱动设计：上线后持续关注关键入口的点击与到达表现，并结合语言与设备等维度分段分析，反推信息架构与菜单结构的优化方向。
张嘉靖作品集 2023 - 2026 
期待新机会
期待新机会 有好项目？
你好，我叫 ，你可以通过邮箱联系我 ，我需要 方面的帮助。
请使用另一台设备扫码
