核心 SVG 组件 + 效果 + 案例 + 适用场景
1. 滑动类（强视觉、叙事感）
- 倾斜错层滑动（倾斜盒子）
- 效果：错层滑动 + 3D 倾斜布局，跑道穿越感
- 案例：《致：你我他！》（政务媒体，青年运动员奔跑）
- 教程：《黑科技编辑器｜倾斜错层滑动（倾斜盒子）》
- 错层滑动
- 效果：固定 IP 角色长卷穿梭 + 弹窗讲述
- 案例：《今天，一群清华青年给出答案》（五四精神传承）
- 特点：新手友好，适配人物故事 / 精神传承
- 纵向滑动 + 点击伸长
- 效果：滑动到底→点击→继续延展新画幅
- 案例：《无线青年》
- 组合：可搭配逆向擦出伸长等模板
- 横向视差滑动（3D 视差）
- 效果：perspective 裸眼 3D，横版长漫画张力
- 案例：《MG 青年集结！带着热爱，潮前突破！》
- 用法：版块化拼接 / 结合视差卡片自由布局
2. 伸长类（情感递进、信息展开）
- 层层自动伸长
- 效果：连续文案自动递进，情绪拉满
- 案例：《这可能是今天全国青年最想听到的祝福》《什么是青春？》
- 操作：切片依次传入，便捷易出效果
- 多重点击伸长
- 效果：多动画并列平铺 / 伸长套伸长层级叠加
- 案例：《让一下，今天 06 出色青年上场》（车主访谈，共鸣品牌价值）
- 教程：《伸长套伸长 SVG 教程》（需正确计算参数）
3. 视差类（裸眼 3D、品牌高级感）
- 视差滑动（视差卡片）
- 效果：裸眼 3D 立体画廊，自然 / 城市场景
- 案例：《年轻人，今天来「甘」一下》（品牌正能量）
- 教程：纵向视差卡片 / 绝对尺寸框架教程
4. 互动选择类（福利、测试、年轻化）
- 无限选择器（原创 UGC）
- 效果：无限滚动选择，趣味互动、走运 / 测试类
- 案例：《文末福利 | 我们搞到了当代年轻人的走运秘籍！》
- 学习：Ceep 老师专题视频，新手友好
- 旋转式切换（UGC 原创 @三千喵）
- 效果：分层旋转切换，灵动细腻
- 案例：《青春，是什么？》
- 复用：五一 / 五四双节日通用
5. 热区弹窗类（信息折叠、自由交互）
- 多热区无限切换 - 关闭
- 效果：自由卡片弹窗，长内容轻量化
- 案例：《健全乡村治理体系 今年这么干！》
- 同类组件：多热区弹出式海报 / 按钮激活 / 无限浮现 - 关闭 / 限时可见 / 视频号跳转
6. 简洁高级类（大气海报、运动主题）
- 点击渐现
- 效果：简洁大方，逐帧浮现海报
- 案例：《青 年 立 志》
- 延伸：可做差速立体竞技海报（奥运 / 运动主题）
