Playground

全部项目与实验

  • ◇ EXPERIMENT

    AI AGENT · COST & EVALUATION

    RepoCoach

    纸面推断错了两次,实测才对。一个源码学习 agent 的垂直切片——真正的产出是把 agent 工程里几个反直觉的问题跑到了有数据:成本随调用次数超线性增长、工具调用降 28% 而 token 反升 17%、缓存命中 65.6% 让预算指标高估约 3 倍。同时验证了安全闸如何双向覆盖、状态怎么跨进程活下来、以及为什么只写在 prompt 里的约束必须在出口再校验一遍。638 个测试、22 个合并 PR,Claude 定计划、DeepSeek 实现、GPT 复审。项目已主动收尾,把跑出数据的部分整理成可复用的经验。

  • ◇ EXPERIMENT

    AI COST · MEASUREMENT

    Agent Cost Lab

    Token 不是钱。几乎每个上下文压缩工具都宣传 token 降低多少,但缓存过的 input token 只要标价的约 10%,而压缩靠改写历史——这会打断缓存前缀,让后面全部重新计价。「省 40% token」和「账单更贵」完全兼容。这个仓库测的是账单:代理探针走真实调用路径,预测先锁进 git,导出闸写成测试而不是清单。装置已建成,结论待测。

  • ◇ EXPERIMENT

    AI AGENT · DESIGN TO CODE

    Image to Code

    不是「一张截图生成一个页面」。把 AI 生成的设计稿变成可复用、可验证的前端包——保留真实素材与设计语言,产出带 props、variants、tokens 和 manifest 的组件文件,而不是拍平成单个页面组件。中间产物可观察、契约确定、验证廉价,只在仍需视觉判断的地方保留人工评审。

  • ◇ EXPERIMENT

    AI DESIGN · RESEARCH

    Design Reasoning Lab

    不问「这个工具能生成什么」,问「它怎么思考」。用可复现的行为实验逆向 AI 原生设计工具的推理方式——它向人索取什么信息、把哪些决策留给人、不同输出模式之间如何关联。当前案例是 Claude Design,v0 作对照;结论按 Fact / Interpretation / Hypothesis / Conclusion 四级分层,事实与解释永远分开记录。

  • Brooch Shop

    ● LIVE

    AI AGENT · E-COMMERCE

    Brooch Shop

    筛选器解决不了的问题,Agent 从这里开始。用 Claude API + tool calling 构建的 AI 导购 agent,演示自然语言意图理解如何替代传统多级筛选。

  • Prompt Shop

    ● LIVE

    CHECKOUT · STRIPE

    Prompt Shop

    完整电商购物流程实验场,Stripe Checkout 集成,覆盖从商品列表到支付完成的全链路。

  • Human vs AI Judge

    ● LIVE

    AI · GAME · E-COMMERCE

    Human vs AI Judge

    当 AI 已经做出判断,谁来按那个确认键?与 AI 同场竞技,对真实电商售后工单做意图分类,实时对比人类、Claude、GPT 三方判断差异。

  • Readable & Shareable

    ● LIVE

    CLAUDE CODE · SKILL · VISUALIZATION

    Readable & Shareable

    你写了好文章,但大多数人不会点开链接。Claude Code `/viz` skill:自动识别文章结构,生成思维导图、交互 HTML、图片卡片等可分享产出,每种形式都链回原文,让不同受众找到自己的入口。

  • Particle Flow Generator

    ● LIVE

    CANVAS · SIMULATION

    Particle Flow Generator

    把时间垒进空间里。用粒子流模拟用户轨迹的空间残留——Canvas 2D 实时渲染,BFS 流场寻路,支持参数调节与 GIF 导出。

  • SSB Website

    ● LIVE

    DESIGN ENGINEERING · FRAMER MOTION

    SSB Website

    从零搭建的 B2B 营销站设计工程练习。四页完整实现,含自定义物理弹跳动效 hook(速度向量 + 边界反射)、响应式布局与 Framer Motion 动画。Lighthouse 性能 91 / 无障碍 96 / SEO 100。

  • Design Token Signals

    ◇ EXPERIMENT

    DESIGN SYSTEM · EXPERIMENT

    Design Token Signals

    设计令牌不只是存储数值,它们携带意义。一个用于分析 design token 组合所传达视觉信号的实验工具——映射颜色、圆角、字重的语义,在组件开发之前识别视觉冲突。

  • EaseBuy

    ◆ HACKATHON ★ TOP 10

    UX DESIGN · E-COMMERCE · MOBILE

    EaseBuy

    UXcel × UX Pilot 竞赛 Top 10 获奖作品。以「无感购物」为核心,11 个页面覆盖完整电商链路——极简留白、卡片式信息架构、透明结算流程。用 AI 辅助完成从线框到高保真的全流程。

  • Spec-Driven Scenario Updater

    ◆ HACKATHON

    AI AGENT · GITLAB HACKATHON

    Spec-Driven Scenario Updater

    GitLab AI Hackathon 参赛项目。以「规格鸿沟」为切入点——业务逻辑在产品、设计、开发之间反复翻译导致的失真。用单一 spec 数据源驱动 AI 自动生成代码、测试与文档。