用途：把产品设计描述转化为既可直接渲染、又可被机器读取和绘制的整页文本界面（TUI）。产出包括整页 TUI_RENDER、逐组件汇总表、合并的 PENCIL_SPEC，以及 PENCIL_BATCH_DESIGN 绘制计划（每次调用不超过 25 个操作）。该技能假定遵循 tui-front-ui 的共享约定与网格到像素的映射。
主要能力：解析输入模型 JSON（widthCols、grid、props、state、style、typography、layout、hotkeys）；按网格（cellWidthPx=8、cellHeightPx=16）将行列位置换算为像素坐标并计算布局；用制表符与框线字符生成不超过 widthCols 的等宽 ASCII 页面；输出含 bbox、样式、排版、状态与快捷键的 COMPONENT_SPEC；输出 Pencil MCP 用的画布与组件列表；并按批量上限生成 batch_design 调用。最后校验 COMPONENT_SPEC 的 bbox 与 TUI_RENDER 网格一致、批操作不超限。
使用方式：提供 page（name、widthCols、canvas、grid、paddingPx、gapPx、backgroundColor）与 components（id、type、preferredSizePx、zIndex）等输入。输出按 TUI_RENDER、PAGE_SUMMARY、PENCIL_SPEC、PENCIL_BATCH_DESIGN 的固定契约组织。布局默认以单一页面 frame 为根、按 padding 内垂直堆叠，leftPx=paddingPx，topPx=paddingPx+前序组件高度与间距之和，宽度默认 canvas.widthPx 减两侧 padding。绘制顺序为背景块在前、内容块居中、覆盖层（弹窗/提示）最后，zIndex 保留。快捷键合并去重，页面默认 <tab> next、<esc> back，禁用组件不显示快捷键。Pencil MCP 执行流程：get_editor_state(include_schema=false)、open_document("new") 或已有 .pen 路径、分批应用 PENCIL_BATCH_DESIGN、snapshot_layout(filePath, maxDepth=2, problemsOnly=true)、对页面 frame 节点执行 get_screenshot(filePath, nodeId)，如有布局问题再生成补丁批次。
适用场景：需要同时得到可读文本界面与可绘制设计规格的页面编排，例如设置页等表单型页面。
限制：文档未说明支持的组件全集、错误处理、性能与平台依赖；批量操作硬上限为每次 25 个；需遵循外部共享契约与 Pencil MCP 环境。其他细节暂未提供。