Agent Skills
› moumen-soliman/uitripled
moumen-soliman/uitripled
GitHub提供基于 WCAG 2.2 标准的 Web 无障碍审计与改进指南,涵盖 POUR 原则、合规级别及可感知性规范(如替代文本、色彩对比度),旨在提升内容对残障用户的可用性。
Install All Skills
npx skills add moumen-soliman/uitripled --all -g -y
Skills in Collection (13)
提供基于 WCAG 2.2 标准的 Web 无障碍审计与改进指南,涵盖 POUR 原则、合规级别及可感知性规范(如替代文本、色彩对比度),旨在提升内容对残障用户的可用性。
improve accessibility
a11y audit
WCAG compliance
screen reader support
keyboard navigation
make accessible
npx skills add moumen-soliman/uitripled --skill accessibility -g -y
将模糊的动画描述反向查找为精确的专业术语,帮助用户准确命名动效以便与AI或设计师沟通。
询问动效名称
描述视觉效果但不知术语
npx skills add moumen-soliman/uitripled --skill animation-vocabulary -g -y
提供前端界面无障碍工程指南,涵盖原生元素优先、焦点管理、键盘导航及最小点击区域等规范,用于构建或审查符合WCAG标准的UI组件。
用户报告键盘或屏幕阅读器问题
构建或审查UI组件和自定义小部件
涉及a11y、WCAG、ARIA、focus ring、keyboard navigation等关键词
npx skills add moumen-soliman/uitripled --skill better-accessibility -g -y
数字产品色彩系统规范,涵盖调色板生成、主题切换及色值审计。指导如何构建符合无障碍标准的色阶、命名语义化 Token 并保证视觉一致性。
创建或扩展调色板
实现深色/浅色主题
代码库颜色审计
npx skills add moumen-soliman/uitripled --skill better-colors -g -y
跨学科界面综合评审技能,将界面路由至各细分领域技能收集证据并整合排名结论。专注于编排与范围界定,不重复其他技能的规则,确保评审基于事实而非主观偏好。
holistic interface review
review the whole screen
better-interface
npx skills add moumen-soliman/uitripled --skill better-interface -g -y
提供Web界面布局结构指导,涵盖间距、对齐、分组及响应式设计。用于构建页面组件、处理断点适配、检查布局代码及优化视觉层级与可读性。
需要设计或调整页面/组件的布局结构
审查前端代码中的间距、对齐和分组问题
处理响应式断点、RTL布局或安全区域适配
npx skills add moumen-soliman/uitripled --skill better-layout -g -y
专注Web排版优化的技能,涵盖字体选择、类型比例设置及文本组件样式处理。提供WOFF2加载、CSS属性规范、字体合成控制及语义化命名建议,确保跨设备文本渲染质量与可读性。
Web排版设计
字体加载与格式选择
类型比例与层级设定
文本截断与换行优化
CSS字体属性配置
npx skills add moumen-soliman/uitripled --skill better-typography -g -y
提供UI打磨原则,涵盖边框圆角、视觉对齐、阴影层级及各类动画规范。用于构建组件、实现动效或处理视觉细节,确保界面精致感与一致性。
UI polish
feels off
stagger animations
enter animations
theme switch transitions
border radius
optical alignment
image outlines
box shadows
icon stroke weight
motion restraint
npx skills add moumen-soliman/uitripled --skill better-ui -g -y
专注用户界面文案的撰写与审查,涵盖按钮、错误提示等微复制。强调清晰、一致及适配语境的语气,提供从语音调研到具体写作规范的指导。
UX 文案撰写
界面微复制审查
按钮标签优化
错误信息编写
语气与风格调整
npx skills add moumen-soliman/uitripled --skill better-writing -g -y
指导用户建立设计工程职能,弥合设计与开发团队间的差距。涵盖角色定义、组织定位、招聘策略及核心原则,助力高效原型与生产代码交付。
创建设计工程职能
招聘设计工程师
解决设计与工程协作摩擦
npx skills add moumen-soliman/uitripled --skill design-engineering -g -y
基于 Emil Kowalski 的设计工程哲学,指导 UI 细节打磨、组件设计与动画决策。强调通过训练培养品味,关注用户未察觉的隐形细节以提升体验,并将美感作为产品差异化杠杆。
UI 代码审查
界面交互设计咨询
动画与过渡效果优化
npx skills add moumen-soliman/uitripled --skill emil-design-eng -g -y
提供UI细节打磨原则,涵盖排版、动效、阴影等视觉优化技巧,用于提升界面精致度。
构建或审查UI组件
实现动画与微交互
处理视觉细节如阴影、圆角
npx skills add moumen-soliman/uitripled --skill make-interfaces-feel-better -g -y
提供21种生产就绪的CSS过渡动画片段,涵盖下拉、模态框、加载状态等UI交互。支持无框架依赖、语义化属性及无障碍适配,用于快速实现平滑视觉反馈。
添加过渡动画
平滑打开模态框
图标切换效果
页面滑动切换
骨架屏加载
错误抖动反馈
卡片悬停倾斜
npx skills add moumen-soliman/uitripled --skill transitions-dev -g -y


