用途:快速原型化并展示 HTML/CSS 设计稿,通过本地服务器提供画廊式预览,适合网站设计原型、视觉概念迭代和设计演示。
主要能力:按三个阶段组织设计工作。阶段一风格探索,在 mockups/ 根目录创建多个不同美学方向的完整概念页(如 retro-terminal.html、minimal-stark.html);阶段二站点模板,在选定方向的子目录(如 mockups/terminal-v2-site/)中建立共享 styles.css 与各页面模板(home、post、about、project、archive、search、404);阶段三区块探索,在选定方向目录内以 {section}-{variant}.html 命名迭代具体组件。
使用方式:先预留端口 portman reserve 3000 --name "{project-name}" --desc "Design mockups",创建项目目录与 mockups、docs/logs 子目录,执行 npm init -y 与 npm install express,将提供的 server.js 模板保存后运行 npm start。服务器在 0.0.0.0:3000 提供画廊页面,展示各 mockup 的色板与描述,并给出本地与局域网访问地址。
约定与限制:迭代不覆盖旧文件,用 -v2、-v3 命名;阶段二起共用 styles.css;新增或移动 mockup 后需更新 server.js 中的列表并重启服务;用 portman check {port} 确认端口状态。资料未提供该技能的收费、平台支持范围或效果保证等信息。