触发方式
默认复用站内六张原创黑白几何图。左右拖动或用方向键切换卡片，Home/End 到首尾。图片每行一张；宽高改变卡片，侧移按百分比、旋转按角度、纵深按像素调节。默认图片序号从 0 开始；自动轮播间隔使用毫秒。目录悬停、聚焦和手机 Preview 共用演示，标题进入编辑器。
参数与内容
图片地址（每行一张）: [长内容见控件，2387 characters]；默认图片: 0；图片圆角: 24；画布背景: "#f5f4f3"；循环切换: true；自动轮播: false；轮播间隔（毫秒）: 1000；显示左右按钮: false；卡片宽度: 260；卡片高度: 330；堆叠侧移（%）: 8；每层旋转角度: 2；每层纵深: 100；显示分页圆点: false
起点与终点
初始画面使用以上保存内容。逻辑画布 900 × 600，整体缩放 1，位置偏移 (0, 0)。
时序
响应基准 300 ms，演示延迟 0 ms。观察倍速仅用于预览。
进入与退出
拖拽站内几何图片卡片，后方卡片以旋转和纵深堆叠，松手吸附到上一张或下一张。 演示停止后保留组件的当前交互状态。
重复操作与打断
离开目录且失焦、滚出可视区和切换后台会停止演示。实际输入、当前选择与播放进度不覆盖保存的默认值。
参数与导出
控件、预览、JSON、Motion 适配器、复刻工程和 HTML 导出共用同一设置对象与渲染器。目录卡片始终显示项目默认预设。
减少动态效果
不自动演示，过渡直接呈现目标状态；保留真实输入、按钮、选择和键盘操作。
默认配置
这些数值来自当前维护的默认配置；编辑器草稿和调整后的导出可以不同。
{
"schemaVersion": 2,
"recipeId": "skiper-48",
"durationMs": 300,
"delayMs": 0,
"easing": [
0.22,
1,
0.36,
1
],
"offsetX": 0,
"offsetY": 0,
"scale": 1,
"loop": false,
"interruption": "retarget",
"tracks": [],
"skiper": {
"images": "data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20640%20640%22%3E%3Crect%20width%3D%22640%22%20height%3D%22640%22%20fill%3D%22%23ffffff%22%2F%3E%3Ccircle%20cx%3D%22320%22%20cy%3D%22320%22%20r%3D%22176%22%20fill%3D%22%23929292%22%2F%3E%3C%2Fsvg%3E%0A\ndata:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20640%20640%22%3E%3Crect%20width%3D%22640%22%20height%3D%22640%22%20fill%3D%22%23f7f7f7%22%2F%3E%3Ccircle%20cx%3D%22320%22%20cy%3D%22320%22%20r%3D%22158%22%20fill%3D%22none%22%20stroke%3D%22%23a0a0a0%22%20stroke-width%3D%2264%22%2F%3E%3Crect%20x%3D%22434%22%20y%3D%22116%22%20width%3D%2258%22%20height%3D%2258%22%20fill%3D%22%23dedede%22%2F%3E%3C%2Fsvg%3E%0A\ndata:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20640%20640%22%3E%3Crect%20width%3D%22640%22%20height%3D%22640%22%20fill%3D%22%23ffffff%22%2F%3E%3Cpath%20d%3D%22M144%20308a176%20176%200%200%201%20352%200Z%22%20fill%3D%22%23929292%22%2F%3E%3Cpath%20d%3D%22M144%20332a176%20176%200%200%200%20352%200Z%22%20fill%3D%22%23cccccc%22%2F%3E%3C%2Fsvg%3E%0A\ndata:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20640%20640%22%3E%3Crect%20width%3D%22640%22%20height%3D%22640%22%20fill%3D%22%23ffffff%22%2F%3E%3Crect%20x%3D%22144%22%20y%3D%22144%22%20width%3D%22256%22%20height%3D%22256%22%20fill%3D%22%23dedede%22%2F%3E%3Crect%20x%3D%22264%22%20y%3D%22264%22%20width%3D%22232%22%20height%3D%22232%22%20fill%3D%22%23929292%22%2F%3E%3C%2Fsvg%3E%0A\ndata:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20640%20640%22%3E%3Crect%20width%3D%22640%22%20height%3D%22640%22%20fill%3D%22%23f7f7f7%22%2F%3E%3Cpath%20d%3D%22m320%20128%20200%20352H120Z%22%20fill%3D%22%23a0a0a0%22%2F%3E%3Cpath%20d%3D%22m320%20252%2092%20162H228Z%22%20fill%3D%22%23ffffff%22%2F%3E%3C%2Fsvg%3E%0A\ndata:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20640%20640%22%3E%3Crect%20width%3D%22640%22%20height%3D%22640%22%20fill%3D%22%23ffffff%22%2F%3E%3Cpath%20d%3D%22M144%20184h352M144%20368h352%22%20stroke%3D%22%23929292%22%20stroke-width%3D%2240%22%2F%3E%3Cpath%20d%3D%22M144%20276h352M144%20460h352%22%20stroke%3D%22%23cccccc%22%20stroke-width%3D%2240%22%2F%3E%3C%2Fsvg%3E%0A",
"selectedIndex": 0,
"cardWidth": 260,
"cardHeight": 330,
"radius": 24,
"offset": 8,
"rotation": 2,
"depth": 100,
"background": "#f5f4f3",
"loop": true,
"autoplay": false,
"interval": 1000,
"showNavigation": false,
"showPagination": false
}
}参考来源与复用
此效果参考 Skiper UI；可用的公开源码已经核对，Pro 项目依据公开演示独立实现。可在编辑器导出当前配置与可运行渲染器，复用时保留 Skiper UI 署名及素材来源。
用于自己的项目
进入编辑器运行真实预览并比较调整；本说明页不另造一份近似演示。把导出用于自己的项目后，重新检查内容、输入、焦点与布局。
目录来源标注：Skiper UI. 第三方示例保留自己的许可与署名；公开仓库包含全部当前动效的渲染源码；完整编辑器由独立工程维护。