Skip to content
Charles Shao
Go back

广告视觉构图与动态创意:构图法则、视线引导与视频钩子

views

配色篇 解决”用什么颜色”,文案排版篇 解决”文字怎么读”,但在颜色和文字之前,用户的眼睛先要落在某个地方——这就是构图(composition) 的活儿:决定”第一眼看哪、视线接着往哪走”。本文把静态版面的构图法则和动态创意(视频)的节奏放在一起讲,补齐”视觉三件套”的最后一块。

这是 创意设计与合规系列 的第四篇,承接 心理学篇(注意力与视觉显著性)、配色文案排版,往后接 DCO 动态创意优化

TL;DR

Table of contents

Open Table of contents

1. 构图:先决定”第一眼看哪”

用户扫过一条广告的时间以毫秒计(呼应 心理学篇 的注意力稀缺)。构图的第一要务不是”排得好看”,而是制造一个明确的视觉重心,让眼睛知道”先看这里”。

构图示意:左侧一张 3:2 的广告框叠加三分法网格(两横两纵虚线,四个交点标记),主体圆放在右上交点、CTA 按钮放在右下交点,四周有一圈虚线安全边距;右侧列出四条构图法则——① 三分法:主体放交点别居正中、② 视觉重心:画面有明确的第一眼、③ 安全边距:关键信息离边缘留呼吸、④ 留白分组:间距表达谁和谁一组 构图先解决”第一眼看哪”:用三分法/重心把主体与 CTA 放到视线自然停留处,再用留白分组、边距留呼吸。

几条经得起用的构图法则:

底层原理:格式塔分组(Gestalt)。人脑会自动把视觉元素”归组”:靠得近的被看成一组(邻近性)、长得像的被看成一类(相似性)、不完整的轮廓会被自动补全(闭合性)、同一直线/曲线上的元素被视为相关(连续性)。这正是”留白分组、卡片化、对齐”之所以有效的心理学根据——与其画一堆分割线,不如用间距和对齐让”谁和谁一组”不言自明。构图的很多”手感”,本质都是在借用这套自动归组机制。

2. 视线引导:尺寸、位置、方向三把手

构图定了重心,还要引导视线沿一条路径流动:从主体,到卖点,到 CTA。这条路径不能靠碰运气,有三把可控的手:

视线引导三段流程:主体(最大/最亮,尺寸/明度制造焦点)→ 次要信息(中等权重,层级递减别抢戏)→ CTA(对比出口,放在动线终点),三块用『视线先落』『再扫到』标注箭头连接 引导视线的三把手:尺寸对比、位置、方向线索;让主体→次要→CTA 形成一条”看得顺”的路径。

别让画面”平”:如果所有元素权重相同,用户就没有”先看哪”的线索,只能自己找——这会增加认知负荷、拉低点击。构图的价值就是替用户做好这道排序题。

3. 动态创意:前 3 秒定生死

视频/动态创意多了一个静态创意没有的维度——时间。而在信息流里,时间的前 3 秒几乎决定一切。

视频节奏时间轴:一条横向时间条分三段——0–3s 钩子(反差/利益/悬念,抓住不划走)、3–15s 展开(一个核心卖点+场景/证据)、结尾 CTA(品牌露出+明确行动),下方一条时间轴从 0s 指向『时间』 移动端信息流默认静音自动播放:字幕要能”无声看懂”,前 3 秒把最强钩子和品牌线索前置。

4. 三方视角看视觉

视觉是最容易”用力过猛”的地方:越抢眼越可能打断体验、越花哨越可能掩盖信息。用 心理学篇 §1 的三方视角 对齐一下:

角色在乎什么视觉/构图诉求常见冲突
广告主抢注意、拿点击强焦点、动效抓眼、品牌前置冲动是”越吵越好”→ 打断体验、被跳过/屏蔽
媒体 / 平台浏览体验、可识别广告不破坏 feed 节奏、能清晰标注伪装成内容、闪烁诱导 → 拉低平台信任
用户一眼看懂、不被打扰重心清晰、动效克制、能判断”这是广告”突兀弹跳/诱导点击 → 反感与误触

5. 常见误解 ↔ 正解

常见误解正解
主体放正中最稳三分法交点更有张力、更贴合视线落点;居中只在需要对称/庄重时用
画面塞满才不浪费留白负责分组与呼吸,塞满=没有重心=认知过载
元素都做大才显眼都大=都不显眼;靠对比,主体大、其余主动弱化
动效越多越吸睛动效为信息服务,过度动画抬高认知负荷、拉低完播
视频片头先放品牌片花前 3 秒给钩子,品牌线索前置但别占满开头
视频配好音效就行信息流默认静音,先保证”无声看懂”再谈声音
一套素材通投所有版位按 1:1/4:5/9:16 适配,主体避开各端安全区

6. 收尾:版位安全区与时长速查

构图的第一敌人往往不是审美,而是被平台裁掉。下面是一份可直接对照的经验基准——比例、安全区、时长因平台与版本而异,以各平台官方创意规范为准,此处只给量级:

场景 / 版位推荐比例安全区要点时长基准
信息流竖屏视频9:16上下各留 ~10–15% 给 UI(头像/文案/按钮),主体与字幕居中前 3 秒钩子,整体常 ≤ 15–30s
信息流方图 / 竖图1:1 / 4:5关键信息居中,避开四角与底部标题条
Stories / 全屏9:16顶部让位进度条、底部留给 CTA单卡 ≤ 15s
横版视频16:9下三分之一避开字幕 / 播放条6s bumper 或 15–30s
展示横幅因位而异logo 与 CTA 不贴边,留描边保证任意底色可读

一次设计、多比例导出:把核心元素放进最窄版位(9:16)的安全区,外围留可裁空间;别把 16:9 硬塞进竖屏,主体一定被切。

构图和动效把 配色文案 组织成”用户第一眼就看得顺”的整体。而当一套素材要规模化、千人千面地投出去时,就轮到把这些要素拆开、按信号实时拼装的 DCO 动态创意优化 了。

参考文献 / 延伸阅读


创意设计与合规系列 · 建议按序阅读

  1. 用户心理学与行为哲学——懂人
  2. 创意配色——用色
  3. 文案与排版——用字
  4. 视觉构图与动态创意(本篇)——构图与动
  5. DCO 动态创意优化与创意疲劳——规模化
  6. 创意 A/B 测试与有效性度量——用数据验证
  7. 地区政策与合规——守边界

完整阅读路径见系列页


views
Share this post on:

Previous Post
推荐系统召回总览:漏斗定位、8 大召回家族、Recall@K / Coverage 与 SSB 铁律
Next Post
广告文案与排版:信息层级、阅读动线与可读性