A grouped pure CSS parallax demo • Hacker News Board

Re: A grouped pure CSS parallax demo

#11

Post by nkozyra » Tue, Oct 21, 2014, 3:24 PM UTC

This is one recent design trend (along with the windowed images that scroll through their viewport) I wish would die in a hurry.

I'm not a UX/UI guy, but it feels like terrible UX/UI.

Re: A grouped pure CSS parallax demo

#12

Post by neya » Tue, Oct 21, 2014, 3:38 PM UTC

Some people here have commented that this is terrible design trend. I disagree. I would say this depends a lot on the use-case :)

[shameless plug] I've used (almost) the same effect for my landing page for my upcoming film:

http://salesmanfilm.com/

(P.S: Scrolling might be choppy on Retina MBPs/slower configs)

Re: A grouped pure CSS parallax demo

#13

Post by romanovcode » Tue, Oct 21, 2014, 3:40 PM UTC

nkozyra wrote: post #11

This is one recent design trend (along with the windowed images that scroll through their viewport) I wish would die in a hurry. I'm not a UX/UI guy, but it feels like terrible UX/UI.

I think it's already dying. I see less and less parallax sites whereas two years ago every startup had their site as parallax. :)

Re: A grouped pure CSS parallax demo

#14

Post by dave5104 » Tue, Oct 21, 2014, 3:42 PM UTC

nkozyra wrote: post #11

This is one recent design trend (along with the windowed images that scroll through their viewport) I wish would die in a hurry. I'm not a UX/UI guy, but it feels like terrible UX/UI.

I am a UX/UI guy, and I wish it would be used properly. What a lot of parallax sites like to do is mess with the scrolling of the page. ("Scrolljacking" is a term I've thrown around for stuff like this.)

Don't do that. Ever.

The user should always be able to scroll normally and not have their browser screen clunking along because they're not scrolling at a speed that is optimal for the animations at hand.

Here's a decently bad offender for a visual of what I'm talking about: http://www.apple.com/mac-pro/ (After the initial animation, try scrolling down--it's not as easy as scrolling should be.)

Re: A grouped pure CSS parallax demo

#15

Post by untog » Tue, Oct 21, 2014, 4:02 PM UTC

nkozyra wrote: post #11

This is one recent design trend (along with the windowed images that scroll through their viewport) I wish would die in a hurry. I'm not a UX/UI guy, but it feels like terrible UX/UI.

It's open to abuse (hiding content until it's scrolled to, usually) but the actual visual idea of it is fine, as far as I'm concerned. Just don't try to communicate the main purpose of your page with it.

Re: A grouped pure CSS parallax demo

#16

Post by jnem » Tue, Oct 21, 2014, 4:17 PM UTC

dave5104 wrote: post #14

nkozyra wrote: post #11

This is one recent design trend (along with the windowed images that scroll through their viewport) I wish would die in a hurry. I'm not a UX/UI guy, but it feels like terrible UX/UI.

I am a UX/UI guy, and I wish it would be used properly . What a lot of parallax sites like to do is mess with the scrolling of the page. ("Scrolljacking" is a term I've thrown around for stuff like this.) Don't do that. Ever. The user should always be able to scroll normally and not have their browser screen clunking along because they're not scrolling at a speed that is optimal for the animations at hand. Here's a d…

Wow,you weren't kidding, that's unforgivably bad, especially for the "UX Gods" at Apple.

Re: A grouped pure CSS parallax demo

#17

Post by fullofcrap » Tue, Oct 21, 2014, 4:26 PM UTC

neya wrote: post #12

Some people here have commented that this is terrible design trend. I disagree. I would say this depends a lot on the use-case :) [shameless plug] I've used (almost) the same effect for my landing page for my upcoming film: http://salesmanfilm.com/ (P.S: Scrolling might be choppy on Retina MBPs/slower configs)

You've created a nice showpiece. However, it's still a horrible design trend, and it's probably the work user experience element I've seen used in recent years. This is the equivalent of the animated gifs of the 90's. Under construction and dancing baby being the most common. Adding distraction rather than focusing on content has never been a successful strategy, and I hope it never does.

It will course correct eventually. I'm hoping sooner.

Re: A grouped pure CSS parallax demo

#18

Post by TD-Linux » Tue, Oct 21, 2014, 4:28 PM UTC

0x0 wrote: post #2

Unfortunately, on iOS the scrolling feels very fake with no native easing. Does it have some sort of javascript hijacking scroll/swipe events?

Works OK on Firefox OS. The base layer scrolls perfectly, but the other ones update at a lower framerate. Desktop Firefox has the same behavior when APZ is enabled.

Re: A grouped pure CSS parallax demo

#19

Post by ntaso » Tue, Oct 21, 2014, 4:29 PM UTC

nkozyra wrote: post #11

This is one recent design trend (along with the windowed images that scroll through their viewport) I wish would die in a hurry. I'm not a UX/UI guy, but it feels like terrible UX/UI.

It is especially terrible, if you use your mouse wheel to scroll and not a swiping gesture on a trackpad. Parallax just looks horribly with a mouse wheel.

Re: A grouped pure CSS parallax demo

#20

Post by ntaso » Tue, Oct 21, 2014, 4:30 PM UTC

romanovcode wrote: post #13

nkozyra wrote: post #11

This is one recent design trend (along with the windowed images that scroll through their viewport) I wish would die in a hurry. I'm not a UX/UI guy, but it feels like terrible UX/UI.

I think it's already dying. I see less and less parallax sites whereas two years ago every startup had their site as parallax. :)

I tried to buy a theme from themeforest and it's extremely hard to fine one that is NOT completely polluted with CSS animations and parallax effects. I wish you were right, but just from the top-selling themes of marketplaces like themeforest, it seems that the trend is still quite big, unfortunately.