01Case study
Evidence pending16:10 / 9:16
真实录屏与脱敏界面将在发布前替换此舞台
2025.05 - 2025.11Web UI 设计 / Shopify 前端
Kraftsman
面向欧美市场的 $400+ 高端厨电项目。我负责工业极简视觉、响应式页面与 Shopify / GSAP 前端落地。
- D2C 商品叙事
- Web UI
- GSAP
- Shopify 开发
魏广昊
CadenWei
UI 设计师｜出海电商体验｜Vibe Designer
7 年 UI 设计经验，长期参与出海电商与 D2C 品牌项目。工作覆盖品牌视觉、响应式体验、设计系统、Shopify 页面与 GSAP 交互落地，并通过数据方法和 AI Agent 持续校准设计与实现。
山东大学 · 数字媒体技术7 年 UI 设计经验
01 / Selected case studies
三个案例，分别回答品牌表达、系统化交付与产品理解。
首页保留快速判断所需的信息；进入案例页后，再阅读角色、约束、设计决策与证据。
02Case study
2020.12 - 2021.04电商 UI / 设计系统
Waterdrop
在保留商城架构的基础上更新视觉与响应式体验，并建立组件规范和以数据反馈为基础的迭代方法。
- 设计系统
- 响应式体系
- GA / 热力图
- A/B 测试方法
03Case study
Evidence pending02 clips
真实录屏与脱敏界面将在发布前替换此舞台
2021.12 - 2023.03电商 UI / 产品交互
PAWAii
覆盖商城、组件和素材规范，并为智能饮水机、喂食器等产品设计滚动与 3D 动态页面。
- 产品交互
- 组件状态
- 响应式电商
- GSAP / 3D
02 / Practice
设计、增长与实现放在同一条工作流中判断。
三部分不是并列的技能标签，而是同一个电商项目中连续发生的工作。
- 01
UI 系统
Interface systems
从品牌视觉、信息层级和交互状态出发，把页面整理成可复用、可响应、可持续运营的界面系统。
- Figma 组件与变量
- 响应式规则
- 交互原型
- 品牌视觉转译
Waterdrop 组件库与多端规范；PAWAii 商城、组件和素材规则。
- 02
电商增长
Commerce growth
设计不止处理视觉风格，也处理商品理解、着陆路径、移动端流量承接和持续迭代的反馈机制。
- Shopify / D2C
- GA 与热力图
- A/B 测试方法
- PDP 与着陆页
Kraftsman 高客单价商品叙事；Waterdrop 商城改版与增长方法。
- 03
Agent 工作流
Agent-assisted build
以 Agent 为核心的 Vibe Coding 先定义内容、视觉判断和验收标准，再参与研究、代码实现、调试与验证；模型输出必须回到真实浏览器中检查。
- 任务与上下文设计
- 视觉探索
- GSAP / 前端实现
- 测试与审查
本站与轻量工具项目；从规格、实现、截图审查到 Git 记录的完整链路。
03 / Experience
7 年工作经验，从界面设计延伸到可运行的电商体验。
山东大学 · 数字媒体技术
- 01
青岛蓝色之路数字技术有限公司
UI 设计与前端开发
出海 D2C 网站、品牌视觉、Shopify 与 GSAP 前端交付
- 02
自由职业
UI 设计师
为出海电商客户提供网站 UI、品牌视觉与营销页面支持
- 03
青岛伊可普电器有限公司
UI 设计师
Waterdrop、PAWAii 等品牌商城、设计系统与数据迭代方法
- 04
青岛六一网络科技有限公司
UI 设计师
移动应用、Web 产品与品牌视觉设计
04 / Selected work
其他电商与品牌项目
当前先保留项目范围。公开封面将在确认授权后补入，不用生成图片替代真实作品。
01舞台灯 / B2B 询盘网站
素材待公开确认
New Feeling
02户外家具 / 响应式电商
素材待公开确认
GBYARD
03服饰 / 品牌电商
素材待公开确认
Atlooks
04家具 / 品牌网站
素材待公开确认
ACUEL
05手工艺 / 生活方式电商
素材待公开确认
Woolsmiles
06滑板 / 产品电商
素材待公开确认
FABOARD
05 / Agent workflow
AI 参与执行，但不替代问题定义、视觉判断和最终审查。
本站把工作过程保留为可检查的文件、提交、测试和浏览器截图。模型是否先进，最终要由页面是否正确、清楚和可用来证明。
- 01描述
核对最新简历、三个案例事实、素材缺口与招聘阅读任务
Current loop - 02规划
用设计规格和工作流冻结页面顺序、视觉命题与验收条件
acca6e1 - 03执行
由 Agent 处理组件、样式、GSAP 与 Three.js 的可运行实现
b7e47ea - 04检查
运行多视口截图、控制台、键盘、reduced-motion 和构建检查
9a06e55 - 05修正
根据浏览器证据回到布局、动效和性能层继续迭代
Current loop
工作流文档
规格、实现、检查、修正06 / Contact
简历、Figma 与联系方式
7 年 UI 设计经验，长期参与出海电商与 D2C 品牌项目。工作覆盖品牌视觉、响应式体验、设计系统、Shopify 页面与 GSAP 交互落地，并通过数据方法和 AI Agent 持续校准设计与实现。
UI 设计师｜出海电商体验｜Vibe Designer
山东大学 · 数字媒体技术