INITIALIZING000/ 100
案例 P.10 / 项目详情

客户Aftershock
行业定制电脑与消费电子电商
合作时间2025-11-20
交付内容基于 Hydrogen 和 Remix、React 的 Shopify 商城
背景 / BACKGROUND

AFTERSHOCK PC 面向澳洲市场销售定制电脑、即装即发整机及笔记本电脑。随着产品数量、硬件配置规则和营销活动持续增加,原有商城逐渐出现页面结构复杂、数据来源分散、移动端选购流程较长,以及内容更新依赖开发人员等问题。

本项目需要在保留 Shopify 商品、库存、订单和结算能力的基础上,重新梳理商城前端架构与核心购买流程,让产品展示、配置选择、活动上线和日常内容维护更加统一、高效并具备持续扩展能力。

做了什么 / WHAT WE DID

首先梳理 Shopify 商品、Collection、Metaobject、产品标签及 Prismic 内容之间的数据关系,重新规划整机分类、产品系列和 PC 配置器的页面结构。

前端基于 Shopify Hydrogen、Remix 与 React 进行开发,打通 Shopify Storefront API 与 Prismic 内容系统,重构桌面整机列表、产品系列页、PC Model 配置页及购物车等核心购买路径。

项目同时完成了产品筛选、配置选项、促销模块、移动端交互、响应式布局及基础 SEO 的优化,并建立可复用的页面组件和数据处理逻辑,方便后续快速上线新品、专题活动和新功能。

项目通过 Shopify Oxygen 部署,并按约定交付相关源码、技术说明及部署维护文档。

上线之后 / RESULT

商城已部署至 Shopify Oxygen 并稳定运行。产品、系列和营销内容逐步采用统一的数据结构管理,业务团队更新商品与活动页面的效率得到提升。

移动端的浏览、筛选和配置流程更加清晰,用户可以更快速地完成产品比较与配置选择。前端组件和数据边界也得到重新梳理,为后续新品上线、营销活动、页面实验及功能迭代降低了开发与维护成本。

涉及销售额、转化率及客户经营数据的具体指标不对外公开。

项目画面 / PROJECT SCREENS
4 IMAGES
AFTERSHOCK PC Hydrogen 电商平台 截图 1
AFTERSHOCK PC Hydrogen 电商平台 截图 2
AFTERSHOCK PC Hydrogen 电商平台 截图 3
AFTERSHOCK PC Hydrogen 电商平台 截图 4
聊聊项目 / CONTACT

你也在做定制电脑与消费电子电商?
这个项目可以作为参考。

MAIL — 729475707@QQ.COM
电话 — 13519654454
一般当天回复

约个时间聊聊