| |
Raistlin
Registered: Mar 2007
Posts: 671 |
Screenshots of Interlace Pics
I’m interested to know what people’s thoughts are on screenshotting interlace pics…
On C64GFX, we do things a bit differently to CSDb. Generally, we care more about the original art than how it’s presented - so we’ll host logos with all the “extras” removed (scrollers, textual information, etc). But of course CSDb screenshots are of how things are actually released.
With interlace pics, it’s more complicated. In theory we should be displaying animations at 50fps (usually) switching between 2 screenshots.. but I’m lead to believe that that could cause battery drain and other problems on devices - plus the FPS probably wouldn’t be 50.
Some sort of blending was suggested.. or simply choosing alternate pixels and merging to create a full-res pic.
The latter is what I’ve tried with some pics .. eg. Some of Leon’s. It looks good and it looks like it’s true to the original creation - I’d hazard a guess that he simply drew these pics at full 320x200px resolution on most of these, actually, rather than drawing on C64 in an interlace editor?
Eg. https://c64gfx.com/image/168046
I toyed with the idea of blending the 1px offset pictures (frame 0 and frame 1).. but I’m not sure that that’s correct either.
Others have suggested some fairly complex blending schemes that presumably show more like it would be on CRT - and I think this is where the 1,000s of colours problem comes in (evident on many CSDb screenshots). This seems unfair since regular MC/HI screenshots don’t get the same treatment.
Anyway, interested to know thoughts… both for CSDb and for C64GFX.com |
|
... 47 posts hidden. Click here to view all posts....
|
| |
Jetboy
Registered: Jul 2006
Posts: 329 |
Quote: And.... Tri-lace: https://kawalekkodu.pl/trilace_css.html
Quoting RaistlinThanks Gordian - that does look good! It’ll take me a while to try on the site properly but I’ll get there :-)
If you need, I can prepare more universal CSS, which takes URL of images from data-* attributes of DIV.lace. Just let me know.
Frame 2 and frame 3 are the same. |
| |
Gordian
Registered: May 2022
Posts: 72 |
Good catch:) I fix it, was wrong only as separated frames examples. |
| |
Digger
Registered: Mar 2005
Posts: 433 |
Soft-light mode seems to increase the saturation though. |
| |
Jetboy
Registered: Jul 2006
Posts: 329 |
I know i'm retarded, but i think if something is going to be done, it should be done right.
There is an error in the css animation, it has keys at 0, 50, 100 while it should have them at 0, 33, 66.
You have them 2 side by side so you can compare, but at the higher rate, so it blends better.
Also soft-light is plain wrong. Compare interlacing result with it, then compare it with proper blend.
http://brombra.net/hold%20my%20beer/trilace_css.html
But Gordian you unintentionally created excellent copy protection for images. They cannot be saved with "save image", and if you make a screenshot it will be not correct :) Of course anyone with a browser and some knowledge can still scrap the sources and reconstruct images, but that requires way more than average knowledge :) I'm impressed! Have not seen it done like that before. Bravo!
In a way that reminds me of LM Dir Fun Fresh cannot type some values into the filenames where he is injecting the code, so he can't do simple lda #$value, but he can load different value and xor it with yet another different value getting what he needs that would otherwise be prohibited. It is exactly the same thing with images here :) |
| |
Gordian
Registered: May 2022
Posts: 72 |
Quoting Jetboy
There is an error in the css animation, it has keys at 0, 50, 100 while it should have them at 0, 33, 66.
Yes, you're absolutely right. I've uploaded wrong version.
Quoting Jetboy
Also soft-light is plain wrong. Compare interlacing result with it, then compare it with proper blend.
As I wrote above, soft-light is the only option which gives results closest to the "real" interlace. Any other value of background-blend-mode it is not as good as this one. It's not the ultimate solution, just example;)
Quoting Jetboy
But Gordian you unintentionally created excellent copy protection for images. They cannot be saved with "save image", and if you make a screenshot it will be not correct :) Of course anyone with a browser and some knowledge can still scrap the sources and reconstruct images, but that requires way more than average knowledge :) I'm impressed! Have not seen it done like that before. Bravo!
Every image embedded as background-image cannot be save by "Save image":) Whatever there is animation or not. |
| |
Jetboy
Registered: Jul 2006
Posts: 329 |
Quoting Gordian
Every image embedded as background-image cannot be save by "Save image":) Whatever there is animation or not.
Yes, but not every background image displays wrong when screen shoting. This could be brought to next level by mixing more images, which each looks nothing alaik original picture, but looks exactly the same when you combine all of them.
As Digger suggested, i added pure css solution to blend 3 images to one properly without using blend modes, just opacity (previous link updated). We draw first image with 100% opacity, second on top of it with 50% opacity, and third with 33.33% opacity. In result each image has 33,33% of influence - of course there is some rounding error like always with discrete math, but it is negligible. |
| |
Digger
Registered: Mar 2005
Posts: 433 |
@Raistlin: I hope this last solution solved the problem? I'd still vote for a toggle switch between i-lace and composite. |
| |
chatGPZ
Registered: Dec 2001
Posts: 11379 |
(and interlace should be default really) |
| |
Raistlin
Registered: Mar 2007
Posts: 671 |
Which do we think we'd like most?
I'm not currently looking to emulate CRT .. I don't think that would be fair since the MC/HI pics don't do that. But if "interlace" can be simulated without all the smudging that comes with CRT, I think that would be fine?
Was Gordian's 50hz interlace here the right option..?
https://kawalekkodu.pl/interlace_css.html |
| |
Gordian
Registered: May 2022
Posts: 72 |
I've made a little change in that example.
Previous 50 Hz and 100 Hz based on the linear easings which causes smoother swaps (there is opacity change between images). I added also stepped animation like in the trilace example. It looks like rectangle signal/function, and no smoothness can bee seen. The bigger difference can be seen in the 50 Hz example which is just slower. |
| Previous - 1 | 2 | 3 | 4 | 5 | 6 - Next |
