-
Notifications
You must be signed in to change notification settings - Fork 1.3k
IridescentDishWithOlives for ior, specular and volume extensions #319
Conversation
A glass dish with olives and matching glass cover. This is a “mascot” model for Phase 2 extensions, showcasing specular color, ior and volume extensions. An animation has been included to lift the refractive glass cover.
Fixing mismatched case on `screenshot_Large.jpg`
I experimentally added this model to gltf-test.
|
Thanks to both of you for checking the submission. Looks like I need to adjust the vertex normals on the gold leaf. The outer rim is looking at bit donut-shaped, rather than flat. Filament seems a bit aggressive with transmission roughness, not sure what I can do there. |
* goldLeaf recreated to be coplanar with bottom of glass, plus a 0.5mm gap. * goldLeaf vertex normals adjusted to reduce exaggerated curvature along rim of plate. * glassCover and glassDish specularColorFactor increased to [2,2,2] to improve specular response. * glassCover and glassDish baseColorTextures removed (specularColorFactor provides this instead). * Camera position and orientation adjusted to improve specular. * glTF-Pathtracer version added: reduced glass roughness, baked the Scale of the normalTextures into the textures, removed animation, rotated cover upwards. * Normal maps adjusted to look good in pathtracers at Scale:”1”. Reusing same textures for rasterizers. Adjusted Scale in rasterizer version. * goldLeaf normal map edited to add bumps along rim. * README updated.
…hronosGroup/glTF-Sample-Models into PearlGoldOliveCoveredGlassDish
Glass roughness values were too high, restored these to reasonable values.
@echadwick-wayfair
|
HDRI Haven is moving to Poly Haven. Thanks for the tip @cx20
@echadwick-wayfair Thank you for the quick fix. And if possible, To be consistent with other samples, it is better to name the sample model file the same as the folder name is a good idea.
|
…veCoveredGlassDish.gltf
Thanks for the update. |
For reference, the current display results are as follows.
@romainguy Are the results displayed by Filament as expected? |
Volume and specular are not implemented by Filament. Where can I download the glTF? |
The version within glTF-Pathtracer is meant for raytracers, it does not appear correctly in rasterizers (roughness too low, etc., see readme for details). The three renderers you're showing here are only rasterizers I think? |
Testing locally it seems like Filament has an issue with roughness mapping. |
The TransmissionRoughnessTest sample model may be helpful here. |
When using screen space refraction/transmission, Filament attempts to remap the roughness to try and match the screen space effect's gaussian approximation of the GGX NDF. It's that remapping that increases roughness too much it seems. |
Is there a screenshot of the path traced reference with the same roughness (0.15 instead of 0.035) used in the rasterizer asset? |
I'm actually starting to doubt three.js and Babylon here. I would expect the result to be more blurry with a roughness of 0.15. I think Filament blurs too much but three/Babylon too little. I did change Filament's roughness remapping to match the glTF spec (at IOR 1.0, roughness shouldn't apply to transmission) but otherwise our screen space refraction matches cubemap refraction at equivalent roughness. According to @sebavan, Babylon only uses regular texture mip levels for screen space refraction where Filament uses roughness-aware Gaussian-filtered mip levels, which would explain the difference. |
Yup I can validate that the blur would be more accurate from filament than babylon in this case as we chose to only optim for perf in this case. |
If equivalent roughness cannot be rendered at a performant level on low- or mid-level devices (e.g. mobile) then do we still need different materials for high-end devices and non-realtime renderers? |
The material can actually be the same, this is only the refraction texture creation and sampling which uses different techniques. About this issue, I think @MiiBond had implemented smthg for it in Babylon (simulation of course) and could probably detail more ? |
* Asset renamed from PearlGoldOliveCoveredGlassDish to IridescentDishWithOlives. * glTF-Pathtracer variant removed, since rasterizers and pathtracers should render similarly enough. * Animation changed to start at partially open, so pathtracers without animation support can render the same partially-open view as rasterizers. * Glass roughness reduced to match pathtracer ground-truth results; rasterizers will catch up. * glassCover thicknessTexture re-baked from geometry thickness, then softened to reduce hard edges from low-res geometry. * glassCover UVs redone because we don't need unique UV space for inside, and glassCover textures cropped from 2048x1024 to 1024x1024 to match new UVs. * glassCover inside assigned a different material from the outside, so the inside can use zero roughness to improve rendering in pathtracers. * glassDish geometry adjusted to reduce thickness and improve profile; glassCover and olives geometry adjusted to match new dish shape. * glassDish occlusion texture removed, reusing the goldLeaf occlusion texture. * glassDish now has KHR_maerials_volume for more accurate refraction.
@echadwick-wayfair It's a trivial matter, but the title of |
Rename heading to match folder name.
Of the four extensions (KHR_materials_ior, KHR_materials_specular, KHR_materials_transmission, KHR_materials_volume) three.js currently implements only transmission, so I'm afraid it won't be much help for comparison here. |
Speaking of which, I just added KHR_materials_volume to Filament. It will be in 1.11.0 which we'll release on July 19. It can be tested in our main branch right now. |
https://playcanv.as/p/wQgQBgkE/ Looky, real-time animated 3 channel chromatic dispersion (even runs on some smartphones). Thanks to J3D, mick and Web3d folks! |
@coderextreme the sample here is for supporting particular definitions of PBR Transmission, IOR, and Volume defined by very recent extensions to the glTF format... it doesn't look like the PlayCanvas glTF implementation supports those just yet (screenshot below), but it would be an exciting addition. 🙂 |
* glassCover now uses single material, so the volume can be a single closed surface. * glassCover now uses a roughnessTexture to set exterior roughness (0.1) and interior roughness (0.0) instead of using two materials. * glassCover UVs and textures adjusted to fit new layout with interior and exterior in the same material. * glassCover specularColorFactor increased to improve specular coloration. * glassDish occlusionTexture removed, so it can reuse the goldLeaf occlusion. * goldLeaf baseColorTexture hue adjusted to match photos. * IBL rotation adjusted for screenshots using "Artist Workshop" so more of the windows appear in the specular color: glTF Sample VIewer uses -X environment rotation, and Dassault PBR Sample Renderer uses -180 IBL rotation to match. * Readme and images updated. * Animation renamed to "glassCover rotation".
I updated the library and model and tried to display it again.
|
Thanks to @takahirox's work, three.js will support 3 of the 4 extensions soon (just missing EDIT: It looks like the IBL orientation is a bit different as well, unrelated. |
Any further discussion needed on this model? I think this looks good to merge. |
There's a bit more I could add to the readme to explain why the roughness is different on the inside of the glassCover, and how the specularColor is being used. But I think the asset itself is complete. |
Looks like the press release is hitting the wire now. 🚀 |
I updated the development version of
BTW, it is a known problem, but there is a problem with CubeMap/IBL used in the The CubeMap/IBL you are currently using refers to an older version in the |
I think that the problem of CubeMap/IBL of the Three.js sample of gltf-test has been solved.
|
@echadwick-wayfair As a minor question, is it intentional that relative paths are used to reference textures in the current directory? "uri": "./glassdish_spec.png" The glTF specification does not have a problem with relative paths being used, but I have tried several online glTF viewers (For example, PlayCanvas glTF Viewer) and they seem to give an error if relative paths are used. (This is probably a problem that needs to be fixed by the glTF viewer. However, I don't think it is necessary to specify a relative path because the sample model should be simple. |
This is an artifact from the Max2Babylon exporter. Thanks for the info about compatibility. I'll file an Issue in their repo, and remove them from this model as I think you're right, these seem to be redundant here. |
Redundant relative bitmap paths removed. Normal map for the glassCover edited to reduce 8bit pixellation artifacts.
Max2Babylon issue reported here BabylonJS/Exporters#985 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks @echadwick-wayfair!
A glass dish with olives and matching glass cover. This is a “mascot” model for Phase 2 extensions, showcasing specular color, ior and volume extensions. An animation has been included to lift the refractive glass cover.
Edit: updating the animated GIF to match the latest commit.