调感觉
文本乱序
Text Scramble
「字先乱后定的效果」「黑客风文字动画」「解码字幕」「字符翻滚成文字」「科技感标题动效」
LIVE DEMO真实可交互，动手试试
Build with precision
- 英文名
- Text Scramble
- 别名 · 俗称
- 解码文字动效字符翻滚文字解锁动画Decode Effect
- Web 叫法
- Text Scramble / Decode Effect
- 大白话定义
- 文字先显示成一串乱字符，再逐步落定成真正内容，常用来做科技感标题动画。
- 部位拆解
- 目标文案 Target Text最终要显示出来的真实文字
- 随机字符 Noise过渡阶段快速变化的占位字符
- 收敛过程 Resolve字符逐个稳定下来，变成目标文案
提示词已按当前平台组织好，复制粘贴给 AI 即可
Web
给 hero 标题加 Text Scramble 动效：先快速显示随机字符，再在 0.8 秒内稳定成真实文案，停留后不再重复
调试 Prompt组件不听话时用——把症状补在末尾一起发给 AI
调试我的文本乱序（Text Scramble）。逐一排除：每一帧都重新生成全部字符，动画闪得太乱；动画结束后没有稳定停住，还在继续抖；服务端和客户端初始文本不一致导致 hydration 闪烁；用户偏好减少动效时没有降级成静态文本。症状是：