← 返回产品设计与实现

03 / PRODUCT / vibe coding小程序

TimeCup|用饮品看见时间从产品想法到可用小程序的 Codex 实践

个人项目 · 产品策划、交互设计与 Codex 协作开发

离线 MVP · 核心流程自动化验证2026
阅读完整作品

MY ROLE

我做了什么

我使用 Codex 推进产品定位、需求拆解、交互设计与功能迭代,将“用一杯饮品看见时间”的想法做成微信小程序。在个人探索中,我掌握了小程序开发、备案与上线的完整流程,能够将产品构想、技术实现与发布准备衔接起来;同时持续细化信息层级、操作反馈和异常场景,通过自动化测试检查核心体验。

OVERVIEW

作品概括

TimeCup 是一款以饮品余量呈现时间的微信小程序:奶茶用于主动记录,柠檬水、绿茶、红茶与咖啡分别呈现日、周、月、年的自然进度。围绕“时间去了哪里”的日常困惑,项目将分类计时、日周回顾与历史修正串成完整流程,让抽象的时间变化更容易感知,也让记录成为可以回看的行动线索。

CAPABILITY IN PRACTICE

产品定义与取舍

区分主动记录与自然时间进度,以五种饮品建立统一的时间表达;围绕开始记录、获得反馈和日周回顾组织首版体验。

AI 协作与交互迭代

使用 Codex 将需求拆解为页面、交互和功能任务,持续优化信息层级、分类操作、动效反馈与小屏适配,让想法逐步成为可体验的产品。

开发、备案与上线

在个人探索中掌握小程序开发、备案与上线流程,将功能实现、质量验证与发布准备贯通;项目现有 340 项自动化测试通过,支持核心流程的持续检查。

FROM IDEA TO PRACTICE

产品思路与实现路径

  1. 01

    让时间更容易被感知

    从“时间过去了,却不知道花在哪里”的日常感受出发,以杯中饮品变化呈现进度,用熟悉的生活意象降低理解门槛。

  2. 02

    连接记录与回顾

    用开始、分类、暂停与结束承接当下行为,再用日周统计和可修正的历史记录支持复盘,让单次计时积累为可回看的时间线索。

  3. 03

    把需求变成可验证的功能

    通过 Codex 将需求逐步落实到界面和功能,优先保证计时准确、数据保存与状态恢复,再细化视觉、动效和感官反馈。

THE COMPLETE COLLECTION

全部界面4 件素材

4 张界面截图,保留全部画面;点击图片可放大查看。

← 返回作品目录了解我的经历 ↗