1.5秒片尾设计Timeline Visualizer如何在视频结尾缩放展示完整路线【免费下载链接】google-timeline-visualizerVisualize your year in travel using your Google Location History (Timeline) data项目地址: https://gitcode.com/GitHub_Trending/go/google-timeline-visualizer你看过那种播放完旅行轨迹后镜头缓缓拉远、整条路线一帧铺满全屏的视频吗这正是Timeline Visualizer的核心设计——它把 Google 位置历史Timeline数据转成旅行视频并在最后 1.5 秒用一个精心调度的片尾镜头将整条路线缩放展示给视频一个漂亮的收尾。本文带你从产品视角拆解这 1.5 秒背后的实现逻辑即使你是新手也能看懂。片尾为什么是 1.5 秒先说结论片尾时长不是拍脑袋定的而是一个写死在动画模块里的常量。在 TimelineAnimation.kt 中可以看到两个关键数字OUTRO_SECONDS 1.5f整个片尾阶段共1.5 秒OUTRO_TRANSITION_SECONDS 1.0f真正的镜头缩放转场只用其中1.0 秒。为什么要多留 0.5 秒这是一个很妙的细节镜头在 1 秒内完成从局部路线到全局鸟瞰的缩放随后 0.5 秒保持在全景画面停驻让观众的视线有足够时间看清整条路线长什么样而不是刚拉到全景就黑屏结束。动效设计上这叫动作 停留是转场动画的经典节奏。一帧之内发生了什么进度如何切分每一帧画面都由一个TimelineFrame描述它有两个进度值见 TimelineAnimation.kt进度值含义取值范围journeyProgress主体行程进度0 → 1片尾期间恒为 1outroProgress片尾转场进度0 → 1仅最后 1.5 秒内变化切分逻辑在frameAtElapsedSeconds中TimelineAnimation.kt前段行程期journeyProgress随时间从 0 走到 1outroProgress保持 0最后 1.5 秒片尾期行程进度锁死在 1outroProgress用经过的片尾时间除以 1.0 秒转场时长算出缩放比例超过 1.0 秒后停留在 1。 也就是说视频选 30 秒实际跟拍只有 28.5 秒剩下的 1.5 秒全部留给片尾镜头。镜头缩放从跟拍视角混插到鸟瞰视角片尾的缩放本质上是两个镜头的混插核心代码在 TimelinePainter.kt 的viewport方法中镜头 A跟拍视角一路跟随当前位置的局部地图视野镜头 B鸟瞰视角由overviewViewport计算能框住整条路线的全局视野TimelinePainter.kt混插blendViewport按easeOutCubic(outroProgress)的缓动曲线把两个视野在缩放和位移上平滑过渡。easeOutCubic三次缓出让镜头先快后慢地拉远——开头缩放感强烈、收尾柔和定格观感非常自然。除了镜头本身片尾还在做两件事让画面讲完故事轨迹淡出跟拍时的彩色轨迹和移动标记透明度按1 - easeOutCubic(outroProgress)逐渐归零TimelinePainter.kt完整路线淡入与此同时一条覆盖全程0 → 总里程的总览路线以easeInOutCubic曲线渐显TimelinePainter.kt。一进一出画面完成了从我在哪到我去了哪的叙事切换。片尾也影响视频推荐时长你可能注意到导出时应用会推荐视频时长——这 1.5 秒同样被算进公式里。DurationRecommendation.kt 会先根据路线的移动工作量和缩放工作量估算行程所需秒数然后加上 1.5 秒片尾再向上取整到 5 秒的倍数。也就是说路线越复杂行程段越长但无论长短片尾永远稳定保留 1.5 秒保证每支视频都有完整的全景收尾。导出时如何高效渲染片尾帧真正导出 MP4 时Mp4Exporter.ktvideoFrameCounts按帧率把 1.5 秒换算成片尾帧数与行程帧数分开统计Mp4Exporter.kt鸟瞰层是一次性预渲染好的位图最大边长 1080 像素OVERVIEW_MAX_EDGE整个片尾期只做透明度混合不逐帧重绘地图Mp4Exporter.kt导出前的瓦片预下载也会把片尾帧和终态全景视野TimelineFrame(1f, 1f)一并纳入保证片尾缩放时地图瓦片不缺失Mp4Exporter.kt。小结设计点实现方式片尾总时长固定 1.5 秒OUTRO_SECONDS镜头缩放1.0 秒内 easeOutCubic 混插跟拍 → 鸟瞰视野收尾停驻最后 0.5 秒定格全景给观众阅读路线的时间叙事切换局部轨迹淡出 完整路线总览淡入性能保障鸟瞰层预渲染位图 片尾瓦片提前下载这正是 Timeline Visualizer 让每支旅行视频有始有终的秘密1.5 秒不长却把整段旅程压缩成一张可以一眼看全的地图。如果你想了解完整路线数据如何解析、时间轴如何计算可以进一步阅读 README.md 和 visualizer.py。【免费下载链接】google-timeline-visualizerVisualize your year in travel using your Google Location History (Timeline) data项目地址: https://gitcode.com/GitHub_Trending/go/google-timeline-visualizer创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 1.5秒片尾设计：Timeline Visualizer如何在视频结尾缩放展示完整路线
1.5秒片尾设计Timeline Visualizer如何在视频结尾缩放展示完整路线【免费下载链接】google-timeline-visualizerVisualize your year in travel using your Google Location History (Timeline) data项目地址: https://gitcode.com/GitHub_Trending/go/google-timeline-visualizer你看过那种播放完旅行轨迹后镜头缓缓拉远、整条路线一帧铺满全屏的视频吗这正是Timeline Visualizer的核心设计——它把 Google 位置历史Timeline数据转成旅行视频并在最后 1.5 秒用一个精心调度的片尾镜头将整条路线缩放展示给视频一个漂亮的收尾。本文带你从产品视角拆解这 1.5 秒背后的实现逻辑即使你是新手也能看懂。片尾为什么是 1.5 秒先说结论片尾时长不是拍脑袋定的而是一个写死在动画模块里的常量。在 TimelineAnimation.kt 中可以看到两个关键数字OUTRO_SECONDS 1.5f整个片尾阶段共1.5 秒OUTRO_TRANSITION_SECONDS 1.0f真正的镜头缩放转场只用其中1.0 秒。为什么要多留 0.5 秒这是一个很妙的细节镜头在 1 秒内完成从局部路线到全局鸟瞰的缩放随后 0.5 秒保持在全景画面停驻让观众的视线有足够时间看清整条路线长什么样而不是刚拉到全景就黑屏结束。动效设计上这叫动作 停留是转场动画的经典节奏。一帧之内发生了什么进度如何切分每一帧画面都由一个TimelineFrame描述它有两个进度值见 TimelineAnimation.kt进度值含义取值范围journeyProgress主体行程进度0 → 1片尾期间恒为 1outroProgress片尾转场进度0 → 1仅最后 1.5 秒内变化切分逻辑在frameAtElapsedSeconds中TimelineAnimation.kt前段行程期journeyProgress随时间从 0 走到 1outroProgress保持 0最后 1.5 秒片尾期行程进度锁死在 1outroProgress用经过的片尾时间除以 1.0 秒转场时长算出缩放比例超过 1.0 秒后停留在 1。 也就是说视频选 30 秒实际跟拍只有 28.5 秒剩下的 1.5 秒全部留给片尾镜头。镜头缩放从跟拍视角混插到鸟瞰视角片尾的缩放本质上是两个镜头的混插核心代码在 TimelinePainter.kt 的viewport方法中镜头 A跟拍视角一路跟随当前位置的局部地图视野镜头 B鸟瞰视角由overviewViewport计算能框住整条路线的全局视野TimelinePainter.kt混插blendViewport按easeOutCubic(outroProgress)的缓动曲线把两个视野在缩放和位移上平滑过渡。easeOutCubic三次缓出让镜头先快后慢地拉远——开头缩放感强烈、收尾柔和定格观感非常自然。除了镜头本身片尾还在做两件事让画面讲完故事轨迹淡出跟拍时的彩色轨迹和移动标记透明度按1 - easeOutCubic(outroProgress)逐渐归零TimelinePainter.kt完整路线淡入与此同时一条覆盖全程0 → 总里程的总览路线以easeInOutCubic曲线渐显TimelinePainter.kt。一进一出画面完成了从我在哪到我去了哪的叙事切换。片尾也影响视频推荐时长你可能注意到导出时应用会推荐视频时长——这 1.5 秒同样被算进公式里。DurationRecommendation.kt 会先根据路线的移动工作量和缩放工作量估算行程所需秒数然后加上 1.5 秒片尾再向上取整到 5 秒的倍数。也就是说路线越复杂行程段越长但无论长短片尾永远稳定保留 1.5 秒保证每支视频都有完整的全景收尾。导出时如何高效渲染片尾帧真正导出 MP4 时Mp4Exporter.ktvideoFrameCounts按帧率把 1.5 秒换算成片尾帧数与行程帧数分开统计Mp4Exporter.kt鸟瞰层是一次性预渲染好的位图最大边长 1080 像素OVERVIEW_MAX_EDGE整个片尾期只做透明度混合不逐帧重绘地图Mp4Exporter.kt导出前的瓦片预下载也会把片尾帧和终态全景视野TimelineFrame(1f, 1f)一并纳入保证片尾缩放时地图瓦片不缺失Mp4Exporter.kt。小结设计点实现方式片尾总时长固定 1.5 秒OUTRO_SECONDS镜头缩放1.0 秒内 easeOutCubic 混插跟拍 → 鸟瞰视野收尾停驻最后 0.5 秒定格全景给观众阅读路线的时间叙事切换局部轨迹淡出 完整路线总览淡入性能保障鸟瞰层预渲染位图 片尾瓦片提前下载这正是 Timeline Visualizer 让每支旅行视频有始有终的秘密1.5 秒不长却把整段旅程压缩成一张可以一眼看全的地图。如果你想了解完整路线数据如何解析、时间轴如何计算可以进一步阅读 README.md 和 visualizer.py。【免费下载链接】google-timeline-visualizerVisualize your year in travel using your Google Location History (Timeline) data项目地址: https://gitcode.com/GitHub_Trending/go/google-timeline-visualizer创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考