80 lines
5.9 KiB
Markdown
80 lines
5.9 KiB
Markdown
# Warframe 饱满主题发现
|
||
|
||
## 用户参考主题的共同规律
|
||
|
||
- 主视觉是经过抠图/扩景后融入横幅的单一角色场景，不是矩形海报或多图拼贴。
|
||
- 侧栏、标题、装饰、功能入口和输入区重复同一套图形母题，主题覆盖整页而非只覆盖空状态。
|
||
- 页面“饱满”来自有用信息、插画细节和边角装饰共同填充空间，不是增加无意义卡片。
|
||
- 输入区始终是最明显的行动终点；参考图中的功能入口只用于判断页面密度，不复制到 cc-web。
|
||
- 色彩通常只有一个主色系和一个强调色，丰富度来自材质、插画和层级，不来自多色竞争。
|
||
|
||
## 本轮 Warframe 对应方式
|
||
|
||
- 原始荒野角色作为唯一主角；使用扩图生成横向场景，左侧保留稳定文字区，角色位于右侧。
|
||
- The Sacrifice 只贡献暗青黑材质与纵向暗金纹样；冷蓝近景只贡献能量青边光；赤红群像
|
||
只贡献低面积夕阳橙，不把三张参考海报直接摆进欢迎页。
|
||
- 侧栏与输入区使用同一套 Orokin 圆弧、细金属线和少量能量青；聊天区只保留这些母题的
|
||
低强度版本，优先保证阅读。
|
||
- 用户明确要求主题不能改动交互或输入内容；不得实现快捷入口、预设提示词或点击填充逻辑。
|
||
|
||
## 三张参考截图的空间规律
|
||
|
||
- 主内容区首屏几乎没有无职责空白：横向主视觉约占内容宽度 100%、高度 38%–48%，其下
|
||
立即衔接 3–4 个功能入口，底部是宽输入区。
|
||
- 角色不是放在独立图片框里，而是经过扩景或抠图后与横幅背景融合，轮廓会越过背景纹样，
|
||
但不会压住左侧标题安全区。
|
||
- 侧栏信息密度约占全页 20%：品牌、主动作、分组、项目/任务、底部状态都有清晰层级；
|
||
饱满感的一部分来自真实导航内容，而不是纯装饰。
|
||
- 每套皮肤都重复一个小型图形词汇：ENFP 的手绘闪电/星星、财神的云纹/金币、千玺的
|
||
折纸/植物线稿；这些母题同时出现在横幅、功能入口、输入区和边角。
|
||
- 本轮对应母题限定为 Orokin 弧线、暗金日轮、冷青能量节点和少量焦土叶片，避免再次
|
||
依赖通用科幻切角制造主题感。
|
||
|
||
## Warframe 源图生成约束
|
||
|
||
- 主图的有效身份是黑金角色、向左飘动的披风、右手武器和焦土橙荒野；原画四角孔洞与
|
||
锈蚀海报边框属于载体，不应被扩图复制到横幅中。
|
||
- 横幅需要把主角移到右侧约 58%–82% 区域，完整保留头部、胸甲、披风和武器；左侧约
|
||
38% 必须扩展为低细节的暗色天空/荒地，作为 HTML 文案安全区。
|
||
- Sacrifice 图的价值是暗青黑金材质、日轮/中轴和精密雕纹；其底部 `WARFRAME` 文字与
|
||
群像角色都不能进入生成结果。
|
||
- 冷蓝近景只提供轮廓边缘的冷青能量光，赤红群像只提供远处低面积落日橙；禁止生成
|
||
额外人物、海报标题、UI 面板或多图分区。
|
||
|
||
## 工具降级后的主视觉方法
|
||
|
||
- 三条 GPT Image CLI 获取路径均失败，当前会话也没有 built-in `image_gen`；不再把生成工具
|
||
作为交付前置条件，也不伪造生成资产。
|
||
- 原图的暖灰天空本身具有稳定负空间，可通过右侧裁切、边缘 mask 与同色背景扩展形成横幅；
|
||
这属于重新构图而不是把整张海报放进矩形框。
|
||
- 其他三张画作只保留在素材目录，不进入 DOM；从根源上避免风格冲突和多海报拼贴。
|
||
|
||
## 色彩方向修正
|
||
|
||
- 三张完成度参考都是明亮暖色整页皮肤，原始 Warframe 图同样以旧纸灰、沙金、焦土橙和
|
||
深炭角色为主；上一版大面积黑色既制造空洞，也违背图片本身。
|
||
- 新主题改为暖象牙/旧纸灰主表面、深炭文字、暗金/焦土铜骨架，冷青只用于小面积能量节点；
|
||
丰富度来自图片、纹样、原有功能层级和侧栏内容，而不是深色渐变、发光或新增功能。
|
||
|
||
## 纯视觉版首轮截图结论
|
||
|
||
- 1440×900 首轮中主标题、说明、侧栏和输入区对比清晰，原图已通过左侧渐隐与纸张纹样融入，
|
||
不再是四图拼贴或独立海报卡片。
|
||
- Hero 仍偏矮，主工作区上下各留下较多空白；需要把桌面横幅由约 2.4:1 调整到约 2.1:1，
|
||
让主视觉承担更多首屏面积，但不增加任何功能模块。
|
||
- 当前裁切切掉了角色头部尖端；源图头部位于上方约 8%–20%，应提高 `object-position` 并取消
|
||
负向顶部偏移，在保留角色身份的同时继续裁掉原画四角孔洞与锈蚀边框。
|
||
- 移动端文案动画曾因 `forwards/both` 保留 `translateY(-50%)`；已在 768px 以下禁用该动画，
|
||
确保首帧和结束帧都不会把文字移出安全区。
|
||
- 390×844 首轮发现主题桌面规则把 `.sidebar` 重新设为 `position: relative`，其选择器优先级
|
||
高于基础移动端的 `position: fixed`，导致隐藏后的侧栏仍占 280px 布局宽度；已在 gilded 的
|
||
768px 媒体查询中显式恢复 `position: fixed`，这是生产样式问题而非预览夹具问题。
|
||
- 1024×768 修复后截图中侧栏、主视觉、标题与输入区完整且无横向裁切，人物头部和武器身份
|
||
清楚；整页控件统一性通过。
|
||
- 390×844 修复侧栏后宽度正常，但 274px Hero 下方留下约半屏空白；移动画幅应使用
|
||
`clamp(..., 52svh, 430px)` 随可用高度增长，以原图纵向优势填充首屏，不新增内容。
|
||
- 390×844 最终串行截图中 Hero 为 430px，高度、人物与原有文案都完整，输入区仍固定可见；
|
||
独立 profile 截图曾出现透明黑块，但默认 profile 串行重拍完全正常，确认不是页面样式缺陷。
|
||
- 1440×900 终稿中 2.1:1 Hero 与侧栏/输入区共同填满首屏，角色头冠、胸甲、披风和武器清楚，
|
||
原图孔洞与锈边未进入画面；左侧纸纹安全区和右侧人物通过渐隐连续衔接，正文对比清晰。
|