2026 · AI产品经理 · UI Designer

用产品思维 驱动每一个像素

每个设计决策都有商业逻辑支撑——从用户心理学到转化漏斗,从信息架构到微交互。香港理工大学语言学硕士,求职方向AI产品经理实习生。

11
UI作品
8
AI产品Demo
20+
用户深访
5万
字PRD
Selected Work

精选作品

每个作品不仅展示界面,更说清「为什么这样设计」。

DATA DASHBOARD

MoneyFlow
个人财务仪表盘

面向都市白领的记账APP,用Z型阅读流和Progressive Disclosure策略,让用户3秒内获得财务全貌。

环形图趋势折线FAB记账6色分类
3s
核心信息获取
40%
滚动减少
7±2
Miller's Law
查看完整作品
MOBILE APP

HabitFlow
每日健康打卡

用BJ Fogg行为模型和损失厌恶心理学,解决打卡APP 7日留存低于20%的问题。

进度环打卡动画热力图Tab导航
300ms
动画甜点
2x
损失厌恶系数
44px
最小触控
查看完整作品
B2B PRICING

CloudSync
SaaS 定价页

用锚定效应和Von Restorff效应优化三栏定价,年付默认选中+功能对比表+社会证明全链路转化。

锚定效应年付切换对比表FAQ
+27%
3选项转化提升
+35%
年付率提升
14天
免费试用
查看完整作品
核心案例 · MOBILE APP

宠伴·健康台账
从0到1核心产品

多宠家庭疫苗、驱虫、体检提醒分散在相册与群聊,易遗漏。通过20位宠物主深度访谈,70%每月遗忘疫苗,83%隐私顾虑优先。本地OCR+PWA零服务器成本,隐私优先架构。

隐私优先本地OCRPWA离线按宠隔离
+38
NPS净推荐值
44%
7日留存
42%
转化率
查看完整作品
E-COMMERCE

GlobalFUN
跨境电商AI拼团

MCP服务总线+6-Agent协作架构,覆盖需求→调研→选品→文案→合规→运营全链路闭环。验证多Agent并行协作与流水线编排的交互可行性。

MCP协议6-Agent协作结构化推送多语言
6个
Agent协同
98.2%
意图识别率
180ms
MCP延迟
AI创作 · PRODUCTIVITY

星途·创作舱
AI创作工作台

项目视角管理多部作品,4套主题(浅灰/深色/薄荷/墨水屏),角色数据库+大纲折叠+灵感收集器。健康分+进度环激励机制,对抗"开始成本"。

项目视角AI灵感辅助健康分4套主题
AI
灵感辅助
健康分
进度激励
项目
视角管理
查看完整作品
PM工具 · DEVELOPER TOOL

Prompt Library
AIGC提示词库

按PM工作流而非AI能力分类:需求分析→竞品分析→PRD撰写→评审沟通→数据分析→复盘输出。19项PRD质量检查清单,已GitHub开源。

PM工作流6步12个PRD质检GitHub开源
6步
工作流覆盖
19项
PRD质检清单
开源
GitHub
查看完整作品
🎵 Glassmorphism
GLASSMORPHISM

Lofi
玻璃态音乐播放器

Z世代氛围感音乐APP,用backdrop-filter毛玻璃效果营造沉浸体验。韵律波动画+深紫渐变背景+最小控件原则。

毛玻璃韵律波沉浸深色极简控件
24px
模糊半径
8条
频谱条
3
操作按钮
查看完整作品
// NEON
CYBERPUNK

NEON
赛博朋克数据看板

霓虹美学的数据监控面板。深空底色+网格线+荧光色,适合游戏/科技公司数据产品。

霓虹美学网格背景数字跳动系统负载
3色
霓虹色板
24h
实时流量
4项
系统监控
查看完整作品
JAPANESE MINIMAL

粋·SUI
日式极简任务管理

受侘寂美学启发的任务管理。米白画布+衬线字体+朱红强调色,少即是多的设计哲学。

侘寂美学大量留白衬线字体单色强调
3色
完整色板
8px
网格单元
0
装饰元素
查看完整作品
BRUTAL
BRUTALISM

BRUTAL STUDIO
粗野主义品牌展示

反精致设计宣言。纯黑白+红色、零圆角、超大字重——不追求漂亮,追求被记住。

零圆角超大字重三色板粗边框
3色
极致限制
4px
粗边框
6vw
最大字号
查看完整作品
🏮雾灯残页Mistlamp Fragments
GAME · AIGC

雾灯残页
AI辅助文字冒险游戏

哥特文字冒险游戏UI设计。暗色主题+金色强调,信息架构:28条分支路径×6结局×5属性暗骰机制。验证AI辅助内容生产的PM工作流。

哥特暗色信息架构分支叙事响应式
28条
分支路径
6结局
多结局
15款
竞品分析
🎮 试玩游戏
Design Philosophy

设计理念

贯穿所有作品的四个核心原则。

🎯

用户优先

每个设计决策都从「用户需要什么」出发,而非「技术能做什么」。

📊

数据驱动

用A/B测试和行为数据验证设计假设,不依赖主观审美判断。

🧠

心理学应用

锚定效应、损失厌恶、Fitts's Law——每个交互都有理论支撑。

效率优先

减少认知负荷和操作步骤,让用户用最少的思考完成任务。

Design System

UI Kit · 设计系统

Token层→组件层→模式层,用系统化思维提升设计效率。Cursor+Claude+FigmaMCP,产品经理直接出高保真Demo。

🎨

Token层

CSS变量系统:色彩(--bg, --accent, --text)、字体(clamp响应式)、间距(8px基准)、圆角、阴影。一处修改,全局生效。

🧩

组件层

可复用UI组件:按钮(6种状态)、卡片(3种布局)、表单(输入/选择/开关)、导航(顶栏/侧边/底部)、弹窗、Toast。

📐

模式层

页面模式库:列表页、详情页、表单页、仪表盘、设置页。标准化布局+组件组合,快速搭建新页面。

🤖

AI工作流

Cursor+Claude+FigmaMCP:写PRD→AI生成初版→人工验收→迭代。产品经理直接出高保真Demo,不依赖设计师。

My Process

设计流程

从问题发现到产品上线的完整方法论。

01
发现
用户访谈
数据分析
竞品研究
02
定义
用户画像
需求优先级
成功指标
03
设计
信息架构
交互原型
视觉系统
04
验证
可用性测试
A/B实验
数据迭代
Design Inspiration

灵感来源

好的设计不是凭空想象出来的。以下是我日常汲取灵感的优质平台,分类整理供你参考。

💡 收藏你喜欢的网站,建立自己的设计灵感库。
好的设计不是模仿,是在大量输入后形成自己的判断力
每个像素都有它的道理 —— 但在那之前,先看够一百万个像素。