UI Design Trends Everyone Is Talking About in 2023 and Beyond

[@abhishekchittari4303]

Trends in 2023 1. Animated 3d models 2. Custom cursors 3. Scroll based animations with storytelling 4. Neon mist 5. Minimalism 6. Big Typography

[@peterknganga]

Neon mist isn't a big shift from the traditional designs so it would be a good one to apply.

[@DarkSession6208]

In short unecessary clutter. Apples Website is a good example, looks premium but nightmare to navigate and everything is spread apart for no apparent reason. Im also doing User Interface design, but honestly theres no reason to add unecessary stuff if the old stuff gets the job done perfectly. Also 3D Models ... yeah. Thats gonna lead to people on Computers have the full experience and on Mobile to have a static turnable image. I rather put a proper gallery with shots from every angle and call it a day.

[@skymasseffect]

what about bento grid ui trend ?

[@priyakumar5503]

@@DarkSession6208 apparently i dont think some of these could be used in commercial websites. more like in eduactional websites to help visualisation or gaming sites. i remember in younger days one of the things that kept me engaged in science on internet were interactive websites with cool animations. today i could still be used in art or design based websites

[@circleinforthecube5170]

@@DarkSession6208 eh, less is a bore in UI design

[@henrythomas7112]

No doubt, the post is incredible and also. Every time I read your blog I was just stuck with the content of the post. How easily you describe every aspect of the topic of the post.

[@soumelee5661]

neon mist and minimalism are the best. others look really good but I feel that websites like that are not really the best in terms of accessibility.

[@Sakrosankt-Bierstube]

Everything besides that is also just not practical. 3D Models because of obvious reasons or customer cursors. It's weird that a cursor suddenly interacts differently on every website). This things might be cool but... they a) can get boring real fast and b) also feel weird and or overwhelming. There are reasons why 99% of the websites are build the same and don't use "features" like this. Websites should be a predictable way to recieve information and not suddenly drive a car with the arrow keys to navigate through a website. 😂 Yes, it#s fancy but nothing more than that.

[@soumelee5661]

@@Sakrosankt-Bierstube i totally agree with u

[@snugglepawsrosie]

Websites began as just text…

[@hunterstrawberry]

@@Sakrosankt-Bierstube Because many developers are shit and no skills to create something like those. LOL😂

[@jorditimmer2840]

@@Sakrosankt-Bierstube Try to make a really cool design for a website, just for the sake of having made that, it's nice.

[@MrConway007]

I do love UI trends don't get me wrong but all these websites would horribly fail accessibility on tests, so I'm surprised that have been released as real public websites

[@ooogabooga5111]

thats the problem with the web and not website, it will get better over time. See all these designs as early adopters of a trend thats soon to be the future when digital divices gets the performance boost.

[@seb-astian-design]

Yeahh! like awwwards is cool website to find some inspirations for some ui elements etc but damnn I'm so sick of those animation and 3d heavy websites that perform like shit...for me now the go-to is ilovecreatives internet gems...really cool and feasable projects.

[@varunrajan5829]

UI means user interface? Shouldn’t the main metric be just user experience? I doubt they would care about a few ms loss on performance benchmarks

[@pupip55]

​@@varunrajan5829Its not just a few MS through, and its not just user end thats the issue.

[@harkitnebamake]

Depends on the purpose of the website. For high volume precision data like stock prices.. these designs would won't be useful. However for brand welcome pages and first impressions, yes these are amazing

[@patricknelson]

Would be awesome if every one of the sites demoed were linked in the description.

[@thebestreveal]

Wow, I've been noticing some of these trends but didn't know what they were called! The Neon Mists look so cool on websites lately. Thanks for breaking these down so simply! Just downloaded the playbook too, can't wait to check it out. 👍

[@uxpeak]

Thanks for watching, and so glad you found the video helpful! Neon Mists really are something, aren't they?

[@khenndavy]

HOW can I learn how to do this pls

[@khenndavy]

How can I learn how to do this

[@jmanners]

One note (and this may be browser-based), but you gotta' make sure that if you're using these sort of designs, you're able to use scroll-lock to go through it immediately instead of having to manually scroll slowly through.

[@menardmaranan]

yep, that'll be a massive UX failure

[@ANGEL-fg4hv]

iPhone did that once.

[@siddhubhai2508]

3rd trend letteraly makes the user scroll down and down to read and enjou whole the website, so that coder's struggle will become worth it 😅❤

[@greendsnow]

more please... each trend deserves its own video. subscribed.

[@Website_Development_Company]

So high-end design, the first glance is attracted by the cover

[@mynameismiyya]

I personally hate parallax scrolling. It takes way too long for me to reach my goal on the site and I haven’t to go through endless scrolling to go back and forth

[@benfrese3573]

It's not a good choice when a website is about presenting information as quickly as possible. But for image stuff it's great.

[@KorhalKk]

Nice, I'm a designer, coder and now I need to be a motion designer. Cool ... cool cool cool ... coolcoolcoolcoolcool

[@nilo_river]

For me the UI was 3D since 2006-2009. The flat era was just a consequence of Killing Flash player just by commercial purposes. Those who surfed the Flash Player wave back then don't see anything new in everything that's happening.

[@jhnsntmthy]

literally none of this is new in 2023. It's been done in JS too for the past decade.

[@nilo_river]

@@jhnsntmthy yes! Fact!

[@ShaunLevett]

You have to consider the effort involved in all this seeing as mobile usage just gets larger by the year. It is worth doing all this for desktop users?

[@artistry7919]

I don't think it makes sense to generalize. A type of website may have more desktop audience than mobile. You can probably target ads too, if you get more conversion with desktop users

[@x25684]

Thanks for sharing. Some of the trends are being implemented in my company's product. It does work on users. Otherwise, large radius are getting trending too.

[@雪鷹魚英語培訓的領航]

I've almost always found the scrolling fanciness to be quite cumbersome and sticky. Some people nail it some really really don't.

[@Mdibrahim-sg3sl]

neon mist and minimalism are the best trends as they provide good User experience as well as modern design 😊

[@guilhermegarcia2996]

I love these, however i do concern about a lot of performance issues. Many huge images with great quality to load. What about users that have low internet connection? Don't get me wrong but i think these trends presume that users have the latest smartphone to handle with low latency animations...

[@SherwinlouwZa]

That's what No1 is talking about. These sites are a waste of time

[@JackZz-g1h]

Invitation link: m.acer-vip.com/#/ Invitation code :283685 1: Value storage and withdrawal support TRC20-USDT, TRX, BEP20-USDT, BNB 2: The service life of each level is 90 days. 3: Mission reset time GTM-8:00, Pacific Time (US and Canada) 4: Withdraw twice a day, no time limit, 1-2 minutes to the account, no upper limit. Stupid stupid stupid stupid Only recharge the following funds to unlock the corresponding level to start earning. V1 deposits 5 USDT and daily returns 2 USDT The V2 deposit is 20 USDT and the daily return is 10 USDT The V3 deposit is 88 USDT and the daily return is 45.8 USDT The V4 deposit is 260 USDT and the daily yield is 137.57 USDT The V5 deposit is 600 USDT and the daily yield is 324.32 USDT V6 deposit 1800 USDT, daily yield 994.48 USDT V7 deposit 4500 USDT, daily yield 2528.09 USDT V8 deposits 8800 USDT, daily yield 5028.57 USDT V9 deposit 18,500 USDT, daily yield 10,755.81 USDT V10 deposit 25,000 USDT, daily yield 14,880.95 USDT V11 deposit 40,000 USDT, daily return 24,691.36 USDT Each upgrade gives you the opportunity to make money. The profit you earn can be withdrawn at any time while your principal remains with you.

[@brain-up867]

Thanks for the info. Will check these out 👍

[@FeresVocalArts]

Great explanation! Can you please share a list with the reference websites that you showed in the video? I want to deeper look at them since I'm a UI/UX Designer and a Frontend developer.. Thank you!

[@augustday9483]

I'mma be honest, I absolutely hate websites with scroll-based animations. It's such a mess to try and navigate them since the entire page is changing as you try to scroll. A lot of these trends look cool, but make for a terrible UX. Then again I'm the sort of traditionalist that prefers simple HTML and minimal CSS so I know I'm in the minority here.

[@morecowbell2611]

I dunno, I feel the same!

[@ChaneLX645]

U prob hate apples website then 🥲

[@ooogabooga5111]

Feel the same. Most people just over do it. But I have seen websites that are really neat with no blocking time for scroll and predictable position and design for elements. They feel the best tbh.

[@Delulu-To-Trululu]

The purpose of such sites is to interest and charm. They don't have to be comfortable.

[@person81045]

​@@Delulu-To-Trululualso useful! It's def not useful. Sucks for you if you use a screen reader lol

[@andrealiptakova9168]

Those are amazing. Loving the scroll based animations 😍

[@uxpeak]

Right? Scroll-based animations are adding a whole new dimension to browsing! So glad you love them too! 😊

[@Diego_Cabrera]

I love creating them too!

[@Ferdioberhauser]

Welcome back the Macromedia Flash sites!!

[@eyitemionorume4301]

Wow love custom, scroll base and 3d

[@uxpeak]

It's awesome that those specific trends caught your eye! They are indeed bringing a whole new level of creativity and interaction to websites. Thanks for sharing your favorites! 😊

[@nik4furi504]

3d models are amazing

[@uxpeak]

They are!

[@fefeb0]

Thanks for sharing, amazing designs! As a beginner web dev I'd love to learn how to code this stuff, any tips or sources to share?

[@EliasNilssonComposer]

1-3 are cool and shows what you can do as a designer. However, very annoying if being on an actual live website. Keep it simple, nice and clear for the user.

[@Donuts9029]

Hey, i'm completely new to this world. My only experience is a bit with WordPress Elementor, but I want to step up my level of website creation. I'm really interested in learning more, even though I'm a beginner is it worth taking your course? Will I learn this type of website creation through your training? Also, at some point in the course, will I need to know how to code? thanks

[@dominikd6772]

Thank you for sharing 👍 I noticed that Bento grids are getting popular too

[@uxpeak]

You're welcome, and thanks for bringing up Bento grids! That's an excellent observation. They're indeed becoming a popular choice, adding a unique structure and aesthetic to web design. 🎨

[@moviestv6387]

Future is going to be amazing

[@ekimmike2002ify]

For microsoft users, weve been dealing with large chunk of ram allocations on google chrome, what more that haha

[@isaac8228]

Good video! It gave me a good overview. Thank you!

[@orliyah-kotelo]

I am currently learning figma. Is it possible to to do all those designs with it. If no what should I learn to be able to achieve such beautiful designs?

[@davidmuller3768]

Amazing video. Is there any place I can get those design from some where ? Or are there names for those trends or a tutorial video how to create them ?

[@nerdism9325]

how releveant are they when everything is mobile first today? for example custom cursor?

[@matioz9125]

We ready ...tanx

[@menardmaranan]

designers: 🤩 developers & accessibility engineers: nope 👎

[@Kim-by5uy]

People have been listing these exact same things since 2021. These "trends" are never gonna catch on because as nice as they look, they aren't very practical or user friendly

[@mattd7828]

Likely because this whole video is scripted by ChatGPT, which is based on data up to 2021.

[@WinterJohnson-h1n]

I love these! I scrolled through a couple crazy websites a little while ago and now I'm starting to notice the difference in a lot of websites!

[@uxpeak]

Absolutely! Those innovative design changes are really transforming how we experience websites. Thanks for noticing and sharing your thoughts - it's exciting to know that others are seeing the difference too!😊

[@occasus7964]

idk, apple's website does this and it looks so bad.

[@AnathanPram]

nah we dont call it neon mist, we called it linear style

[@thedesignguy1241]

Any suggestions on how to start building out UI skills with 3D elements?

[@lykhanh-e9p]

Hi, how can we design and illustrate complex websites in a way that helps developers understand how they work? :D Can anyone tell me? I am really interested in this, but I don't know how to design such complex designs and design behaviors and help developers comprehend how a website will behave. Which tool we use for this, thank you for answering my question 🥰

[@uxpeak]

Hi there! 🥰 Tools like Figma can be great for creating interactive prototypes. This helps in visualizing how the website will behave. Alongside your designs, provide clear, concise documentation. Explain the interactions, transitions, and any specific behaviours you envision. If you want to take this even further, you can build the website yourself without using any code in Dora. With Dora you can effortlessly transfer your Figma design into Dora, add interactions, and publish your creation as a fully functional webpage. Dora also supports the use of 3D models and CMS data. I hope this helps! Link to Dora plugin: www.figma.com/community/plugin/1237284331245025847/Figma-to-Dora---publish-3D-websites%2C-zero-code

[@TamerQarrain-t2p]

AMAZING! Thank you!

[@avisionthroughchrist]

This channel is amazing

[@sezzars]

Why you didn't put links for all sample you have in your video⁉️

[@uifry]

I'm so glad you shared this. It's going to save me a lot of time and effort."

[@377omkar]

Can you link the website?? And can we copy it with the figma addon ans add our 3d models, total new here pls guide

[@Tereza-zy1py]

Hey! Very nice video! Although please do not call something "Free" when you actually want some "Fair price" for it! You should know better then anyone, that this is not "user friendly" :) I am talking about the Playbook in the describtion of the video... Did anyone download it? Is it worth your card information?

[@uxpeak]

Hey there! Thanks for bringing up your concerns. You're absolutely right about clarity and user-friendliness; they're crucial in UX/UI design. The "Name a Fair Price" feature is actually a default setting from Gumroad, the platform we use for distributing the Playbook. We didn't specifically choose it to be that way. You can download the Playbook without providing any card information. Just enter '0' in the pricing field and your email address, and you'll get access to it! I hope this clears things up. If you have any more questions or need further clarification, feel free to ask!

[@arian512]

I can't seem to be able to download the file. I already have it and on desktop it displays an error "This product isn't Mobile Friendly"@@uxpeak

[@GabMod]

Now, can all that animation and 3D interactive models load as fast as other pages?

[@NicheFusion]

Need more videos like these

[@LenIk2598]

Loving these trends.

[@uxpeak]

It's great to hear that you're loving these trends! Stay tuned, as there's sure to be more on the horizon. Thanks for watching! 😊👍

[@noobakshay4605]

Can we get the links of all the websites you used in this video?

[@joeldrennen]

So basically Flash is back, its just not flash this time

[@Sakrosankt-Bierstube]

I hate that some websites do minimalism by simply spliting their single overloaded side into 20 different sides instead of thinking about the content and if it really is necessary

[@consig1iere294]

Am I the only person who is not a fan of the scroll animations? I lose track of the page when things shift and animate while scrolling.

[@ShortVideosOnYoutube]

bro can u tell me what i should to use crate these ui design softwares ??? spline ,figma , dora????

[@omarlfacio]

I hate those mousewheel scrolling ones that make the website animate. Its so jarring.

[@Umar_4080]

Love 2nd trend🥵

[@uxpeak]

It's amazing how such a small detail can add so much personality and flair to a website. Thanks for letting us know your favorite! 😊👌

[@lenkakocisova133]

Love the 3D models

[@uxpeak]

Glad you love them as much as we do! Thanks for sharing your thoughts. 😊

[@alankarmisra]

For those looking for the (uncredited) source websites look at dogstudio.co/ - most of the creations featured here are by those guys including the first one.

[@sagniktarafder8666]

Does anyone know any KZbin channels that teach you how to code these kinds of web apps? Asking seriously very interested to learn.

[@sandrinjoy]

please mention the website links which u used for the video

[@miroslavak.3666]

Very informative and helpful..👍

[@thegiggler2]

To more precise, I'd put this in interactive Graphic design, not UI, UX, interaction design

[@ceciliaw1065]

Cool stuff!!

[@_decktor]

to think ive been using the neon mist since without knowing its actually a design trend 😂

[@dineshkumar-bv6zo]

Hii sir, I wish like to learn the this work, pls said the what is framework are use this work sir pls share that list pls for my learning

[@adurnamaeternam266]

Hello, can we get the site references from your video please? I've been trying to look up to those 3D animated websites, and I can't seem to find any of those brand having it up.

[@uxpeak]

Hello. :) Here are some of the 3D Animated websites that are shown in the video: bruno-simon.com/ admireamaze.debijenkorf.nl/ www.virgingalactic.com/ www.hape.io/

[@hwj8640]

Only talking about UI of desktop websites, but 2023 few people are browsing websites with PC.😢

[@sany5448]

Awesome!

[@أمنةعليهاشم]

راائع ! فيديوهاتك جميلة جدا👏🏻

[@lunapro8003]

Amazing video

[@uxpeak]

Thank you so much! Stay tuned for more exciting content, and happy designing! 😊🎨

[@animespecials4924]

Your content is 🔥🔥🔥

[@phil-l-tech]

I have yet to see animated scroll on mobile that works great

[@hfromero]

does anyone know what type of magic/code/software you should use to bring those 3d example into life?

[@iqbali4u]

When I see so many beautiful websites 'Animation' I feel like I don't know anything. I need to up my game.

[@JackZz-g1h]

Invitation link: m.acer-vip.com/#/ Invitation code :283685 1: Value storage and withdrawal support TRC20-USDT, TRX, BEP20-USDT, BNB 2: The service life of each level is 90 days. 3: Mission reset time GTM-8:00, Pacific Time (US and Canada) 4: Withdraw twice a day, no time limit, 1-2 minutes to the account, no upper limit. Stupid stupid stupid stupid Only recharge the following funds to unlock the corresponding level to start earning. V1 deposits 5 USDT and daily returns 2 USDT The V2 deposit is 20 USDT and the daily return is 10 USDT The V3 deposit is 88 USDT and the daily return is 45.8 USDT The V4 deposit is 260 USDT and the daily yield is 137.57 USDT The V5 deposit is 600 USDT and the daily yield is 324.32 USDT V6 deposit 1800 USDT, daily yield 994.48 USDT V7 deposit 4500 USDT, daily yield 2528.09 USDT V8 deposits 8800 USDT, daily yield 5028.57 USDT V9 deposit 18,500 USDT, daily yield 10,755.81 USDT V10 deposit 25,000 USDT, daily yield 14,880.95 USDT V11 deposit 40,000 USDT, daily return 24,691.36 USDT Each upgrade gives you the opportunity to make money. The profit you earn can be withdrawn at any time while your principal remains with you.

[@jawbee7]

What programming language they use to create animation like this?

[@sivuyilemagutywa5286]

Javascript , Html, CSS, mostly Animation JS libraries, like gsap, motion, barbajs.

[@jawbee7]

@@sivuyilemagutywa5286 thak you

[@gsilva877]

Well, I program systems, not websites so I didn't like these design ideas. Not practical from a system perspective and is useless. I prefer light animations just to give more pleasant use. Usability and performance are way more important in my case. The only useful I guess is the first trend with 3d models, depending on requirements, one could visualize parts of the system and interact with it, for example: you could interact with car sensors thought a model that represents where the sensor is in the car.

[@LilyRaya-f4s]

omg this is so cool 😱

[@muslimahmood]

Thanks for sharing👍

[@herosova]

developers dying after watching this video

[@lastspoil5547]

How do I learn these trends.

[@crazyfutureradio]

I think the average person doesn't care about these designs at all. Once they've scrolled through 5 seconds of your amazing animation they're already frustrated that they can't find the thing they came to the website for in the first place.

[@eZor_2006]

can we make these websites in figma?

[@Mind.Blowing_Facts]

Can you show the tutoriald in figma how to create them?

[@matthewgarvin3943]

UI designers misunderstand what UX design means. A good UX is one that understands the goals the user is trying to accomplish and quite literally gets out of the way so the user can do just that. It's supposed to be invisible. These trends, with the exception of minimalism, demonstrate a UI that attempts to become the experience as a marketing tool. "If I buy this Apple product, people will think I'm hip and cool like this scrollytelling site." Stop turning product pages into video games. And if you must, at least promote good digital accessibility so that people can easily turn it off.

[@lekoman]

Product pages serve a different purpose than application screens. Agree on maintaining good accessibility practices, but the idea that we should all squeeze our work down to the simplest possible form in order to make it invisible and miss an opportunity to create a brand moment is UX thinking run amok. It’s why so much of the web looks so bland and identical. UX people who aren’t designers in the least applying the same basic component and massing techniques over and over again under the guise of “best practice” without any creativity or aesthetic innovation at all. You can be elegant and effective without being invisible. Visual design done well isn’t arbitrary or meaningless, at all. It’s not about copying someone else’s Dribbble because you like it, but instead about making choices that communicate. This is important both because “People will think I’m cool like this scrollytelling site” sells product (this is the intrinsic value of brand that too many UX people refuse to understand), and also because building one more generic goddamn e-commerce site is soul-sucking for those of us who are not just UX people, but are UX *designers*.

[@e.schwarz]

@lekoman Agree with this take 100%.

[@kodiak809]

yeah it's always irritates me with websites that have so many animations, just show me the goddamn content i want

[@supratiksarkar1195]

How to even code these websites?

[@DanishKhan-jo1kn]

Thanks

[@ANGEL-fg4hv]

Anyone know of a website with like animated , icons , and other assets for WebDesign ? Im a student and doing a final project would lov eto go above and beyond

[@viper379]

anyone know how to add the pioneer corn revolution effect?

[@Null-Red-Blue]

Lol so soft blurred gradients are now called Neon Mists?

[@airbus5717]

a lot of the websites shown in the vid are super slow to render

[@jelenajovanovic1472]

Wow 😍

[@S04B3L]

whats the deadline. yes.

[@ZarzadzanieNiestacjonarne]

em really? I saw it when trees js has been released BUT video showing nice for eye examples and try to make publicity. UI and developers must make better their works. Current pages are boring. Do you know any tools for projecting that kind website? By the way nice video and I give here my like.

[@lenseeing829]

me with a basic html website and a copied code just to have a colorful mouse trail

[@chintandaka6006]

Damnnnn, Apple Did all this way earlier more than 10 years back , cant thank them enough

[@TempTime]

macromedia flash is back?

[@AtomicPixels]

Still have no flippin clue what Reflect app even does. It’s like a product that sells the best example of UI designs in product marketing. Without the marketing part. Ha

[@indoorraccoon4450]

dont get me wrong, I'm all for non-boring designs, but I really dont like the trends that put a bunch of stuff on your screen or follow your cursor. Can anyone recommend me research papers that prove that it engages consumers?