Agent Skills
› opennookorg/screenshot-studio
opennookorg/screenshot-studio
GitHub该技能用于撰写、重写或优化营销文案，涵盖首页、落地页及定价页等。遵循清晰、利益导向原则，指导Agent收集上下文并应用写作规范，以提升转化率。
Install All Skills
npx skills add opennookorg/screenshot-studio --all -g -y
Skills in Collection (20)
该技能用于撰写、重写或优化营销文案，涵盖首页、落地页及定价页等。遵循清晰、利益导向原则，指导Agent收集上下文并应用写作规范，以提升转化率。
用户需要撰写营销文案
要求改进或重写页面内容
寻求标题或CTA帮助
npx skills add opennookorg/screenshot-studio --skill copywriting -g -y
提供Web界面动画最佳实践指南，涵盖React、CSS及Framer Motion。用于指导添加动画、选择缓动曲线、实现手势交互（如滑动、拖拽）、构建Toast或抽屉组件，以及优化性能和可访问性。
在React组件中添加动画
选择缓动曲线或时间值
实现基于手势的交互
构建通知或抽屉组件
优化动画性能
npx skills add opennookorg/screenshot-studio --skill emilkowal-animations -g -y
指导创建具有独特设计感的生产级前端界面，避免通用AI美学。适用于构建网页、组件、仪表盘等，强调大胆的美学方向和精细的视觉细节实现。
用户要求构建网站或着陆页
需要生成React或HTML/CSS组件
请求美化或重新设计Web UI
npx skills add opennookorg/screenshot-studio --skill frontend-design -g -y
应用心理学原理和思维模型指导营销决策，帮助用户理解消费者行为、伦理影响及购买动机。
用户提及心理原则或思维模型
讨论认知偏差、说服技巧、行为科学
分析消费者购买原因或决策过程
npx skills add opennookorg/screenshot-studio --skill marketing-psychology -g -y
用于通过模板和数据大规模创建SEO优化页面的技能，涵盖策略评估、核心原则及12种页面生成模式，旨在提升排名并避免内容惩罚。
programmatic SEO
template pages
pages at scale
directory pages
location pages
npx skills add opennookorg/screenshot-studio --skill programmatic-seo -g -y
用于诊断网站SEO问题并提供优化建议的技能，涵盖爬虫、技术基础、页面优化及内容质量等维度。
用户想要审计或诊断SEO问题
提及SEO审计、技术SEO、排名低原因、SEO健康检查
npx skills add opennookorg/screenshot-studio --skill seo-audit -g -y
提供React组件组合模式的规范，涵盖避免布尔属性泛滥、复合组件、状态提升及React 19 API变更，旨在优化组件架构与可维护性。
重构包含大量布尔属性的组件
构建可复用的组件库
审查或设计组件架构
使用复合组件或上下文提供者
npx skills add opennookorg/screenshot-studio --skill vercel-composition-patterns -g -y
提供Vercel工程团队的React与Next.js性能优化指南，涵盖消除瀑布流、包体积优化及服务端渲染等57条规则。用于指导代码编写、审查与重构，确保应用高性能表现。
编写或重构React组件和Next.js页面
实施客户端或服务端数据获取逻辑
进行代码性能审查以识别瓶颈
优化应用包体积或加载速度
npx skills add opennookorg/screenshot-studio --skill vercel-react-best-practices -g -y
审查UI代码是否符合Web界面指南，支持访问性检查、设计审计和UX评估。通过获取最新规范并比对文件内容，以简洁格式输出合规性问题。
review my UI
check accessibility
audit design
review UX
npx skills add opennookorg/screenshot-studio --skill web-design-guidelines -g -y
专家级转化文案技能，用于撰写和优化营销页面（如首页、落地页）的文案。强调清晰性、利益点导向及客户语言，旨在驱动用户行动并提升转化率。
用户要求撰写或重写营销文案
需要优化标题或CTA文案
针对特定页面进行文案改进
npx skills add opennookorg/screenshot-studio --skill copywriting -g -y
提供Emil Kowalski的Web界面动画最佳实践，涵盖React、CSS和Framer Motion。用于指导添加动画、选择缓动曲线、实现手势交互及优化性能与可访问性。
在React组件中添加动画
选择缓动曲线或时间值
实现基于手势的交互如滑动和拖拽
构建通知提示或抽屉组件
npx skills add opennookorg/screenshot-studio --skill emilkowal-animations -g -y
用于创建独特、生产级的前端界面，避免通用AI美学。适用于构建网页组件、页面、海报或应用，强调大胆的审美方向、精细的排版与动效，生成高质量且具辨识度的前端代码。
用户要求构建网页组件或页面
需要美化或重新设计Web UI
要求生成具有独特设计风格的前端代码
npx skills add opennookorg/screenshot-studio --skill frontend-design -g -y
应用心理学原理和思维模型指导营销策略，解释消费者行为与决策机制，提供伦理影响行为的建议。
提及心理原则或行为科学
询问消费者行为或购买动机
npx skills add opennookorg/screenshot-studio --skill marketing-psychology -g -y
用于通过模板和数据大规模创建SEO驱动页面的技能，涵盖目录、位置及比较页等场景，旨在优化排名并避免内容惩罚。
programmatic SEO
template pages
pages at scale
directory pages
location pages
npx skills add opennookorg/screenshot-studio --skill programmatic-seo -g -y
用于执行网站SEO审计、诊断技术问题及提供优化建议的专家技能。涵盖爬取、索引、速度、移动端及安全等核心领域，旨在提升有机搜索表现。
用户请求进行SEO审计或审查
询问技术SEO问题
咨询为何排名不佳
提及SEO健康检查或元标签审查
npx skills add opennookorg/screenshot-studio --skill seo-audit -g -y
提供React组件组合模式指南，用于解决布尔属性泛滥、构建可复用组件库及设计灵活API。涵盖复合组件、状态提升、Context及React 19新特性，辅助重构与架构审查。
重构含大量布尔属性的组件
构建可复用组件库
审查组件架构
使用复合组件或Context Provider
npx skills add opennookorg/screenshot-studio --skill vercel-composition-patterns -g -y
基于Vercel工程团队的React和Next.js性能优化指南，涵盖消除数据瀑布、Bundle优化及服务端渲染等57条规则。用于指导代码编写、审查与重构，确保前端应用达到最佳性能表现。
编写或重构React/Next.js组件
审查代码以发现性能瓶颈
优化Bundle大小或加载速度
实现客户端或服务端数据获取
npx skills add opennookorg/screenshot-studio --skill vercel-react-best-practices -g -y
用于审查 Web UI 代码是否符合界面设计规范。通过获取最新指南，检查指定文件并输出违规位置，适用于 UI 审核、可访问性检查和 UX 最佳实践验证场景。
review my UI
check accessibility
audit design
npx skills add opennookorg/screenshot-studio --skill web-design-guidelines -g -y
专注于AI搜索引擎优化，帮助用户内容在ChatGPT、Perplexity等AI助手及Google AI Overviews中被引用和展示。提供平台机制解析与策略指导。
用户希望内容被AI大模型引用
提及AI SEO、AEO、LLMO或优化ChatGPT/Perplexity
询问如何出现在AI生成答案中
npx skills add opennookorg/screenshot-studio --skill ai-seo -g -y
优化内容以在AI搜索引擎和LLM中被引用，提升品牌在AI生成答案中的可见性。
用户希望内容被AI搜索引擎或大语言模型引用
提及AI SEO、AEO、GEO、LLMO等术语
询问如何出现在ChatGPT、Perplexity等AI助手的答案中
npx skills add opennookorg/screenshot-studio --skill ai-seo -g -y
