Zeabur 官网 — Xin An

Zeabur（发音 /ˈziːˌbər/）是一个帮助开发者一键部署前后端与数据库的 PaaS 平台。作为这支小型初创团队内唯一的设计师，我负责控制台与官网的界面、设计系统和品牌视觉，并直接编写前端代码交付组件与页面。

官网承载产品介绍、定价方案与模板市场等核心内容。我负责了定价页与落地页的改版，以及独立邀请页的从零构建；在职期间向官网仓库提交了 189 次代码（不含合并提交），独立完成了落地页与邀请页的前端开发。

定价页

Zeabur 的开发者方案每月收取 5 美元订阅费，内含 5 美元的用量额度，超出部分再按量计费。旧版定价页仅以一段文字和「Free amount」区块解释这一规则，导致不少用户误以为订阅费之外仍需全额支付用量费用，客服每天都会收到相关的账单咨询。

纯文字难以直观传达阶梯抵扣的计费逻辑。我将定价页核心区域重构为一份可切换方案的模拟账单：以阶梯折线表示递增的用量，移动光标即可实时查看订阅费抵扣与超出部分的费用构成。改版上线后，关于计费规则的客服工单降为零。

随着产品受众从传统全栈开发者扩展至 AI 辅助编程用户，旧版落地页已无法承载新的产品定位；同时，自有服务器、托管 VPS 等新增的核心能力也缺乏展示空间。

新版落地页在首屏下方补充了 Cursor、GitHub Copilot 与大语言模型部署等场景入口，并支持直接拖入本地项目文件夹发起部署；从 git push、自动识别框架到服务上线等原有核心模块则保留信息结构，全面翻新了等轴视觉与状态过渡动效。

静态设计稿难以准确定义复杂动效与多断点下的响应式表现。此次改版我直接在代码中完成设计与实现，在浏览器内同步调校动效时序、文案折行与各屏幕尺寸下的布局。

此前，推荐链接直接指向官网首页，仅以角落的浮层提示邀请人信息，点击后即跳转至常规登录页，奖励规则在整个转化路径中缺失。

我设计并开发了独立的邀请落地页：首屏突出「首次升级双方各获 $5 额度」的核心激励与注册入口，下方复用产品特性的展示模块，使受邀用户无需离开当前页面即可完成从了解产品到注册转化的闭环。