AI DESIGNER / CREATIVE TECHNOLOGIST
AI 搞定视觉作品集
从虚拟人 Hero 海报和循环视频，到时间轴角色、手电筒交互素材与 Codex 前端落地。
完整教程
这篇教程先用虚拟人 IP 制作强视觉 Hero 海报和可循环视频，再生成页面参考、时间轴人物、手电筒光圈与行走视频等交互素材，最后把完整素材和交互规则交给 Codex，落地成真实可用的视觉作品集网站。
1.1 准备虚拟人并生成 Hero 海报
先细化虚拟人物的皮肤与五官质感，再以同一人物为主体生成强视觉 Hero 静态图。
在 LiblibAI 中准备一个虚拟人 IP，先用人像质感调节处理肤质纹理等细节，降低明显的 AI 感。
选中人物，拖动加号并选择图片生成节点，输入视觉方向，让同一人物成为作品集 Hero 的核心视觉。
完整提示词
强视觉 Hero 海报
根据这个人 {{Image 1}} 生成一个高级风格的海报，要求视觉感比较强。
1.1 制作可循环 Hero 视频
用静态 Hero 生成只有人物轻微动作的循环视频，保持镜头不推进、首尾帧一致，再用片段重拍和局部画笔修正问题。
把静态 Hero 图连接到视频节点，要求人物只有轻微晃动、自然眨眼，整体构图和镜头保持不变。
局部不满意时不需要重抽整条视频，可以选中对应片段进行重拍；也可以在画面编辑中使用主体修改画笔，涂抹区域后通过对话精准修改。
操作步骤
- 从静态 Hero 图添加视频节点。
- 约束镜头、人物动作、循环首尾帧和 AI 伪影。
- 用片段重拍替换问题区间。
- 用主体修改画笔修正局部画面。
完整提示词
Hero 循环视频
人物在中间轻微晃动，正常睁眼闭眼，视频循环。
开始帧和结束帧要保持一致，不要明显的 AI 伪影；整体镜头不要推进，而是保持同一画面，只有画面中的人物在动。
1.2 生成作品集页面和时间轴人物
让 Hero 的视觉语言延伸到完整作品集页面，再针对时间轴单独生成人物动作和表情素材。
选择 Hero 图作为风格参考，说明页面需要包含个人介绍、工作经历时间轴和作品展示等内容，先生成完整长页面方向。
时间轴如果有更明确的想法，可以单独生成人物动作，再使用情绪调节修改表情，让姿势与情绪更贴合。
继续生成手指滑动视频，把人物动作放到长图的时间轴区域，让时间经历不只是静态文字。
完整提示词
视觉作品集页面
根据 {{Image 1}} 的设计风格，{{Image 2}} 为主要人物，生成一个设计师的作品集页面，包括个人介绍、工作经历时间轴、作品展示等内容。
1.3 制作手电筒与行走视频素材
把鼠标光圈和时间轴人物做成独立素材，后续由前端交互触发，而不是直接烘焙在页面截图里。
先生成银黑配色、具有 Blender 3D 游戏道具质感的手电筒，作为 Hero 区域的自定义鼠标。
再生成同一人物的侧面全身照，并把它转换成镜头固定、首尾帧一致的侧面行走循环视频，用于时间轴节点之间的移动。
完整提示词
手电筒素材
生成一个银色和黑色配色的手电筒，45 度角、纯色背景，手电筒照向后方而不是镜头；使用 Blender 3D 建模质感，酷帅、具有游戏道具感，不是真实世界中的普通产品，但要能一眼看出是手电筒。
侧面行走视频
生成一个侧面走路的视频，镜头固定不动，首尾帧保持一致，可以循环播放，禁止 AI 伪影。
2.1 用 Codex 落地可交互作品集
把页面参考、Hero 视频、滑动视频、手电筒和人物行走素材一次交给 Codex，并把鼠标、滚动和时间轴的触发规则写清楚。
把所有素材放进 Codex，明确每个素材出现的位置，以及鼠标移动和滚动分别触发什么效果，再通过多轮对话调整排版与交互细节。
最终页面必须是真实可用的前端，而不是把参考截图直接放上去；作品展示中暂缺的插图可以先补充占位，后续再替换为真实作品。
网站完成后，可以继续参考教程中的上线流程发布作品集。
完整提示词
作品集页面实现
根据我发给你的素材做一个作品集网站，图片是作品集参考。首先是 Hero 页面：两个 Hero 优先展示黑底，鼠标悬浮后，周围出现一圈虚化范围显示蓝底 Hero，视频循环播放。
把滑动视频放在第二屏。鼠标滚轮在时间轴范围内滚动一次，滑动视频就循环一次，对应的时间坐标轴向左移动一个时间节点。
生成一个可交互、真实可用的前端页面，而不是把截图放上去。严格参考提供的图片，每屏使用 16:9 比例，第一屏不需要受参考图比例限制。第三屏作品展示中缺少的插图可以先补充，后续再替换对应作品图片。
替换 Hero 鼠标
把 Hero 区的鼠标替换成这个手电筒，去掉背景后放上去。
时间轴行走人物
这个视频的 2–5 秒循环，放在时间轴对应节点上；每滑动一次，就让人物从一个节点走到下一个节点。使用叠加模式去掉背景，人物可以缩小一些。
关键方法
- 先把人物质感和视觉基线稳定下来，再扩展页面
- 循环视频需要同时约束镜头、动作和首尾帧
- 人物动作要服务时间轴叙事，而不是单独炫技
- 交互素材应独立生成，留给前端按状态触发
- 向 Codex 同时说明素材位置、触发条件和真实前端要求
作者与发布
本文由宋夏天Dazzle 创作，收录于公众号「送你整个夏天」的 2026 教程档案。