Design Analysis Skill 是一款专为设计师和开发团队打造的自动化设计分析工具，能够智能扫描本地文件夹中的设计素材（如截图、设计稿等图片文件），并自动生成结构化的多章节 HTML 演示文档。该工具的核心价值在于将原本零散的设计资源转化为系统化、可交互的展示形式，极大提升了设计评审、项目汇报或跨部门协作的效率。通过简洁的 API 调用，用户只需指定输入文件夹路径和输出文件位置，即可一键生成包含导航控制、翻页动画和响应式布局的专业级演示页面。支持自定义页面尺寸、文字与图片区域的宽度比例，甚至允许插入自定义章节内容和标签，满足从基础展示到深度解读的各种需求。无论是用于内部设计走查、客户提案还是教学演示，它都能帮助团队固化‘分析-整理-呈现’的工作流程，实现设计资产的高效复用与传播。
核心功能特点
- 自动扫描并识别 PNG、JPG、JPEG、GIF 格式的图片文件
- 基于文件名和时间戳智能划分章节，生成结构化 HTML 文档
- 采用 30/70 分栏布局，左侧为文字说明，右侧为图片展示
- 内置侧边导航点和底部翻页控件，支持键盘方向键操作
- 提供平滑翻页动画与移动端自适应响应式设计
- 支持自定义页面分辨率、布局比例及章节内容配置
适用场景
Design Analysis Skill 特别适用于需要将大量设计稿快速转化为可视化报告的场景。例如，在产品设计迭代过程中，产品经理可以收集多个版本的 UI 截图存入指定文件夹，运行工具后立即生成一份带有详细说明的在线演示文档，便于与开发、测试团队同步最新改动；在客户汇报环节，设计师可将原型图和设计规范整理成册，通过生成的 HTML 文件进行流畅的逐页讲解，增强沟通效果。此外，对于教育领域，讲师也能利用此工具将课程中的界面设计案例制作成交互式课件，学生可通过网页直观理解设计逻辑。由于输出为独立 HTML 文件，无需依赖服务器即可在任何设备上浏览，非常适合离线分享或嵌入内网系统。其灵活的定制能力也使其成为构建标准化设计文档体系的重要组件，帮助团队建立统一的内容输出规范。