Joined: May 12, 2013
Post Count: 1545
Status:
Offline
Re: Light & textures - rendering examples of this and that.
Thanks. After some experiments it certainly looks as if the rendering considers equation of time.
..more complicated in SH3D, I try to use the sunlight the same way, so I often shift the date and time to change the colour and height of the sunlight...
And you make it work nicely for your renderings. But for me it would only be confusing if I could shift the sun at random, so I am happy it is 'complicated' to 'cheat'.
Anyone coming across this thread and reading about the sky texture alignment, should also know that SH3D 6 (beta 7) introduces X offset for the sky texture so it can be rotated.
Denmark
Joined: Jul 7, 2013
Post Count: 635
Status:
Offline
Re: Light & textures - rendering examples of this and that.
@okh
Anyone coming across this thread and reading about the sky texture alignment, should also know that SH3D 6 (beta 7) introduces X offset for the sky texture so it can be rotated.
Your contributions here are boosting the value of this thread. Thank you!
Joined: May 12, 2013
Post Count: 1545
Status:
Offline
Re: Light & textures - rendering examples of this and that.
Oh well, I am just meddeling. Really appreciate your detailed guide. Meanwhile I am updating my .svg template. Not posted yet. Template works quite well for inserting own images, but when I try to use 3d matrix to recreate your backdrop distortion I run into all sorts of problems. In part it is not supported by Inkscape (and not all browsers), but more annoyingly, even if the image transforms well, it somehow gets so blurred that it is totally useless. But I am on the case. One day maybe a proper man-template will be available. Meanwhile I suppose we shall have to make do with the (better) upside down world. ok
Denmark
Joined: Jul 7, 2013
Post Count: 635
Status:
Offline
Re: Light & textures - rendering examples of this and that.
even if the image transforms well, it somehow gets so blurred that it is totally useless.
It's your fear of high resolution that is blurring your vision!
My sky images are 15000px x 3750 px. I normally go at least twice that size when editing, and then rescale to 15000 x 3750 px ( or sometimes as low as 6000 x 1500 px if there are no gradients present).
The jpg-compression algorithm can be tricked by adding a layover of noise, so that even at the lowest (10%) jpg-quality a 15000 x 3750 image will render an acceptable sky at FoV 30. A 15000 x 3750 low-res jpg @ 10% can weigh as little as 200kb, and still render ok. For sky images, resolution (size) and quality goes hand in hand.
Joined: May 12, 2013
Post Count: 1545
Status:
Offline
Re: Light & textures - rendering examples of this and that.
It's your fear of high resolution that is blurring your vision!
That could very well be, actually. As you know I work with scaled down images for templates and tests even if I am not quite as cheap with my more private projects.
Still, there is something strange. I can transform the image quite well in the Gimp. But when I try to use .svg so a linked image can distort automatically, I get problems. Cannot remember how intimate you are with .svg, but here is the latest attempt using .svg + css3 to test 'automatic' 3d distort in the template (viewBox="0 0 360 94" ). In Firefox, the rectangle and image distorts, but is too blurred.
<!-- In theory this could distort (transform) an image to improve rendering, but it is not supported by several browsers/Inkscape, and when it is supported (Firefox), the image blurs --> <g transform="translate(30 60)" opacity="1"> <g style="transform-origin: 32px center 0px; transform: matrix3d(1,0,0.00,.00,0.00,1,0.00,0.01,0,0,1,0,0,0,0,1);" > <rect width="72" height="36" fill="none" stroke="red" stroke-width="1"/> <image width="72" height="36" xlink:href="mountainx.png" preserveAspectRatio="none"/> </g> </g>
When I can spend a couple of hours to concentrate, I will try some more before I post the template. For the record, this is not an attempt at picture perfect, just a quick approach to create a backdrop that can work with a SH3D scene render. ok
Denmark
Joined: Jul 7, 2013
Post Count: 635
Status:
Offline
Re: Light & textures - rendering examples of this and that.
Cannot remember how intimate you are with .svg,
Not at all intimate I'm afraid But I'm quite intimate with Photoshop, and I know for a fact that scaled down images will produce crappy outputs.
Okay... We have talked about this before.
A 1024 px image at maximum jpg-quality will not produce an acceptable sky image, whereas the same image at 6000 px, compressed so much that it's weighing the same (both weighing 150 kb), will produce a far better ( almost a tolerable) sky rendering. Examples: Sky image 1024 px - Filesize = 150 kb:
Same image 5700 px - Filesize = 155 kb:
Size matters (resolution – not filesize), not only for the sky, but for ALL textures, and the higher the resolution – the more compression can be applied – ergo: The filesize is less important than the resolution.
I prefer sky images @ 15000 x 3700 px, and they normally weigh between 800 kb and 2.1 Mb.
Joined: May 12, 2013
Post Count: 1545
Status:
Offline
Re: Light & textures - rendering examples of this and that.
..quite intimate with Photoshop...
Picking a tool is a matter of choice. My preference is Gimp for the raster images, which I link into an .svg file for post editing with a text editor or Inkscape. Doubtless, this could be done with the Gimp alone, or Photoshop, with just as good results. The only reason for the .svg detour, is that items easily can be placed, moved, scaled accurately on the canvas by using numeric co-ordinates. And then each item, a hill, a cloud, can be adjusted individually with the Gimp (or whatever) to acceptable resolution, hue etc. etc. But that is just a personal preference.
We have talked about this before.
Yes we have. And, of course, I agree with what you say. Just did a test using the .svg template (which I will post) exporting to .png. at: 7200×1880, 3600×940 and 1800×470. With 6.0 beta and limited access to memory, 7200×1880 maxed out. 1800×470 rendered quickly. The latter is acceptable for planning purposes, but even I would consider using higher resolutions for a nice render. Which is to say, I agree with what you say even if I probably have a lower threshold for crappy.
Denmark
Joined: Jul 7, 2013
Post Count: 635
Status:
Offline
Re: Light & textures - rendering examples of this and that.
With 6.0 beta and limited access to memory, 7200×1880 maxed out
Yes, that's the problem with the web-start-version.
The only reason for the .svg detour, is that items easily can be placed, moved, scaled accurately on the canvas by using numeric co-ordinates. And then each item, a hill, a cloud, can be adjusted individually with the Gimp (or whatever) to acceptable resolution, hue etc. etc.
Sounds a lot like what I do in Photoshop. I don't think I have fully understood how the .svg numeric coordinates work differently than a Photoshop ( or Gimp) template.
Joined: May 12, 2013
Post Count: 1545
Status:
Offline
Re: Light & textures - rendering examples of this and that.
.. fully understood how the .svg numeric coordinates work differently...
Not much to understand, I think. Approach is the same, I just like the more readable and transferable .svg format for constructing a multi-element background. No idea about Photoshop co-ordinates, but in the example below, sun is placed at x="90" y="60", which on a 360×90 canvas (viewBox) converts to degrees.
Probably like your Photoshop approach, at the end of the day, it is just question of combining elements on a sky texture, for instance: sun.png, clouds.png and mountain.png. Unlike the not-so-open formats of Photoshop and the Gimp, .svg displays with any browser and edits with a text editor / Inkscape / the Gimp / OpenOffice etc. maybe even Photoshop. And it can be scaled to any size without any quality loss other than that which comes with the linked raster images. All this fits into a small (and tidy) file: minitest.svg which looks like this opened in any text editor:
Saved as .jpg (3600×900, high compression) the result is a sky texture for SH3D minitest_horizon.jpg (64KB) which gives this render: Yes, the mountain is crappy: the image linked is low quality at 256×64, compressed to 10,6KB. Which is overdoing it, even for me. On the other hand, the entire mountain can be Base64 embedded in the .svg without taking up more than one line of less than 15000 characters and be used several times in various shapes and sizes:
A mountain is probably not a good example but embedding can be a convenient way to save simple raster elements inside a still small .svg file. But whether you wish to embed or not, using .svg as a 'container' or list of links, means you can exploit the best qualities all formats, combining .png, .jpg and .svg for different elements. .png for transparency / indexed colours, .jpg for smaller 'photographic' files and so on. Preferably of higher quality than the ones used in this example.
The template I actually use is more elaborate with a grid, some embedded images and gradients. Gradients and blurs can be useful for many things, such as blending skyline with ground colour/texture in SH3D or lighting up parts of the sky. But point is for the file to be simple, readable and compatible so SH3D skyline can be edited with a couple of keystrokes with as many image elements as you like in whatever quality: cityscapes, forests, planes, satellites and so on*, at higher quality. But it is also possible to make the template as advanced as you wish: The sun path is an approximation of equinox sun passage on horizon to be moved/transformed for other seasons, transformed upside down so the path reflects actual degrees above horizon. Something I would not know how to do accurately with the Gimp.
Clearly, all editing is quicker with a familiar interface. So no reason not to stay with whatever works. In addition to my liking for open, human readable formats, I suppose this is also a sales pitch for editing xml in general. For instance, I hardly use furniture libraries when it is possible to add cutouts, door/window and lightsource properties directly in Home.xml.
Joined: May 12, 2013
Post Count: 1545
Status:
Offline
Re: Light & textures - rendering examples of this and that.
Forgot to post the file with (low-res) mountains, clouds, sun etc. embedded. Easier to edit. Yes, yes, say nothing, the elements will need higher resolution for nice rendering. But you get my drift. A high-res credo is sensible, here is an example of the opposite: how low is it possible to go.
minitest_embed.svg < 50 KB, initial resolution 1200×300 px, but can scale to anything when importing to Gimp/Photoshop or changing width height in the .svg. SH3D does not import the .svg directly so the image needs to be converted to .png/.jpg before use.
ok
