Agent Skills
› 1weiho/open-slide
1weiho/open-slide
GitHub提供Apple风格的Web界面设计指南，涵盖手势驱动UI、弹簧动画、拖拽交互及响应式反馈。用于构建具有物理动量、可中断过渡和直观操作的流畅前端体验。
Install All Skills
npx skills add 1weiho/open-slide --all -g -y
Skills in Collection (13)
提供Apple风格的Web界面设计指南，涵盖手势驱动UI、弹簧动画、拖拽交互及响应式反馈。用于构建具有物理动量、可中断过渡和直观操作的流畅前端体验。
实现手势驱动的UI交互
开发弹簧动画或平滑过渡效果
优化界面响应延迟与直接操作体验
npx skills add 1weiho/open-slide --skill apple-design -g -y
基于 Emil Kowalski 的设计工程哲学，专注于 UI 细节打磨、组件设计与动画决策。提供界面审查格式规范，强调通过训练出的品味和隐形细节提升软件体验，使界面更自然流畅且具差异化竞争力。
用户请求 UI 代码审查或优化建议
询问关于界面动画、交互细节或设计品味的最佳实践
npx skills add 1weiho/open-slide --skill emil-design-eng -g -y
指导创建独特且生产级的前端界面，避免通用AI美学。用于构建网页、组件或应用，强调大胆的美学方向、排版、色彩和动效，生成高质量代码。
用户要求构建网页组件或页面
需要美化或重新设计Web UI
npx skills add 1weiho/open-slide --skill frontend-design -g -y
基于 Emil Kowalski 设计工程理念的高级动画代码审查技能，严格评估动效的合理性、性能及可访问性，默认标记问题直至达标。
请求审查前端动画或运动代码
评估 UI 动效是否符合高标准设计规范
npx skills add 1weiho/open-slide --skill review-animations -g -y
管理 shadcn/ui 组件与项目，支持添加、搜索、调试、样式调整及 UI 组合。提供项目上下文、组件文档和使用示例，强制执行 Tailwind 样式、表单及组件结构规范，适用于基于 shadcn/ui 的开发工作。
需要添加或搜索 shadcn 组件
修复 shadcn 组件样式或结构问题
初始化 shadcn 项目或使用 preset
npx skills add 1weiho/open-slide --skill shadcn -g -y
提供React组件组合模式指南，解决布尔属性泛滥问题，支持构建灵活、可复用的组件库及API设计，涵盖复合组件、状态提升及React 19新特性。
重构包含大量布尔属性的组件
构建可复用组件库
设计灵活的组件API
审查组件架构
npx skills add 1weiho/open-slide --skill vercel-composition-patterns -g -y
基于Vercel工程团队的React和Next.js性能优化指南，涵盖消除瀑布流、包体积优化及服务端性能等70条规则。适用于编写、审查或重构代码时确保最佳实践。
编写新的React组件或Next.js页面
审查代码以发现性能问题
重构现有React/Next.js代码
优化数据获取逻辑
减少应用包体积
npx skills add 1weiho/open-slide --skill vercel-react-best-practices -g -y
审查Web界面代码是否符合设计规范，支持UI、可访问性及UX审计。
review my UI
check accessibility
audit design
npx skills add 1weiho/open-slide --skill web-design-guidelines -g -y
解析并应用由open-slide inspector生成的@slide-comment标记，读取注释内容后对slides目录下的TSX文件进行代码修改并移除标记。
用户要求应用幻灯片评论
处理inspector留下的标记
执行apply comments操作
npx skills add 1weiho/open-slide --skill apply-comments -g -y
指导AI在open-slide仓库中创建演示文稿，包括选择主题、澄清需求及调用slide-authoring技能生成幻灯片内容，不涉及框架修改。
制作关于X的幻灯片
创建演示文稿
起草幻灯片脚本
npx skills add 1weiho/open-slide --skill create-slide -g -y
解决用户在 open-slide dev server 中当前查看的幻灯片、页面及选中元素。通过每次读取 current.json 获取最新位置，支持基于指代引用的内容修改。
用户提到 'this page' 或 'current slide'
用户请求编辑当前视图中的特定元素
npx skills add 1weiho/open-slide --skill current-slide -g -y
用于在open-slide仓库中创建或提取幻灯片主题包。生成.md文档和.demo.tsx预览文件，支持从图片、文本或现有幻灯片提取视觉风格，不修改真实幻灯片内容。
create a theme
make a theme called X
extract a theme from <slide>
build a theme from these images
npx skills add 1weiho/open-slide --skill create-theme -g -y
提供幻灯片页面编写的技术规范，涵盖文件结构、设计系统、组件用法及动画过渡规则。用于指导在指定目录下创建或修改幻灯片内容，确保符合框架标准。
编辑幻灯片
调整布局
添加转场效果
编写演讲备注
npx skills add 1weiho/open-slide --skill slide-authoring -g -y
