09-06-2019, 11:47 AM
(This post was last modified: 09-06-2019, 11:59 AM by OpenString.)
Hello,
I've started creating a new Website but my main feature has some problems.
When loading in 3D models into my web page, the complexity of the model is not really a problem, not after compression.
The real problem I have is with the texture size. For realistic PBR Assets it is required to go at least 4k. For some
reason this takes a really long time. As opposed to for example sketchfab.com, the models there seem to load pretty fast.
I've already come up with a solution, which would be to progressively load in low- and high resolution textures at the same
time so that the user doesn't need to stare at nothing while he waits for the model to load.
(just a side note, I'm not using any database at the moment. I could use MySql, however I don't know if that's going to
speed up the image readiness or not - if someone here knows an answer to this please let me know.)
What I want to do instead:
Loading in multiple textures in different resolutions seems a little wrong. So I've come up with a different idea which would
involve some image manipulation but I have no idea where to start.
What I want to do is separate one texture into multiple layers (so the resolution stays the same). Each layer should have only a
part of the image on it - let's say for example only a set of specific colors (the detail so to speak). Most importantly is that these
layers must not rely on an alpha channel. When we overlay these maps we should be able to increase the detail level gradually.
The idea basically is to take the model and first put a 4k map on it. This first map has has only very basic data, like the
color and the shape. Like that the file size should be significantly reduced and the texture is loaded faster. In theory we can
then just continue to overlay all the remaining maps as the become ready until the model is fully loaded.
I think like this the result might look a little better because instead of looking at a blurry mess while the user is waiting
he can actually see how the detail is progressively added to the mesh.
Hope this explanation helps for more details you can checkout the website and the dev space:
www.opensting-studios.com <-- all 4k maps applied, very long loading
www.dev.opensting-studios.com <-- no map, high poly model still loads fast
remember again: I'm not using any database! Tell me if I should use one, if that means it will increase the performance..
If anyone can help me out how to achieve this effect in gimp, or maybe there's even a small program out there that does exactly what
I need. The only thing I could find was a website which splits the image into multiple sections, which is not what I need.
Thanks a lot!
I've started creating a new Website but my main feature has some problems.
When loading in 3D models into my web page, the complexity of the model is not really a problem, not after compression.
The real problem I have is with the texture size. For realistic PBR Assets it is required to go at least 4k. For some
reason this takes a really long time. As opposed to for example sketchfab.com, the models there seem to load pretty fast.
I've already come up with a solution, which would be to progressively load in low- and high resolution textures at the same
time so that the user doesn't need to stare at nothing while he waits for the model to load.
(just a side note, I'm not using any database at the moment. I could use MySql, however I don't know if that's going to
speed up the image readiness or not - if someone here knows an answer to this please let me know.)
What I want to do instead:
Loading in multiple textures in different resolutions seems a little wrong. So I've come up with a different idea which would
involve some image manipulation but I have no idea where to start.
What I want to do is separate one texture into multiple layers (so the resolution stays the same). Each layer should have only a
part of the image on it - let's say for example only a set of specific colors (the detail so to speak). Most importantly is that these
layers must not rely on an alpha channel. When we overlay these maps we should be able to increase the detail level gradually.
The idea basically is to take the model and first put a 4k map on it. This first map has has only very basic data, like the
color and the shape. Like that the file size should be significantly reduced and the texture is loaded faster. In theory we can
then just continue to overlay all the remaining maps as the become ready until the model is fully loaded.
I think like this the result might look a little better because instead of looking at a blurry mess while the user is waiting
he can actually see how the detail is progressively added to the mesh.
Hope this explanation helps for more details you can checkout the website and the dev space:
www.opensting-studios.com <-- all 4k maps applied, very long loading
www.dev.opensting-studios.com <-- no map, high poly model still loads fast
remember again: I'm not using any database! Tell me if I should use one, if that means it will increase the performance..
If anyone can help me out how to achieve this effect in gimp, or maybe there's even a small program out there that does exactly what
I need. The only thing I could find was a website which splits the image into multiple sections, which is not what I need.
Thanks a lot!