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

Pure CSS – Lace

diana-adrianne.com

Post reply on HN
Print view View original

51–60 of 106 posts

Re: Pure CSS – Lace

#51

Post by toddmorey »

tannhaeuser wrote: post #49

I know, i know, it's awesome. But, unless it's specifically to make a point regarding the absurdity of today's web (such as eg demonstrating CSS Turing completeness), I can't help finding such hacks sad, because it just blends in to demonstrate how far we've striven from what once was a vision for a rational media architecture with a dedicated vector graphic format.

I don’t think that’s fair, exactly. The point of this exercise is to show artistic expression by pushing a medium outside of its intended use. There’s also an artist that paints in MS Excel, for example.

SVG is an incredible and underrated format. You can create illustrations in svg with modern graphics tools, yet still hack and animate them with css and js. And CSS Houdini is a really exciting development, too.

Some things about the web platform are frustrating for sure, but this sort of project isn’t any kind of statement on the effort required to build modern web graphics and illustrations because you’d never approach it this way. It’s just a fun puzzle for the artist, and every tech and medium has examples of this sort of thing.

Re: Pure CSS – Lace

#52

Post by welly »

ekianjo wrote: post #40

> I have not concerned myself with cross-browser-compatibility, so the live preview will most likely look laughable in anything other than chrome. Indeed it looks much worse on Firefox than on Chrome.

In Chrome 78.0.3904.70

https://i.imgur.com/n0MoNfY.png

In Firefox 69.0.2

https://i.imgur.com/UKw3SGf.png

Much worse? She just looks a bit more sleepy!

Re: Pure CSS – Lace

#53

Post by robin_reala »

Uehreka wrote: post #43
robin_reala wrote: post #33

Earlier quoted context omitted.

The downvotes are happening because this would have been as possible to achieve in Safari as in Chrome had the author chosen to develop purely in that, and Chrome would have been one of the engines that look broken. At this level you’re relying on engine quirks rather than spec compatibility.

Disagree. As someone who has tried to make web art that works cross-browser, I frequently follow standards and end up with something that works in Chrome, but breaks in Safari. I end up having to write hacks to detect Safari, cut out the parts of the standard they’ve implemented wrong, and find often crappy looking workarounds. I’ve had issues with canvases just sort of “flashing” for no reason, and if you try to use…

OK, but there’s no use of SVG or canvas here, this is purely CSS.

Re: Pure CSS – Lace

#55

Post by lioeters »

aurbano wrote: post #11

Amazing! Now I really wanna code something up that will generate this, it seems like it would be a super fun weekend project :)

Yes! Please create a higher-level abstraction so we can all be CSS painters in the Old Masters' style.

Re: Pure CSS – Lace

#56

Post by ekianjo »

welly wrote: post #52
ekianjo wrote: post #40

> I have not concerned myself with cross-browser-compatibility, so the live preview will most likely look laughable in anything other than chrome. Indeed it looks much worse on Firefox than on Chrome.

In Chrome 78.0.3904.70 https://i.imgur.com/n0MoNfY.png In Firefox 69.0.2 https://i.imgur.com/UKw3SGf.png Much worse? She just looks a bit more sleepy!

I think you inverted the pictures. The first one is what i get in Firefox, not Chrome.

Re: Pure CSS – Lace

#57

Post by tiborsaas »

tannhaeuser wrote: post #49

I know, i know, it's awesome. But, unless it's specifically to make a point regarding the absurdity of today's web (such as eg demonstrating CSS Turing completeness), I can't help finding such hacks sad, because it just blends in to demonstrate how far we've striven from what once was a vision for a rational media architecture with a dedicated vector graphic format.

You are making a claim based on what's being an extreme application of a technology. We can push any technology to its limits but that doesn't mean that average usage should suffer from the edge case problems.

We still have a rational media architecture with vector graphics support.

Re: Pure CSS – Lace

#58

Post by kyle-rb »

Uehreka wrote: post #43
robin_reala wrote: post #33

Earlier quoted context omitted.

The downvotes are happening because this would have been as possible to achieve in Safari as in Chrome had the author chosen to develop purely in that, and Chrome would have been one of the engines that look broken. At this level you’re relying on engine quirks rather than spec compatibility.

Disagree. As someone who has tried to make web art that works cross-browser, I frequently follow standards and end up with something that works in Chrome, but breaks in Safari. I end up having to write hacks to detect Safari, cut out the parts of the standard they’ve implemented wrong, and find often crappy looking workarounds. I’ve had issues with canvases just sort of “flashing” for no reason, and if you try to use…

This; I've had issues with Safari when trying to create a smooth animation of multiple elements synced up to each other to create the illusion of them being one continuous looping element. Chrome, Firefox, and Edge had no problem keeping the elements synced together, but in Safari, the time-resolution of animation-delay was terrible, and it forced me to overlap the elements by quite a bit, making things a bit worse across all browsers.

Safari also basically destroyed my animation whenever the window size was changed, which also applies to switching from portrait to landscape on iOS.

Re: Pure CSS – Lace

#59

Post by tannhaeuser »

tiborsaas wrote: post #57
tannhaeuser wrote: post #49

I know, i know, it's awesome. But, unless it's specifically to make a point regarding the absurdity of today's web (such as eg demonstrating CSS Turing completeness), I can't help finding such hacks sad, because it just blends in to demonstrate how far we've striven from what once was a vision for a rational media architecture with a dedicated vector graphic format.

You are making a claim based on what's being an extreme application of a technology. We can push any technology to its limits but that doesn't mean that average usage should suffer from the edge case problems. We still have a rational media architecture with vector graphics support.

Yeah I was hesitant to post because of the negative vibe to it, but still, if all we've achieved in the last decade or so is a replacement syntax for what was already possible 20 years ago on the web (Adobe SVG plugin) and with today's browser out of the box, we ought to search our soul what our goals are with the web platform. Because absurd CSS complexity with some 20 different layout models (or any bikeshedding on syntactial issues really) just serves to dilute any future effort for implementing parts of the web stack for no good reason other than browser lock-in.

Re: Pure CSS – Lace

#60

Post by welly »

ekianjo wrote: post #56
welly wrote: post #52

Earlier quoted context omitted.

In Chrome 78.0.3904.70 https://i.imgur.com/n0MoNfY.png In Firefox 69.0.2 https://i.imgur.com/UKw3SGf.png Much worse? She just looks a bit more sleepy!

I think you inverted the pictures. The first one is what i get in Firefox, not Chrome.

You're quite right! Just looked again in Firefox.
Post reply on HN