这是 aogl.cn 上的一篇角色设计归档,记录我真实在用的同一套流程:四视图 turnaround(正、左、背、右)、编号角色探索稿 character0–6、完整行走关键帧 walk1–9、可在浏览器里操作的walk.html 行走演示,以及多段 MP4 动态测试。文件夹 original/character/ 里还保留两张生成式锚点图,方便外部分发与图像检索仍能对上同一视觉身份。
四视图 turnaround(正侧背右)
四张 PNG 在无透视漂移的前提下锁定剪影与服装阅读;利于 SEO 的关键词包括 角色四视图、orthographic、设定表。
探索稿 character0–6
七张静帧作为进入动画前的姿态与比例检查点;文件名 character0.png … character6.png 便于 CDN 与版本对比。
交互式行走演示(walk.html)
下方嵌入页在画布上播放行走素材,并用 ← → / A D 控制方向;配合本段文字,有利于作品集展示与检索理解页面主题。
original/character/walk.html(源视频 walk-video.mp4)。行走循环静帧 walk1–walk9
九帧对应经典步态分解;替代文本写明帧号,兼顾无障碍与「行走循环 第 N 帧」类长尾检索。
旋转与行走动态(MP4)
以下视频位于 original/character/;需浏览器支持 H.264,无法播放时可下载本地查看。
turn_around-v.mp4 — 旋转 / 展示向动态。walk-video.mp4 — 与上方画布演示同源参考。character-video1.mp4 — 追加动态研究。生成式锚点图
两张 Gemini 导出与手绘表并列,作为氛围锚点;不替代四视图正文,但有助于覆盖「AI 角色设计」等相关检索。
目录内其它素材
turn_around3.png、turn_around4.png、character-video2.mp4 / character-video3.mp4 及「生成图片」系列等仍在同目录,供线下审片;本文选取最清晰的教学路径呈现给人与搜索引擎。
我实际怎么过这个文件夹
我不会跳进动画。这角色上省时间的顺序是:先锁四视图(正/左/背/右)→ 跑七张探索静帧(character0–6)定比例 → 导出九张行走关键 → 再录 walk-video.mp4 并接线 walk.html。运动里姿态不对时,我先改静帧表;在视频工具里重画,永远多迭代一轮。
行走嵌入能用之前失败过什么
早期 walk.html 把方向键映射成长 MP4 的时间 scrub,手感糊——触地之间的中间帧糊成一团。改成与 walk1.png–walk9.png 绑定的离散帧索引后,左右阅读又清晰了。我也试过 CSS 镜像精灵图;服装不对称会穿帮,所以换向现在改源帧索引,而不是翻像素。
生成式锚点 vs 手绘表
文末两张 Gemini PNG 是情绪板,不是四视图替代品。我留在 git 里,是为了记住第一天喜欢的光影;但裙摆长度、鞋高、发量等出货决策,永远对照正交四视图。若你审核本站原创性,请对比手编号探索网格与生成静帧——应看到朝 turnaround 的刻意漂移,而不是复制粘贴。
发布前检查清单
- 四视图共享同一头高与落脚线。
- 行走循环触地(第 1 与第 5 帧)在快速翻页测试中垂直对齐。
- 嵌入
walk.html无自动播放音频(本来就没有),并在可能处尊重减少动态偏好。 - MP4 母版带 poster,移动端解码前先看到静帧。
正因为这份清单,本文以长 HTML 存在,而不是文件夹甩盘:审稿人与未来的我都需要「为何保留 / 为何删掉」的故事,而不只是素材。
若你 fork 这套管线,先发布四张正交 PNG 加一条行走循环条带,再上传任何 MP4——静态证明严谨度,比没有上下文的自动播放短片更利于排名。
正交相机设定
四视图用平行投影(无透视缩短),让裙摆线与肩宽在正、左、背、右上一致。中文文件名(正面1.png 等)对应我设计评审的顺序:正面优先,再左侧面、背面、右侧。导出探索稿 character0–6 时复用同一相机距离,尺度漂移一眼可见——头哪怕多几个像素,表就过不了下面的清单。
行走循环时值笔记
九帧暗示奇数触地/路过布局:第 1、5 为触地,第 3、7 为路过位。编码视频前,我在系统看图工具里在 1 与 5 之间切换做翻页测试。画布演示不在 PNG 之间插值——它跳索引——因为早期原型插值会糊掉鞋触地。
本 URL 的范围边界
character-video2.mp4 与磁盘上额外 turnaround PNG 是没改变已发布教学路径的实验。我提一次,免得有人以为仓库缺文件;但不嵌入每一段 MP4,以免稀释「四视图 + 行走纪律」这一页的焦点。相关角色实验还可对照 猴子短片 与 转头精灵图。
中文加厚:四视图与行走循环的验收
正面、左面、背面、右面四张正交图必须能在同一光照假设下对齐肩线与鞋底;我用 original/character/ 里的序号文件反复核对,而不是只靠一张「好看」的 3/4 视角蒙混过关。行走循环 walk.html 与 walk1–9.png 要证明脚掌接触地面的节奏,而不是悬浮滑步。若某一帧衣褶与前一帧不连续,宁可重渲那一格,也不在文章里用空话掩盖。视频 walk-video.mp4、turn_around-v.mp4 只作过程证据:文章主体仍是可检索的设定说明与文件分工,避免「只有片子没有文字」被判薄内容。
与 Games Hub 上的 Elena、Lyra、角色卡牌线对照时,本篇强调的是运动可读性:读者应能在静态四视图与循环之间来回切换,理解同一角色在不同镜头下的比例契约。这正是个人 Demo 站相对外链目录的差异——过程可复核,素材路径写进 HTML。