官方一句话：“A completely new alternative for motion designers who find Adobe Animate and Google Web Designer too cumbersome for creating web animations.”（一个全新的替代方案，给那些觉得 Adobe Animate 和 Google Web Designer 做网页动画太折腾的动效设计师。）
官方副标题：Create lightweight webbanners with ease powered by Anime.js.（借 Anime.js 之力，轻松做出轻量网页 Banner。）官方页大标题：Export your AE compositions as animated HTML5 banners.（把你的 AE 合成导出成动画 HTML5 Banner。）
官方强调的三个卖点：
✅ You stay in After Effects, with the timeline you’re familiar with. No learning of separate editors and no AE plugin gaps where unsupported AE features silently break on export.
（你留在 After Effects 里，用你熟悉的时间线。不用学另一个编辑器，也不会有 AE 插件那种「不支持的 AE 功能在导出时静默出错」的坑。）✅ No large proprietary player library or separate WASM runtime on top of your animation. AE Banner Bridge delivers plain HTML/CSS/JS with just a ~18 KB Javascript library that you can even bundle. With optimised images, this keeps you within the ad networks’ ~150 KB limit.
（你的动画之上不需要庞大的私有播放器库或独立 WASM 运行时。AE Banner Bridge 产出的是纯 HTML/CSS/JS，只带一个约 18 KB 的 JS 库，而且可以直接打包进去。图片优化后，整体能压在广告联盟约 150 KB 的限制内。）✅ Real DOM text. Text does not have to be rendered into a canvas or turned into vector shapes.
（真正的 DOM 文字。文字不必渲染进 canvas，也不必转成矢量形状。）
一、面板：9 个标签页
脚本帮助文本说「面板功能分成 9 个不同的标签页，每个标签页有配色，你始终能知道自己在哪」。9 个标签页（官方英文名）：
| 标签 | 作用（官方描述） |
|---|---|
| Comp Setup | 选尺寸预设、填帧率与时长，一键生成标准 Banner 合成 |
| Anime Sets | 把 Anime.js 标准 easing 曲线应用到关键帧 |
| Anime Text | 用预设做 DOM 文字动画 |
| Anime Pro | 自定义贝塞尔曲线、物理模拟或 Steps |
| CSS Filters | 把 AE 效果转成 CSS 滤镜（模糊、渐变、色相/饱和度、投影） |
| Interaction | 标记图层做交互动作（ClickTag、Hover） |
| SVG | 把文字/矢量图层转 SVG 导出，含 Illustrator 图层转 SVG |
| Timeline | 在中性图层上打时间线动作标记（IN / OUT / Stop / Loop） |
| Publish | 选库选项，导出最终 Banner |
二、16 种 Banner 尺寸预设
官方内置的 bannerSizes（从代码里逐条读出）：
| 尺寸 | 名称 |
|---|---|
| 1080×1080 | Social Square |
| 1080×1920 | Social Story / Reel |
| 1200×628 | Social Landscape |
| 1080×1350 | Social Portrait |
| 1280×720 | YouTube Thumbnail |
| 300×250 | Medium Rectangle |
| 336×280 | Large Rectangle |
| 728×90 | Leaderboard |
| 970×90 | Large Leaderboard |
| 160×600 | Wide Skyscraper |
| 300×600 | Half Page |
| 970×250 | Billboard |
| 320×50 | Mobile Leaderboard |
| 320×480 | Mobile Interstitial |
| 580×400 | Netboard |
| 300×1050 | Portrait Display |
三、导出的是什么
代码里能看出的导出结构：
- 单个
index.html，<head>带<meta name="ad.size" content="width=W,height=H">（广告联盟标准尺寸标记） css/style.css（生成的整套样式，含.layer/.filter-wrapper/.mask-container/.text-layer/.clickable/.hover-layer）js/script.js（anime.js 时间线：tl.seek(0)→requestAnimationFrame两帧 →banner.classList.add('ready')→tl.play()，另有scaleBanner()监听 resize 自适应）- anime.js 3.2.1：可选 CDN 链接（jsdelivr / cdnjs）或本地打包（随包
anime.min.js，约 18 KB） - 文字是真 DOM：
.text-layer { white-space: pre; line-height: 1.2; -webkit-font-smoothing: antialiased; } - 图层转成绝对定位的 div，
will-change: transform，clip-path: inset(0)做#clip-frame隔离 - 支持 1px 边框（
box-sizing: border-box; border: 1px solid #cccccc，官方说明「部分广告联盟要求，box-sizing 保证 ad.size 精确」） - 支持 Responsive（Scale-to-Fit）：包一层
#resp-wrapper，JS 按窗口尺寸Math.min(innerWidth/W, innerHeight/H)缩放 - 支持 Font Embedding：把
@import或font-faceCSS 塞进 HTML head - 支持 clickTag：默认 URL 作为预览 fallback，Make whole banner clickable 把整个 creative 包成一个
window.clickTagexit，Open link in new tab 加target="_blank" - 支持 Initial-load size check：设 KB 预算（官方提示「联盟不一，常见 150–200 KB」），超了在报告里给提示；官方说明这个估算是保守的——所有 asset 都算 initial load
四、15 个 anime.js 文字动画预设
AE Banner Bridge Content/animeJS_ffx/ 下共 15 个预设，分 letters / words / lines 三层粒度：
| # | 文件 |
|---|---|
| 01 | 01_animeJS_letters_x_position.ffx |
| 02 | 02_animeJS_letters_y_position.ffx |
| 03 | 03_animeJS_letters_scale_1.ffx |
| 04 | 04_animeJS_letters_scale_2.ffx |
| 05 | 05_animeJS_letters_rotate.ffx |
| 06 | 06_animeJS_letters_fade.ffx |
| 07 | 07_animeJS_letters_typewriter.ffx |
| 08 | 08_animeJS_words_x_position.ffx |
| 09 | 09_animeJS_words_y_position.ffx |
| 10 | 10_animeJS_words_scale_1.ffx |
| 11 | 11_animeJS_words_scale_2.ffx |
| 12 | 12_animeJS_lines_x_position.ffx |
| 13 | 13_animeJS_lines_y_position.ffx |
| 14 | 14_animeJS_lines_scale_1.ffx |
| 15 | 15_animeJS_lines_scale_2.ffx |
（letters = 单字符，words = 词，lines = 行；x_position / y_position / scale_1 / scale_2 / rotate / fade / typewriter 七种运动。）
五、Anime Pro 的物理与曲线控件
从代码里读出的控件（含 tooltip）：
- Elastic：Amplitude / Period
- Spring：Mass / Stiffness / Damping / Initial Velocity
- Cubic Bezier (0-1)：X1 / X2 / Y1 / Y2
- Steps：步数（默认 5）
- 预设 easing 名：NATURAL / BOUNCE / IMPACT / OVERSHOOT / TIMELAPSE
- Ease 方向可选 In / Out / InOut
六、Timeline 与 Text Bridge
Timeline 标签在中性图层上打标记：IN（anime_txt_IN）、OUT（anime_txt_OUT）、Stop、Loop Count。另有 Annotation（给图层贴开发者备注）与 Trig（分配唯一 ID）。
Text Bridge（Anime Text 标签）会在文字图层上挂一套组件，用 .ffx 预设 + 文字 Rig 初始化（Apply Rig），支持：
Clip to Textbox—— 字母动画超出文本框时隐藏Set IN/Set OUT—— 在当前时间打anime_txt_IN/anime_txt_OUT标记Reset Selection—— 从图层移除全部 Text Bridge 组件- 特殊字体粗细：给文字图层打标记，写
Font: Family, Weight（例Roboto, 700）
七、SVG 与 Illustrator
Convert Shape to SVG—— 形状图层转 SVGConvert Text to SVG shapes—— 文字转 SVG 形状Convert Illustrator layer to SVG—— 用 BridgeTalk 调 Illustrator 转- 官方提醒：
.ai/.eps文件浏览器显示不了，要用 SVG 标签页的 Illustrator to SVG；批量模式下 BridgeTalk 转换会被跳过以保证稳定
八、多语言
脚本内置 6 种语言界面：de（德语）/ en（英语）/ es（西班牙语）/ fr（法语）/ it（意大利语）/ pt（葡萄牙语）。随包 PDF 手册目前是 manual_en.pdf（英文）。
安装：AE Banner Bridge.manifest 内容为 {"AE Banner Bridge.jsxbin": "ADOBE-SCRIPT_UI-AE", "AE Banner Bridge Content/": "ADOBE-SCRIPT_UI-AE"}，即把 AE Banner Bridge.jsxbin 与 AE Banner Bridge Content/ 一起放进 AE 的 ScriptUI Panels 目录（Windows C:Program FilesAdobeAdobe After Effects <版本>Support FilesScriptsScriptUI Panels，macOS /Applications/Adobe After Effects <版本>/Scripts/ScriptUI Panels），重启 AE 后从 Window 菜单打开 AE Banner Bridge。
内容文件夹缺失时：脚本会弹 AE Banner Bridge: The 'ae_banner_bridge_content' folder could not be found. Please select it in the next dialog. 并让你手动选 ae_banner_bridge_content 文件夹（本包已按 manifest 的结构放好，正常不会触发）。
试用版限制（从代码读出）：Trial version: batch export is disabled. Only the first selected composition will be exported. Exported banners also include a trial watermark. Please purchase a license to unlock full output.（试用版：批量导出被禁用，只会导出第一个选中的合成；导出的 Banner 还会带试用水印。请购买授权解锁完整输出。）试用水印 HTML 为 <div class="abb-ovl"><span class="abb-ovl-t">AE Banner Bridge Trial Version 1.0.0.0</span><span class="abb-ovl-s">In Trial We Trust.</span></div>。
版本核对：本包版本 1.0.0.0（manifest 与 scriptVersion 一致，psdly 标题 V1.0.0.0 与包内一致）。
价格与授权：官方价格 $59.00（Single User License；另有 Floating Server License 需另购）；官方提供 FREE TRIAL。官方来源 aescripts.com/ae-banner-bridge/，作者 Look and Feel；产品 SKU THAABBR，内部号 31132555。
官方标签：Batch Processing / Automatic / Export / Utility / Animation Library / Utilities / Collect Files / Animation Libraries / Optimization / Conversion / JSON / Extension / Browser / SVG / Social Media。
本夸克目录内容：AE Banner Bridge.jsxbin（面板本体）、AE Banner Bridge.manifest、AE Banner Bridge Content/anime.min.js（anime.js 3.2.1）、AE Banner Bridge Content/animeJS_ffx/（15 个文字动画预设）、AE Banner Bridge Content/manual_en.pdf（官方英文手册）、cover.png、README.md。共 21 个文件 / 4407691 字节，与本地逐字节一致。
参数来源说明：9 个标签页名、按钮与复选框文案、tooltip 全文、16 种尺寸表、6 种语言、试用限制、导出 HTML/CSS/JS 结构、clickTag 与 ad.size 标记、15 个 ffx 预设名，均来自解包后的 AE Banner Bridge.jsxbin 明文（用 Jsxer 反编译 JSXBIN 2.0）；官方描述、三个卖点、价格 $59.00、FREE TRIAL、作者 Look and Feel、官方标签，均来自 aescripts 官方页。非推测。
原产品页：https://aescripts.com/ae-banner-bridge/
封面图片来自作者官方产品页。本文为中文整理，功能与兼容性信息以作者官方页面与包内说明为准。资源仅供学习交流，商业使用请购买正版授权。
暂无评论内容