https://bit.ly/3G8s79i 👈 Learn UI/UX Today. Use “LAUNCH” for 15% Off!
— Today, I’m going to examine 7 fantastic websites to identify a key trend that I think we’ll see more of in 2022. Let’s just say, it has to do with movement!
0:00 – Introduction
0:25 – Learn UI Design
1:06 – Example 1
3:55 – Example 2
5:06 – Example 3
5:45 – Example 4
6:32 – Example 5
7:05 – Example 6
8:29 – Example 7
9:19 – Final Thoughts
Let’s get started!
#ui #trends #2022
– – – – – – – – – – – – – – – – – – – – – –
Subscribe for NEW VIDEOS!
Learn UI/UX: https://designcourse.com
My personal FB account: http://fb.com/logodesigner
Coursetro FB: http://fb.com/coursetro
Coursetro’s Twitter: http://twitter.com/designcoursecom
Join my Discord! https://discord.gg/a27CKAF
^-Chat with me and others
– – – – – – – – – – – – – – – – – – – – – –
Who is Gary Simon? Well, I’m a full stack developer with 2+ decades experience and I teach people how to design and code. I’ve created around 100+ courses for big brands like LinkedIn, Lynda.com, Pluralsight and Envato Network.
Now, I focus all of my time and energy on this channel and my website Designcourse.com.
Come to my discord server or add me on social media and say Hi!
source
Would you like me to provide a video with how to integrate all of these types of trends in the frontend?! Thumbs up and COMMENT this post!
I got suggested PixieJS a lot for this kind of content, but there aren't that many guides or walkthroughs to start off with
How's the conversion rate on these websites though, I've seen basic sales pages doing crazy numbers without all of this design work.
What's that font reveal extension?
Does anyone know of a good tutorial on how to do Example 4's text/animaiton on scroll (specifically the Snap – Click – Built part)
Loved the last one especially
really like those example, and wanna know how to do it.
lol Apple has that on website for years now
Thanks for reviewing the site for Niarra Travel, my team (Superhero Cheesecake) and I made it. Fun to see it from someone else’s perspective! Cheers.
All of this superfluous eyecandy trash has no future, the full circle draws ever closer and direct information out and input will reign once more 🙂 .
I'm interested in knowing what kind of tradeoff this sort of website make in their mobile layout(compared to the fanciness of their desktop presentation)
Oh how I hate scrolling through these animated websites. They are slow, make me feel dizzy and absolutely unnecessary.
Jesus man, such an expert but has no idea what vignetting is – "those dark shadows in the corners".
– some design expert 2022
How many can build these experiences in Elementor without custom code? I think we need more scroll/mouse animation settings in Elementor.
It's all about knowing your consumer base and what devices they most frequently use. Hyperframe nailed it. The use of animation shows how their product works. The functionality of the site works well on mobile, too.
TBH, what a lost BS mate. These nothing but gimmicks to increase difficulty of production to present banana message.
I like the animation and techniques gone into these websites, but I HATE using these websites. From a user experience perspective all these do is take away my control in favour of animations/slow scrolls that doesn't add to my experience past the first time, and doesn't add value to the content. I'd only use something like this on pages I expected to have a high rate of new users and not returning users, or as a landing splash that funneled into a normal page.
As some mentioned, there is happening to much on this website, people like it simple and clean like Apple for example. And those fancy animations deoesnt look the same when it comes to responsive design.
6.9k likes, noice
Would be interesting to see if these pages are working well on phone too, specially when most of people nowadays access sites with mobile device. Looks really good on desktop tho! ☺
Thank you for sharing
Awesome stuff! The funny thing: with tools like Webflow I kinda know how to achieve these effects in development stage but in design stage – which in theory should be the technically "easier" part – I have no clue how to communicate these onscroll animations to the client, because Figma and alike are not able to do this. Any ideas? 🤔🤔🤔
There is always so much negative space and scrolling in design now, I don't really like it and find it very hard to read and navigate conceptually. And seeing that animations are more popular worries me a bit too. I wish there was just a little bit more of a nod to those periodical style retro websites with static hubs and condensed typographic flow. Tighten it up a bit and be less afraid of uniform type paragraphing. My company recently updated their site to the kind of style in this video and just about nobody actually likes it some time in, especially new site visitors. It's fun gimmick and at first beautiful to look at, but the navigation and routine usability was gutted in favor of style. People gotta change out scroll wheels like tires now.
I hate so muuuch those pages, they are nice 1st time you visit them. Then when you looking for information this is just annoying to find anything over those pages. Often thera are no hooks into content that I could link some one etc :/
Scroll based animations look trash. They are incredibly skillful but unless the user is scrolling consistently across the site, they often impact UX in a big way. They are fun to look at from a website critique perspective, but as an end user I detest them.
What about Mobile First or even Mobile Only???
1:33 – a vignette?
Love the hair Gary!