OpenDesign

将功能提案、路线图、设计评审和复盘材料整理为辅助决策的HTML幻灯片。从八种主题中选择一种，统一所有页面的视觉风格，并支持横向翻页。

• 说明采用新功能的理由
• 准备路线图评审材料
• 比较技术设计方案

将代码编辑中累积的修改整理为差异文件和逐文件说明，通过交互界面选择接受、拒绝或部分接受，记录决定，并撤销计划范围内被拒绝的修改。

• 检查代码迁移后的修改
• 逐个文件批准修改
• 在交接时记录审查决定

用单个HTML文件制作面向创作者的社交媒体分析界面原型，以相互一致的示例数据展示多平台粉丝数、互动指标、增长趋势、热门帖子、话题和评论。

• 制作创作者分析界面原型
• 设计多平台指标展示方式
• 展示粉丝趋势与热门帖子

从Figma文件中提取元素层级、颜色与文字等设计设置，以及标记为可导出的图像素材，并保存为项目文件，供后续转换和实现使用。

• 提取Figma元素结构
• 收集颜色、文字和间距设置
• 准备实现所需素材

创建包含产品介绍、功能、客户评价或标志、可选价格及注册引导的SaaS介绍页，遵循DESIGN.md的配色、字体和布局规则，输出单个HTML文件。

• 创建SaaS产品介绍页
• 遵循现有设计规范
• 集中展示功能、客户反馈和价格

将粒子、分形或数据运动制成单个HTML可视化页面，把繁重计算交给Web Worker，以每秒约60帧为目标绘制画面，并显示粒子数量、传输方式和帧率。

• 制作粒子与物理模拟原型
• 绘制分形可视化画面
• 制作音频与数据可视化页面

汇总Notion过去24小时的文档编辑、评论、提及和数据库行变更，整理成采用Notion显示形式的每日简报页面，方便集中查看更新。

• 查看前一天的Notion文档编辑
• 每日查看评论和提及
• 集中查看数据库行变更

将代码重写计划逐步落实为便于审查的小范围修改，核对目标文件与风险限制，并记录每一步的修改原因、执行情况和进度。

• 分阶段执行代码迁移计划
• 审查局部代码修改
• 记录完成或跳过步骤的原因

将屏幕布局构想制作成手绘风格的HTML线框图，结合方格纸背景、便签、粗略图表和方案标签，可视化设计初期的想法，便于讨论与评审。

• 探索门户或仪表盘的初步布局
• 用标签标识多个设计方案
• 为屏幕草稿添加评审注释

在跨文件代码改写前，整理各文件的职责、修改对象、执行顺序与风险，生成供后续编辑、差异审查和构建测试参考的计划。

• 规划跨多个文件的代码修改
• 区分单个组件与共享部分的修改范围
• 按修改范围与风险安排顺序

制作以银灰色或奶油色为基调、质感柔和的网页原型，统一设计双层边框卡片、大圆角、悬浮导航和流畅动效，并规定移动端布局。

• 制作风格沉静的SaaS网站原型
• 探索消费产品网站的视觉质感
• 用卡片和按钮介绍功能

根据品牌的配色、字体和布局，制作产品发布前的预登记页面。将标志、产品介绍和邮箱登记表单整合到一个HTML文件中，并兼顾移动端显示与输入验证。

• 制作产品发布前的邮箱登记页面
• 招募测试版参与者
• 收集提前体验的意向

在复制或重建的网站交付、上线前，检查视觉差异、跟踪脚本、原品牌残留、非预期语言、占位文字及外部依赖，并提供有证据支持的审查报告。

• 上线前检查复制的网站
• 查找原品牌或非预期语言残留
• 检查跟踪脚本和外部依赖

将Linear过去24小时的事项更新、状态变化、负责人分配和周期进度整理为每日摘要，由Orbit自动运行，并以类似Linear收件箱的紧凑界面展示。

• 查看Linear过去24小时的更新
• 关注已分配、停滞或高优先级事项
• 查看周期进度与剩余时间

针对复杂且判断失误代价较高的任务，分阶段核对前提、收集证据、开展多角度分析并执行验证，整理建议方案、取舍、风险和成功标准。

• 比较系统架构方案
• 规划跨系统变更
• 重新审视模糊需求的前提

在制作前，根据现有设计规则、品牌资料或项目需求确定一个视觉方向，整理配色、字体和留白等实施设置，并将选定方向写入计划。

• 实施前确定设计方向
• 应用现有设计规则
• 根据品牌资料制定设计方针

用灰色方框绘制桌面端着陆页结构，并以编号标注对应右侧规格面板，将页面布局与简短的实现、易用性说明放在一起，便于分享和交接。

• 规划桌面端着陆页结构
• 向开发人员分享规格说明
• 检查导航与主要宣传区域的布局

从布局、是否解决需求、品牌一致性、无障碍使用和文字表达五个方面检查已完成的设计，并继续修复发现的具体问题，适合交付前检查。

• 交付前检查设计
• 核对品牌规范的一致性
• 检查键盘操作和对比度

将移动应用的使用流程绘制为横向排列的三至四个手机框，用灰色占位块、虚线箭头、编号操作标签和简短注释，帮助检查画面结构与跳转关系。

• 梳理引导页到首页的流程
• 检查商品详情到确认的路径
• 在视觉设计前讨论页面跳转

制作包含价格方案卡片、功能对比表、常见问题和操作按钮的HTML页面，按需求安排方案数量及推荐标记，方便用户在订阅前比较服务内容。

• 制作订阅服务价格页原型
• 比较各方案包含的功能
• 展示个人与企业方案

从源代码、Figma导出数据或截图中收集颜色、字体、间距等设计参数，整理为附有来源和使用位置的JSON文件，为后续设计系统迁移准备数据。

• 整理分散在代码中的设计参数
• 准备迁移Figma设计
• 从截图中提取设计参数

将桌面端仪表盘的布局制作成以灰色块呈现的单个HTML线框图，帮助你在确定配色、照片和正式文案之前，检查导航、信息优先级及各面板的位置。

• 检查仪表盘布局
• 规划导航与信息优先级
• 安排KPI、图表和表格的位置

用于设计新网页、评估和改版现有界面，或分析网址与截图中的设计。梳理页面结构、配色、字体及交互状态，也可按优先级列出改进项。

• 设计新的落地页
• 为现有界面改进项排序
• 分析参考网页或图片

以单个HTML文件制作交易分析仪表板，集中呈现市场信息与风险面板，支持明暗主题、Live/Demo模式、图表详情和命令面板操作。

• 制作金融分析终端界面原型
• 展示密集排列的市场信息界面
• 演示图表详情和交互操作