Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Zdog – Pseudo-3D JavaScript engine for Canvas and SVG

zzz.dog

Post reply on HN
Print view View original

11–20 of 96 posts

Re: Zdog – Pseudo-3D JavaScript engine for Canvas and SVG

#11

Post by ClassyJacket »

overgard wrote: post #6

I notice that there are some issues with depth sorting (which I guess would be expected). It'd be complicated, but one way you could do the same effect without that issue is to use signed distance fields in a shader: https://www.iquilezles.org/www/articles/distfunctions/distfu... (Demo at the bottom of the page)

I wonder if some sort of progressive dither or fade is practical to implement and fast enough (and visually useful)? If I wasn't at work right now I would have a look at the code.

I have some experience with Canvas rendering but, like this, just in straightforward layers. I don't think a dither would be practical, a fade might be using a mask and setting the alpha, but you'd still have to detect all the overlap.

I'd say the answer to my question is a 'nope'.

Re: Zdog – Pseudo-3D JavaScript engine for Canvas and SVG

#13

Post by cstrat »

tambourine_man wrote: post #9

This is amazing. The examples are great and feel amost too easy. I hope I get the chance to use it.

Same. I kind of wish I had a need for this sort of thing.

Without this sort of library I would have zero chance of building this myself. Amazing.

Re: Zdog – Pseudo-3D JavaScript engine for Canvas and SVG

#16

Post by oplav »

tomglynch wrote: post #3

Pop this on product hunt, you'll get your first few thousand users in no time. > Zdog is directly inspired by Dogz, a virtual pet game by P.F. Magic released in 1995. It used flat 2D circle sprites to render the Dogz’ models, but in a 3D scene. See Dogz playthrough video here. Dogz were fully animated in real time, running, flopping, scratching (on Windows 3.1!). It was remarkable. The new repeating the old. Love whe…

I hadn't thought about Dogz in ages. This video brought back some nostalgic memories.

https://www.youtube.com/watch?v=6lKSn_cHw5k

Re: Zdog – Pseudo-3D JavaScript engine for Canvas and SVG

#19

Post by manfredo »

oplav wrote: post #16
tomglynch wrote: post #3

Pop this on product hunt, you'll get your first few thousand users in no time. > Zdog is directly inspired by Dogz, a virtual pet game by P.F. Magic released in 1995. It used flat 2D circle sprites to render the Dogz’ models, but in a 3D scene. See Dogz playthrough video here. Dogz were fully animated in real time, running, flopping, scratching (on Windows 3.1!). It was remarkable. The new repeating the old. Love whe…

I hadn't thought about Dogz in ages. This video brought back some nostalgic memories. https://www.youtube.com/watch?v=6lKSn_cHw5k

I remember playing its successor Petz: https://www.youtube.com/watch?v=Qw2tJj5IX5k

Definitely have memories from 90s childhood gaming.

Re: Zdog – Pseudo-3D JavaScript engine for Canvas and SVG

#20

Post by myfonj »

overgard wrote: post #6

I notice that there are some issues with depth sorting (which I guess would be expected). It'd be complicated, but one way you could do the same effect without that issue is to use signed distance fields in a shader: https://www.iquilezles.org/www/articles/distfunctions/distfu... (Demo at the bottom of the page)

It is addressed in https://zzz.dog/extras#z-fighting as a feature:

> Z-fighting in Zdog is the natural result of its pseudo-3D engine. Zdog’s 3D shapes are actually 2D projections, rendered without any accounting for collisions with other shapes. > Rather than fighting against this effect, the best course is to accept it. Z-fighting is one of Zdog’s charms. Embrace it.

Post reply on HN