Interface Lab

Interface Lab 资源库

资源库技能119

技能页收纳所有可复用的局部 Prompt 技法。

局部技能负责布局、动效、边框、阴影、WebGL、图标和组件表现。先挑选当前项目需要的局部能力,再继续组合系统和素材。

技能119
网站设计系统93
PPT 风格55
素材232
技能

提示技能

局部表现层:布局、动效、边框、阴影、WebGL 和可复制的 prompt 技法。

切到风格
验证 · 0Pro

视觉验证清单

为网页和组件生成后的检查提供桌面/移动截图、构建、可访问性、资源加载、布局稳定和交互状态验证规则。

为网页和组件生成后的检查提供桌面/移动截图、构建、可访问性、资源加载、布局稳定和交互状态验证规则。Pro
验证 · 0Pro

动效可访问与性能 QA

审计页面和组件动效的目的、reduced-motion、滚动/循环控制、性能属性、生命周期清理和桌面/移动验证证据。

输入必须包含:页面/组件 URL 或代码、动效清单、触发方式(load/hover/tap/scroll/drag/route)、使用库(CSS/Motion/GSAP/Lenis/Lottie/Anime.js)、目标设备和是否有 reduced-motion 要求。Pro
验证 · 0Pro

Copy-in 动效组件本地化验收

把已选用的 Lottie、Motion、GSAP、Magic UI 或 registry 动效组件改造成本地化、可访问、可降级、可验证的生产组件。

输入必须包含:已选组件来源、目标页面/任务、zh/en 文案、状态列表、动效库、是否自动播放/循环、目标视口、授权记录和生产验收要求。Pro
验证 · 0Pro

首屏产品信号审计

检查 hero/首屏是否立即呈现真实对象、价值、行动、媒体裁切和下一屏暗示,避免抽象空壳首屏。

先识别页面首屏要让用户确认的对象:品牌、产品、场所、人物、offer、工具状态或核心任务;这个对象必须是首屏最大信号之一。Pro
验证 · 0Pro

装饰背景可读性

审计和实现纹理、图案、渐变、噪声、背景图和 ambient media,使其不损害文字可读性、语义、授权、性能和响应式布局。

适用场景:patterned background、texture overlay、gradient mesh、noise layer、hero backplate、CSS background image、背景图压住文字、低对比 surface;输入必须包含 surface 角色、背景类型、前景内容、素材来源、目标视口和是否有动效。Pro