31–40 of 43 posts
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.
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…
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)
I would consider redesigning it.
Earlier quoted context omitted.
An example of Apple doing parallax right is the new iMac page: http://www.apple.com/imac-with-retina/ At least the top image effect is very well done IMO and does a very good job conveying the central premise of the new iMac: looottts of pixels. Having said that I really dislike what happens lower on the page where the iMac image stays pinned on the left and the descriptions scroll normally on the right. It's totally…
The pinning is actually buggy: it pins the Mac to the wrong vertical offset when you scroll past the threshold the pin hits. At least on Chrome on my Macbook Air it does, anyway. Maybe it works correctly at other resolutions or browsers. So not really "parallax right" if you're counting the whole page from top to bottom. I like the images a lot though, they're very nice.
Earlier quoted context omitted.
This is a good example of it done extremely well, also from Apple. http://www.apple.com/imac-with-retina/ It's even more impressive when you inspect it and see how it's done.
How is it done? I see a couple of css transitions but there must be some js involved as well?
Earlier quoted context omitted.
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…
An example of Apple doing parallax right is the new iMac page: http://www.apple.com/imac-with-retina/ At least the top image effect is very well done IMO and does a very good job conveying the central premise of the new iMac: looottts of pixels. Having said that I really dislike what happens lower on the page where the iMac image stays pinned on the left and the descriptions scroll normally on the right. It's totally…
Earlier quoted context omitted.
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…
An example of Apple doing parallax right is the new iMac page: http://www.apple.com/imac-with-retina/ At least the top image effect is very well done IMO and does a very good job conveying the central premise of the new iMac: looottts of pixels. Having said that I really dislike what happens lower on the page where the iMac image stays pinned on the left and the descriptions scroll normally on the right. It's totally…
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)
I didn't notice the effect until I scrolled back up and saw a jerky movement in the buildings. Then tried scrolling back down and up not getting it to work until I noticed it moved with the mouse movement not the scrolling. I would consider redesigning it.
Earlier quoted context omitted.
This is a good example of it done extremely well, also from Apple. http://www.apple.com/imac-with-retina/ It's even more impressive when you inspect it and see how it's done.
How is it done? I see a couple of css transitions but there must be some js involved as well?