35 lines
1.7 KiB
Markdown
35 lines
1.7 KiB
Markdown
---
|
||
title: "File-System-First UI"
|
||
type: concept
|
||
tags: ["design-pattern", "agentic", "ux", "openclaw"]
|
||
last_updated: 2026-04-22
|
||
---
|
||
|
||
## Overview
|
||
一种 Agent 原生 UI 设计范式——将所有 UI 配置、设置、过滤器、视图存储为文件系统中的文件（YAML/Markdown），使 AI Agent 可以像编辑代码一样自然地修改界面。
|
||
|
||
## Definition
|
||
传统 UI 依赖 API 或内部状态存储配置，Agent 需要通过 API 抽象层修改；而 File-System-First UI 直接让 Agent 读写配置文件，Agent 可以用相同的工具链（文件编辑、版本控制）操作 UI。
|
||
|
||
## Key Insight
|
||
> "Because every setting, filter, and view is stored as a YAML/markdown file, OpenClaw can modify the UI as naturally as it edits code. No API wrappers needed."
|
||
> — [[DenchClaw]] 核心设计哲学
|
||
|
||
## How It Works
|
||
1. **配置文件即 UI**: 所有视图定义、过滤器设置、列配置存储为 `.yaml` / `.md` 文件
|
||
2. **Agent 直接编辑**: Agent 使用标准文件编辑工具修改配置
|
||
3. **UI 自动响应**: 前端监听文件系统变化，实时更新界面
|
||
4. **版本控制**: 所有变更通过 Git 追踪，支持回滚和协作
|
||
|
||
## Benefits
|
||
- **No API abstraction**: Agent 不需要理解 API，直接操作原始数据
|
||
- **Standard tools**: Agent 用同一套文件编辑技能操作 UI 和代码
|
||
- **Version control**: UI 配置变更天然被 Git 追踪
|
||
- **Reproducibility**: 配置即代码，环境可复现
|
||
- **Transparency**: 所有变更可审计、可回滚
|
||
|
||
## Related
|
||
- [[DenchClaw]]: File-System-First UI 的典型实现
|
||
- [[Chrome Profile Cloning]]: 配合实现无缝浏览器自动化
|
||
- [[One-Command-Setup]]: 配套的安装哲学
|