QiuVision

从一行代码，到更多可能。

记录前端、AI 与交互的探索。把灵感写进界面，把细节留给体验。

精选内容

前端实践、AI Coding、Agent、Skills 与交互体验的交汇处

AI 工具2026.11.0820 分钟

Agent 的记忆由什么组成：读 Anthropic《The components of agent memory》

Anthropic 在 2026 年 11 月发布了一篇关于 Agent 记忆的长文：记忆被拆成会话日志、记忆笔记、记忆表征和注入上下文四层，再用一种叫 dreaming 的离线过程在层与层之间整理、纠错、搬运。本文梳理文中的分层模型和几组实验——CL-Bench 上的学习闭环、宝可梦里的「该记什么」、一条错误笔记如何把 Claude 困在月见山、wiki 何时有用何时只是更大的地图——最后聊聊它对日常使用 Claude Code、自己搭 Agent 的启发。

前端动效2026.10.1218 分钟

用 Claude Code + Remotion 做有高级感的动效视频：让每一帧都可审查

让 Claude Code 搭配 Remotion 用 React 写视频，几分钟就能出片；拉开差距的是节奏、缓动、留白与审查。从「视频是帧的函数」讲起，整理动效 tokens、场景结构、四个可复用配方、分镜先行的协作流程与常见坑。

Canvas 视觉2026.07.2716 分钟

MatrixEffect：把图像变成可编程的视觉矩阵

从圆点矩阵与 ASCII 艺术出发，拆解一套通用 Canvas 采样场管线：如何统一图片、外部 Canvas 与程序化动态源，让亮度、颜色和变换结果驱动不同 Renderer，同时守住响应式、性能与可访问性边界。

AI 工具2026.03.1118 分钟

Agent Skills 资产化：个人与团队的技能积累、管理与分发

当 AI Coding Agent 成为日常工具，如何把散落在项目各处的工程经验、领域知识和最佳实践，系统地沉淀为可复用的 Agent Skills？本文从一个人的技能仓库出发，聊聊 Skills 的设计理念、目录治理、写作方法论和团队级分发实践——以及为什么「资产化」比「写文档」更接近问题的本质。

前端动效2026.09.2313 分钟

Motion 连续布局过渡：让内容与周围元素一起移动

折叠面板淡入了，弹窗外框也变高了，为什么下面的按钮还是瞬移？从一次真实的界面修正出发，拆解内容显隐、真实占位、退出生命周期与嵌套测量的协作，并给 AI 一份可以直接复用的动效约定。

前端动效2026.08.3134 分钟

从按钮到面板，从卡片到浮层，从图标到应用：Motion 容器变形过渡的三种实现策略

点击一个小元素，它平滑地长成一个更大的面板、浮层或整个应用——这类效果的名字叫容器变形过渡（Container Transform）。本文从三个真实实现出发（筛选按钮原地展开成面板、景点卡片飞向视口中央变成详情浮层、Apple Watch 风格的图标长成应用），梳理这类过渡的心智模型、三种实现拓扑与完整的工程细节：测量、相位状态机与单一进度值、共享元素优先的内容编排、遮罩阴影、可访问性与逐帧验证。

探索更多内容

精选作品

独立构建、持续打磨的组件与桌面应用

查看全部作品

技术栈一览

前沿技术驱动

基于现代 Web 技术栈，追求极致的开发体验与用户体验

React

Next.js

TypeScript

Tailwind CSS

Node.js

shadcn/ui

WebGL

Three.js

Framer Motion

极致体验

优雅设计

流畅动效

前沿技术

最佳实践

全球化

响应式布局

性能优化

创意交互

视觉美学

文章时间线

以时间为轴，回溯创作轨迹

最近更新近 8 篇

从一行代码，到更多可能。

精选内容

Agent 的记忆由什么组成：读 Anthropic《The components of agent memory》

用 Claude Code + Remotion 做有高级感的动效视频：让每一帧都可审查

MatrixEffect：把图像变成可编程的视觉矩阵

Agent Skills 资产化：个人与团队的技能积累、管理与分发

Motion 连续布局过渡：让内容与周围元素一起移动

从按钮到面板，从卡片到浮层，从图标到应用：Motion 容器变形过渡的三种实现策略

精选作品

前沿技术驱动

文章时间线

2026年

Agent 的记忆由什么组成：读 Anthropic《The components of agent memory》

FusionKit 的 Windows 应用内更新：检查、下载与一键重启安装

养一条蓝色大肥鱼：DeepSeek Harness 社区玩法全景与 QQ 接入实战

复刻 Apple Watch 蜂窝主屏：一个会「弯」的图标列表

淡出穿过与共享轴：用 Motion 实现 Material 的两种内容切换

用 Claude Code + Remotion 做有高级感的动效视频：让每一帧都可审查

Motion 连续布局过渡：让内容与周围元素一起移动

Spec 驱动 AI 开发 v2.1：设计先行、受控实现与真实验证