light-scene

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Cinematic rendering

电影级渲染

A polished frame is lit and graded, not just populated. Treat lighting, sky, shadows, tone mapping, and post as one pass over the assembled scene, and tune every value against a real screenshot rather than from memory.
Prefer shipped building blocks over hand-written shaders and passes. Discover them with the
reuse-scripts
skill and adapt the closest official example with
find-examples
:
  • the core
    CameraFrame
    helper for tone mapping, ambient occlusion, bloom, vignette, and grade;
  • a procedural sky and image-based light for ambient colour and reflections;
  • a shadow catcher for grounding subjects that have no lit floor.
For an outdoor scene with water, stop before authoring the scene and read both
reuse-scripts
and
find-examples
. Use
graphics/water.example.mjs
as the initial composition recipe: it already joins the production
Water
script, sky, sun,
CameraFrame
, water layer, scene depth, and reflection pipeline. Get that complete frame rendering before replacing its assets or tuning its look. A custom normal-mapped material, tessellated plane, or reflection-coloured mesh is not the baseline and does not substitute for
Water
when the brief asks for reflective water.
Keep the two named production integrations visible in the implementation:
  • import and create
    Water
    from
    playcanvas/scripts/esm/water.mjs
    on the water entity, preserving the example's required render component, camera reference, water layer, depth map, and textures;
  • construct
    CameraFrame
    from
    playcanvas
    for the gameplay camera, set a deliberate tone map and restrained grade, call
    update()
    , and destroy it with the application.
Do not continue to cosmetic tuning while either integration is missing or diagnostics report a shader, texture, or framebuffer error.
一个精致的画面需要经过打光和色彩分级,而非仅仅填充内容。将照明、天空、阴影、色调映射和后期处理视为对已组装场景的一次性处理流程,并且要对照实际截图来调整各项参数,而非凭记忆操作。
优先使用官方提供的构建模块,而非手写着色器和处理流程。通过
reuse-scripts
技能查找这些模块,并借助
find-examples
技能适配最接近的官方示例:
  • 核心工具
    CameraFrame
    ,用于色调映射、环境光遮蔽、光晕、暗角和色彩分级;
  • 程序化天空与基于图像的照明,用于提供环境色彩和反射效果;
  • 阴影捕捉器,用于为没有受光地面的物体提供接地效果。
对于包含水面的户外场景,在创建场景前请先阅读
reuse-scripts
find-examples
的相关内容。以
graphics/water.example.mjs
作为初始构图方案:它已整合了生产环境中的
Water
脚本、天空、太阳、
CameraFrame
、水层、场景深度和反射管线。在替换资源或调整视觉效果前,先确保完整的画面渲染正常。当需求是反射水面时,自定义法线贴图材质、细分平面或反射色彩网格不能作为基础方案,也无法替代
Water
脚本。
在实现过程中,要保留两个已命名的生产环境集成项:
  • 在水实体上从
    playcanvas/scripts/esm/water.mjs
    导入并创建
    Water
    ,保留示例所需的渲染组件、相机引用、水层、深度图和纹理;
  • 为游戏相机从
    playcanvas
    构建
    CameraFrame
    ,设置明确的色调映射和克制的色彩分级,调用
    update()
    方法,并在应用销毁时一同销毁它。
如果任一集成项缺失,或诊断报告显示着色器、纹理或帧缓冲错误,请不要继续进行外观调整。

Light and expose

光照与曝光

  • Establish one dominant key light with a clear direction and warm or cool intent, then add soft fill or ambient so shadows are not crushed to black. A single flat ambient with no key reads as an asset gallery.
  • Choose a physically based tone mapping and a deliberate exposure, then balance light intensities to that exposure, not the reverse.
  • Drive ambient and reflections from the sky or an environment map, not a constant colour, so materials pick up their surroundings.
  • Tune the HDR stack in isolation before styling it. Begin with neutral tone mapping, scene exposure
    1
    , procedural-sky luminance near its official-example value, bloom off, grading neutral, fog off, and reflection/specular strengths at their defaults. Capture a screenshot, then change one class of value at a time. Do not simultaneously raise key intensity, sky luminance, exposure, reflection, saturation, fog brightness, and bloom.
  • Treat linked procedural skies as the owner of the sun light's direction, colour, and intensity. Set the light's base intensity before assigning it to the sky and tune the sky elevation/azimuth; do not also hand-author the light transform or colour as though they remained independent.
  • Preserve the source assets' albedo colours. If diffuse texture colours collapse toward white or a single warm tint, reduce the HDR stack before compensating with darker material colours.
  • 设置一个具有明确方向和冷暖倾向的主光源,然后添加柔和的补光或环境光,避免阴影被压成纯黑色。仅使用单一平淡的环境光而无主光源的画面会显得像资源画廊。
  • 选择基于物理的色调映射和明确的曝光值,然后根据该曝光值平衡光照强度,而非反过来调整。
  • 从天空或环境贴图获取环境光和反射效果,而非使用恒定颜色,这样材质能融入周围环境。
  • 在进行风格化调整前,先单独调试HDR堆栈。从中性色调映射、场景曝光值
    1
    、程序化天空亮度接近官方示例值、关闭光晕、中性色彩分级、关闭雾效、反射/高光强度为默认值开始。截取一张截图,然后每次只调整一类参数。不要同时提高主光源强度、天空亮度、曝光值、反射强度、饱和度、雾效亮度和光晕效果。
  • 将关联的程序化天空视为太阳光方向、颜色和强度的控制源。在将光源分配给天空前设置其基础强度,然后调整天空的仰角/方位角;不要手动设置光源的变换或颜色,仿佛它们是独立的。
  • 保留源资源的反照率颜色。如果漫反射纹理颜色趋近于白色或单一暖色调,请先降低HDR堆栈的强度,再通过调暗材质颜色来补偿。

Shadow and ground

阴影与接地

  • Enable shadows on the key light and size the shadow area and resolution to the framed subject, not the whole world. Soften the penumbra rather than only raising resolution.
  • Ground subjects with a contact or catcher shadow when the surface beneath them is not itself lit.
  • 为主光源启用阴影,并根据画面中的主体调整阴影区域和分辨率,而非针对整个场景。优先柔化半影,而非仅提高分辨率。
  • 当物体下方的表面未受光时,使用接触阴影或阴影捕捉器让物体看起来贴合地面。

Grade with restraint

克制的色彩分级

  • Bloom, fog, vignette, and colour grade unify a frame; overdone bloom and heavy fog destroy silhouette and depth. Start subtle and increase only against the screenshot.
    CameraFrame
    bloom intensity is documented for the
    0
    to
    0.1
    range; stay inside it.
  • Match fog colour and density to the sky so the horizon stays coherent.
  • Preserve surface detail through the brightest reflection path. If glare clips a large part of the frame to white or a reflection becomes an opaque black blob, rebalance exposure, light intensity, reflection strength, and shadow bias before adding more post-processing.
  • Compare both the brightest surface and the shadow-facing side of the hero subject in the same screenshot. Reject the grade if either broad highlight clipping or crushed-black silhouette hides texture detail. A mechanically valid frame is not visually complete while either failure remains.
  • 光晕、雾效、暗角和色彩分级用于统一画面;过度的光晕和浓重的雾效会破坏轮廓和深度感。从细微效果开始,仅对照截图逐步增强。
    CameraFrame
    的光晕强度文档建议范围是
    0
    0.1
    ,请保持在此范围内。
  • 使雾效的颜色和密度与天空匹配,确保地平线连贯。
  • 在最亮的反射路径中保留表面细节。如果眩光将画面大部分区域裁剪为白色,或反射变成不透明的黑色块,请先重新平衡曝光值、光照强度、反射强度和阴影偏移,再添加更多后期处理效果。
  • 在同一张截图中对比主体最亮的表面和背光面。如果大面积高光裁剪或纯黑轮廓遮挡了纹理细节,请放弃当前的色彩分级。只要存在其中任一问题,即使技术上有效的画面也不算视觉上完整。

Prove the look

验证视觉效果

Tune against pixels, not numbers. Capture the intended framing with an image-returning browser screenshot tool and inspect the returned image, as
apply-conventions
and the local agent guide require; a saved filepath is not evidence. Confirm the subject is exposed and readable, shadows are present but not crushed, and the grade is restrained, from the real gameplay camera at the target resolution. Confirm the post-process camera keeps rendering as it orbits and pitches.
Choose the authoring surface with the
build-app
skill and set lights, camera, and scene settings through its own primitives before reaching into the Engine.
对照像素而非数值进行调整。使用支持返回图像的浏览器截图工具截取预期的画面,并检查返回的图像(这是
apply-conventions
和本地代理指南的要求);仅保存文件路径不能作为验证依据。从目标分辨率下的实际游戏相机视角确认:主体曝光正常且清晰可读,阴影存在但未被压暗,色彩分级克制。确认后期处理相机在旋转和俯仰时持续正常渲染。
使用
build-app
技能选择创作界面,在深入引擎操作前,先通过其自身的基本元素设置灯光、相机和场景参数。