Kylie Cosmetics
Kylie Cosmetics 在同一个 Shopify 店铺中承载 Cosmetics、Fragrance 和 Skin 三条产品线，并要应对 Festival Essentials、King Kylie Collection 等季节性活动。我们设计了一套模块化系统，让三条业务线可以一起扩展，同时不打散品牌一致性。
年份
2022 至今
项目
全球美妆电商改版
范围
完整重新设计、数字品牌、活动设计与持续优化
行业
美妆、彩妆、香氛、护肤
技术
Figma
Shopify
Klaviyo
Recharge
Yotpo
Bazaarvoice亮点
- 一套覆盖 Cosmetics、Fragrance 和 Skin 的设计系统
- 移动优先 PDP，支持色号阶梯、套装和礼盒变体
- PLP 上的 Quick Shop 色号选择器，减少加入购物车步骤
- 可承载 upsell、cross-sell 和套装构建的 mini cart
- 适合 King Kylie、Festival Essentials 等活动的落地页模板
- 支持评价、留存和订阅的内容模块
- 覆盖 50+ 页面模板的无障碍友好组件模式
影响 / 改变
活动上线
Before：季节性 drop 需要更多一次性设计支持。After：活动页可以从可复用、符合品牌规则的模板中快速上线。
多产品线扩展
Before：Cosmetics、Fragrance 和 Skin 容易拆成割裂体验。After：一套店铺系统能灵活承载三个产品世界。
购物路径
Before：多色号系列会迫使用户多走 PDP 步骤。After：Quick Shop 和 mini cart 让选色号、加购和套装构建更快。
需求与挑战
客户需求
“我们需要一个能承载 Cosmetics、Fragrance 和 Skin 三个不同产品世界的店铺，但不能像三个不同的网站。导航要让跨品牌发现更明显，购物车要能承担 upsell，整套系统还要能快速上线新活动，同时不破坏品牌。”
挑战
- 在一个导航中统一 Cosmetics、Fragrance 和 Skin，同时保留各自语气
- 设计能处理单品、套装和礼盒的 PDP 系统
- 让购物车支持 upsell 和套装逻辑，同时不显拥挤
- 让活动落地页既符合品牌，又能模板化快速上线
- 在 Shopify CMS 限制内保持内容更新便利
我们的做法
三个品牌世界，一套系统
我们设计了一套能在 Cosmetics、Fragrance 和 Skin 之间灵活变化的组件库，共享字体和间距，同时通过类别级色彩和图片规则保留各自身份。
移动优先的零售 UX
色号选择、套装选择和 quick shop 模块都从移动端开始设计，交互按拇指触达和真实购物场景优化。
默认支持活动上线
落地页、上新和联名活动复用同一套 section kit，让团队无需定制开发也能上线完整品牌化活动页。
成果
“能有一个真正理解技术限制的设计团队太好了。他们创造了非常动态的东西，我们未来很多年都可以继续使用。”
COTY Inc. 对 Kylie Cosmetics 的反馈
项目亮点
Quick Shop
购物者可以直接在 PLP 选择任意色号并加入购物车，减少进入完整 PDP 的步骤，尤其适合 16+ 色号的系列。
Mini Cart
购物车抽屉用清晰层级和轻分隔承载套装逻辑、交叉销售和赠品，而不是用厚重界面压住内容。
模块化 PDP
一套 PDP 模板可适配普通 SKU、套装和单品发布，并根据产品类型调整媒体密度、规格模块和故事内容。
持续设计支持
我们持续支持 Kylie Cosmetics 团队的新产品发布、活动页面和 UX 迭代，包括 Fragrance 产品线和 King Kylie 回归活动。
“大家都非常喜欢这个网站体验，真的很精彩，也是你们最受称赞的设计之一。谢谢你们的一切，尤其是 UAT 支持。”
COTY Inc. 对 King Kylie Campaign 的反馈
