人工智能AI 应用桌面应用【免费下载链接】open-codesignOpen-source Claude Design alternative. One-click import your Claude Code / Codex API key. Prompt → prototype / slides / PDF. Multi-model (Claude, GPT, Gemini, Kimi, GLM, Ollama). BYOK, local-first, MIT.项目地址https://gitcode.com/gh_mirrors/op/open-codesign点击查看免费下载本文以 Open CoDesign 仓库内置的方法技能文档 apps/desktop/resources/templates/skills/app-shell-navigation.md 为核心结合其 frontmatter 定义、技能加载器与分发机制系统拆解应用外壳App Shell导航的设计契约如何围绕用户任务组织导航、如何让共享记录与操作可达、如何保证焦点与连续性。读完你将掌握这套被写入技能体系、并由skill()工具在生成流程中调用的导航设计规范能够直接用于产品外壳、仪表盘或任何引入新目的地/详情视图的改动。一、技能是什么一份被机器解析、被 Agent 执行的导航设计契约app-shell-navigation.md并不是一篇普通的 Markdown 文章而是 Open CoDesign 内置的方法技能method skill之一。它通过文件头部的 YAML frontmatter 声明元数据正文则定义具体的设计规则。当用户在 Open CoDesign 中发起涉及应用外壳、导航、侧边栏或用户旅程新入口的生成任务时Agent 会通过skill()工具加载这份规则再开始写代码。1.1 frontmatter 元数据解读字段值含义schemaVersion1frontmatter 模式版本必须为 1nameapp-shell-navigation技能唯一标识文件名去掉.mddescription连接产品导航、共享记录、工作区与恢复路径触发技能时注入 Agent 的用途说明aliasesapp-shell, sidebar, navigation, dashboard-shell, admin-shell, ia别名skill()可按别名命中dependenciesartifact-composition, responsive-layout, accessibility-states依赖的兄弟技能构成方法组validationHints可见目的地必须到达已实现内容并保留记录操作新入口必须保留共享状态与返回/恢复路径后续人工或自动校验的检查要点trigger.providers[*]对所有模型提供商生效trigger.scopesystem系统级触发区别于prefix前缀触发disable_model_invocationfalse允许模型自行调用user_invocabletrue用户也可显式唤起这套 frontmatter 的合法字段由 packages/shared/src/skills.ts 中的SkillFrontmatterV1Zod schema约束name、description、aliases、dependencies、validationHints、trigger含providers与scope、disable_model_invocation、user_invocable以及可选的allowed_tools。加载时若 frontmatter 不合规技能会被判定为Invalid frontmatter并抛出SKILL_LOAD_FAILED错误。1.2 加载链路从磁盘到 Agent 上下文加载器packages/core/src/skills/loader.ts 中的parseFrontmatter负责解析---分隔的 frontmatter支持折叠标量、字面标量|、内联序列[a, b, c]与块序列loadSkillsFromDir将目录下所有.md文件加载为LoadedSkill。三级优先级loadAllSkills按project user builtin合并同名技能即项目级技能覆盖用户级用户级覆盖内置。app-shell-navigation.md属于builtin内置层位于 apps/desktop/resources/templates/skills/。调用入口packages/core/src/tools/skill.ts 中的skill工具提供name参数如app-shell-navigation通过invokeSkill按名字或别名查找清单、读取正文并注入 Agent 会话同一会话内重复调用会返回already-loaded短响应避免重复注入整段文本。分发落地内置技能目录会随应用安装被复制到用户数据目录userData/templates/skills/成为可编辑的模板树详见 apps/desktop/resources/templates/README.md。1.3 测试契约正文内容被测试锁定packages/core/src/prompts/connected-product.test.ts 中的条件方法契约测试会从内置技能目录加载技能并断言正文必须包含关键短语例如app-shell-navigation必须包含Real#section-idanchors are valid、My Bookings、Cancel and booking details/confirmation与Testing only ... the old confirmation screen misses this regression。这意味着正文中的核心示例不是随意文字而是被测试锁定的契约条款。此外 packages/core/src/skills/loader.test.ts 会断言技能 ID 集合中包含app-shell-navigation确保它始终被正确装载。二、任务导向外壳Task-Oriented Shell导航围绕用户的工作组织技能正文第一部分给出了外壳设计的第一原则导航要围绕用户的工作组织而不是套用标准外壳模板。具体要求包括使用具体标签导航项名称要直白如My Bookings而非模糊的Services突出当前活跃目的地并让页面标题/主操作可见。按需提供工具搜索、筛选、详情与状态信息只在任务需要的地方出现不要为了凑齐标准外壳解剖结构而强行添加账户、通知、KPI 或图表模块——这是该方法技能区别于通用仪表盘教程的核心立场。按空间选导航形态根据可用空间在侧边栏、标签页或紧凑移动端导航之间选择。视口变化时保持层级清晰内容层级与当前选中目的地要在视口变化如窗口缩放后依然明确稳定的宽度与反馈机制应防止意外布局跳动。这条原则与依赖技能responsive-layout、artifact-composition相互呼应外壳只是承载任务的骨架内容编排与响应式行为由配套技能负责导航本体应当克制。三、共享记录与可达操作Shared Records And Reachable Actions单一事实来源第二部分解决的是数据从哪来、操作怎么够得着的问题是该方法技能最有工程价值的部分。3.1 记录归属与单一事实来源领域记录domain records应放在应用根或另一个共享属主处并持有稳定的 ID。列表、详情、筛选器与计数都要从同一来源派生而不是在每个页面上各自维护一份独立拷贝。路由/屏幕状态与选择状态应引用这些记录而不是在页面里播种独立副本——否则一处改动会引发多页不同步。3.2 目的地必须真实可达新增导航控件时必须追溯到三件事目的地destination、相关操作relevant action、返回路径return path。技能给出了判定假目的地的明确标准真实#section-id锚点如#bookings在单页仪表盘中是合法目的地href#、虚构路由或 404 页面不算已实现的目的地不可用目的地要么省略要么禁用并给出原因——不能用占位链接糊弄。3.3 扩展旅程时保留既有操作当扩展一个用户旅程时先识别受影响的入口点以及记录上已有的操作。已存在的操作应通过直达入口或可用的详情链接保留访问不一定要在每屏重复按钮。技能给出的示例是新增一个带改期Reschedule的 My Bookings 列表时仍必须能访问取消Cancel与预订详情/确认页。从该列表发起的取消必须改变同一个预订状态并返回到一个有用的视图。如果只测试旧的确认页就会漏掉这个回归。这一条揭示了导航改动的真实风险新增入口很容易让用户绕开既有状态流导致同一记录在不同入口下状态不一致。四、焦点与连续性Focus And Continuity返回、关闭与可访问的焦点第三部分把注意力转向交互的事后体验与可访问性返回与关闭要恢复上下文Back/关闭操作应恢复到有用的列表/筛选上下文而不是回到空白根页。新屏要有标题与焦点目的地新显示的屏幕需要有意义的标题并把焦点有意识地放到目标位置。对话框焦点封闭对话框打开期间焦点被约束在对话框内关闭时把焦点还给一个合理的控件这也与依赖技能accessibility-states的可聚焦页面标题要求一致。操作命名一致导航动作名称在各入口点之间保持一致避免同一操作在不同页面叫不同名字。五、工程实现层面复用、小步改动与恢复路径技能在正文末尾给出了落地工作方式优先复用现有的处理器handlers与组件批量最小且连贯的改动并逐一检查新入口路径、变更mutation、依赖视图与恢复recovery不要把一次窄范围的视觉修订扩散成无关的流程改造。这与 Open CoDesign 的整体生成管线generate → 应用修改 → done 校验的哲学一致每次改动都应有可验证的副作用边界。六、版本管理与升级机制为什么这份技能会被安全地更新app-shell-navigation.md是七个受管理的已知方法技能之一。在 apps/desktop/src/main/method-skill-history.ts 中它的文件名出现在METHOD_SKILL_HISTORY中记录着历史修订的 SHA-256 哈希对每个版本对应的字节级哈希与 git 提交哈希。升级机制的安全约束详见 apps/desktop/resources/templates/README.md 的Method skill upgrades一节启动时只允许刷新这七个已知方法文件用户已修改的文件必须与历史字节精确匹配才会被升级未知/自定义文件、链接与 junction 一律保留升级前在userData/templates/.codesign-skill-upgrades/transaction/记录旧/新哈希保留original.md并以原子 no-replace方式发布新文件恢复只发生在启动时绝不覆盖并发创建的文件不支持的操作码ENOTSUP、EOPNOTSUPP、EXDEV会报告为失败升级并保留原件启动继续没有热重载、重置 UI 或自动更新私有品牌参考/工作区DESIGN.md/脚手架的安全捷径。这套机制保证了app-shell-navigation这类内置技能既能随版本演进又不会破坏用户在模板树中的定制内容。七、实践清单把技能转化为可执行的检查表综合正文与源码一次应用外壳/导航改动应当依次通过以下检查检查项来源依据导航围绕任务组织无凑数的账户/通知/KPI/图表模块文档 §Task-Oriented Shell活跃目的地清晰页面有标题与主操作同上记录持有稳定 ID列表/详情/筛选/计数派生自同一来源文档 §Shared Records And Reachable Actions每个新导航控件都有真实目的地、相关操作与返回路径同上href#、虚构路由、404 均视为未实现目的地同上扩展旅程保留既有记录操作如新列表仍可取消/查看详情同上 connected-product.test.ts 契约断言Back/关闭恢复有用上下文新屏有标题与焦点对话框焦点封闭文档 §Focus And Continuity操作命名跨入口一致同上复用现有处理器改动小且连贯检查入口/变更/依赖视图/恢复文档结尾 skill.ts 的按会话去重注入机制结语app-shell-navigation是 Open CoDesign 方法技能体系中壳与流的守卫者它用任务导向替代模板化外壳用单一事实来源约束记录与操作的可达性用焦点与恢复路径保证连续交互的质量并通过 frontmatter 模式、三级加载优先级、skill()工具注入与受控版本升级把这份规范真正嵌入了 AI 生成工作流。理解它也就理解了如何在 AI 辅助设计中稳定地交付可导航、可操作、可恢复的应用外壳。延伸阅读技能加载与 frontmatter 解析见 packages/core/src/skills/loader.ts 与 packages/shared/src/skills.ts技能调用工具见 packages/core/src/tools/skill.ts内置模板树说明与升级机制见 apps/desktop/resources/templates/README.md 与 apps/desktop/src/main/method-skill-history.ts技能契约测试见 packages/core/src/prompts/connected-product.test.ts 与 packages/core/src/skills/loader.test.ts。赞分享人工智能AI 应用桌面应用【免费下载链接】open-codesignOpen-source Claude Design alternative. One-click import your Claude Code / Codex API key. Prompt → prototype / slides / PDF. Multi-model (Claude, GPT, Gemini, Kimi, GLM, Ollama). BYOK, local-first, MIT.项目地址https://gitcode.com/gh_mirrors/op/open-codesign点击查看免费下载相关推荐offline-plugin应用外壳(App Shell)模式构建高性能单页应用的终极方案offline plugin应用外壳 App Shell 模式构建高性能单页应用的终极方案 在现代Web开发中构建快速响应且离线可用的单页应用 SPA 已成前端构建React 应用外壳导航实战用 coss Sidebar 构建可折叠的持久化侧边栏React 应用外壳导航实战用 coss Sidebar 构建可折叠的持久化侧边栏 本篇指南以 coss 组件体系中的 Sidebar 原语primitiv企业应用后端前端Vuetify 侧边导航线框模板实战用 VNavigationDrawer Rail 模式构建极简应用外壳Vuetify 侧边导航线框模板实战用 VNavigationDrawer Rail 模式构建极简应用外壳 侧边导航Side Navigation是桌面端前端UI组件上一篇archinstall数字取证Autopsy与The Sleuth Kit下一篇如何打造个性化Kitty终端终极主题与外观自定义指南创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
:下载、安装)
