docs(webdev): codify tool page design defaults

2026-06-26 15:10:47 +00:00
parent 1c32bc1fbf
commit 3ab699d072
1 changed files with 11 additions and 0 deletions
@@ -14,6 +14,17 @@ description: UniDesk Web 开发与浏览器验证技能。用户处理 UniDesk/H
 - Web probe、Playwright、fake-server 的详细命令和历史判定口径见 [references/full.md](references/full.md)。
 - 前端改动遵循仓库既有设计系统和 `$frontend-design` 全局 UI 规则；不要做营销式落地页替代真实工具页面。

+## 通用 Web 设计默认
+
+- UniDesk/HWLAB 的工具页默认是工作界面，不是营销页：首屏直接呈现可操作对象、状态和主要任务流，避免 hero、装饰卡片和说明性大段文案。
+- 信息密度优先但要稳定：header 保持窄，source/file/project 等上下文选择放在顶部工具栏或状态栏下拉；计数、来源、taskRef、更新时间等元信息收敛到详情/感叹号弹窗，不长期占主版面。
+- 主内容区必须占优：树、大纲、列表和导航只作为左侧辅助视图，默认约 30% 或更小，并支持折叠或调整宽度；正文、报告、trace、消息或表格等主工作内容应占页面主要空间。
+- 新建、配置、probe、reindex 等低频表单用对话框或抽屉承载；默认版面不要常驻新建框、配置表或调试面板。高频命令保留为稳定按钮或图标按钮，并配清晰状态。
+- 文档/任务类页面优先就地阅读和就地编辑：标题和正文双击或显式编辑态切换，不为常规查看单独铺满输入框；正文渲染态必须可见，不能只显示 taskRef、文件名或更新时间。
+- 报告、Markdown、日志和 JSON 片段要用成熟 Markdown/代码块渲染，代码块采用浅色 Workbench 风格、可滚动且不撑破布局；不要把裸 JSON 或长日志直接挤爆页面。
+- 页面状态要可深链：重要 source/file/task/report/session 选择进入 RESTful URL，并能刷新后恢复；联动其他功能只通过公共 API、稳定 id 和 URL，不把两个功能互相嵌入成强依赖。
+- 设计验收必须用截图或 web-probe 样本检查真实版面：正文是否可见、主区域是否足够、弹窗是否遮挡流程、长文本是否溢出、移动/窄屏是否仍可操作。
+
 ## 高频工作流

 1. 先确认目标：repo、分支/lane、node、用户入口 URL、预期页面或 workflow。