The effect on the Universe landing page is very smooth (onuniverse.com)
over 8 years ago from Luke Beard, Creative Director and Co-creator @ Exposure
over 8 years ago from Luke Beard, Creative Director and Co-creator @ Exposure
I regard Canvas as magical wizardry because I don't understand it... yet.
I really dig that intro blur animation. Thanks to the makers, I learned something new. If I were them, I would use webkit-blur or svg blur filter which would be slow and not a cross-browser solution.
However, they used the app Phosphor to convert prerendered video to a specific image sprite sequence with a smaller file size so you can see whole animation is done by thesethreeimages.
Exactly right! We could totally try to get a similar intro animation in other ways, but we were pressed for time. I would love to do it using elements right on the page.
The main goal with doing it this way was to make sure it worked with mobile devices that don't autoplay videos inline on a page. This method required slightly larger file sizes, but it seemed worth it!
The rainbow effect on the anchors is nice too.
Not working on FF
Thanks for the heads up! Will work on getting that fixed :)
I also love the temporary blur on hover throughout the page.
I'm curious about the product. Does anyone have any information about it? The website is very vague.
We'll be sharing more soon ;)
looks like a web page for alternative reality game of lost. shady.
How did they made that Join section? Can't reverse engineering the canvas stuff.
If you're talking about mesh, it's done with THREE.js exporting a mesh prepared before. Here is the mesh file Import it, add mouse interaction and begin with a nice zoom out animation. Good stuff.
Thank you very much :)
Cihad has it right! Though it seems to tax the CPU pretty heavily. We're going to experiment with a static mesh image and move it around with JavaScript + CSS to see if we can get the same effect without it costing so much. Previously we were making the mesh shift around whenever you clicked, but since that's not happening anymore we might be able to recreate the effect more simply!
Designer News
Where the design community meets.
Designer News is a large, global community of people working or interested in design and technology.
Have feedback?
Login to Comment
You'll need to log in before you can leave a comment.
LoginRegister Today
New accounts can leave comments immediately, and gain full permissions after one week.
Register now