Web & UI Design Trends for 2024

Поделиться
HTML-код
  • Опубликовано: 20 май 2024
  • In this video, we explore the upcoming web and UI design trends for 2024 including dimensionality and layering, 3D elements, complex animation, vibrant color and gradients, AI imagery, dark mode, Bento grids, morphism, massive typography, and the rise of no-code builders. These trends are set to revolutionize the way we design and interact with digital interfaces.
    Stay ahead of the curve and gain valuable insights into the future of web and UI design by watching this video. Don't miss out on the opportunity to enhance your design skills and create visually stunning and user-friendly experiences.
    .. Remember to Subscribe goo.gl/6vCw64
    ------------------------------------------------------------------------------------
    🤝 //////////// Become a UI Designer in 30 Days:
    30dayui.com
    🏆 //////////// Join my free member's community to get access to perks:
    designchamps.io/
    ------------------------------------------------------------------------------------
    🎨 ////////// I Design in Figma
    psxid.figma.com/ixbomhqzoiy0
    🖥️ ////////// I Prototype Magic in ProtoPie
    www.protopie.io/plans?ref=jesse
    🖥️ ////////// I Build websites in Framer
    framer.link/jesse
    📅 ////////// I run my life with Notion
    affiliate.notion.so/tokendsfahjf
    🎵 ////////// Take your films to the next level with music from Musicbed. Sign up for a free account to listen for yourself: fm.pxf.io/c/1372011/1347628/1...
    Timestamps:
    00:00 Intro
    00:27 Trend #1
    01:13 Trend #2
    01:57 Trend #3
    03:07 Trend #4
    04:01 Trend #5
    04:59 Trend #6
    05:56 Trend #7
    06:49 Trend #8
    07:37 Trend #9
    08:21 Trend #10
    #webdesign #UIDesign #DesignTrends #2024

Комментарии • 73

  • @briannhinton
    @briannhinton 4 месяца назад +51

    I hope my fellow designers remember that too much motion can cause issues for many ranging from migraines to like myself nausea. Create those animations but pass it on to your developers to respect reduced-motion platform settings.

    • @muhammadpaksi7215
      @muhammadpaksi7215 4 месяца назад

      Lol, unless the developers earn proper salary. 😂

    • @mr.fanstastic9010
      @mr.fanstastic9010 3 месяца назад

      not just , too much of artistic freedoms and purple colors can course migraine

  • @pixlmyst
    @pixlmyst 4 месяца назад +21

    As a developer, the no code tools frustrate me.
    Many of my clients use them before realising that they are fine if you just want to get to an end product with your desired aesthetic. However, they often run into roadblocks when they want to create a performant website that hits all the coding standards required to take it to the next level.
    I literally spend half my time needing to explain the value of developing a website by hand.

    • @muhammadbacar6051
      @muhammadbacar6051 4 месяца назад

      As a Designer I agree. No code tools should be mainly used for portfolios, showcase marketing websites, landing pages and maybe to an extent e commerce websites. But for the other types of websites a developer is needed. nevertheless I believe that no code tools might try to become a tool that creates a better collaboration with designers and developers. Wix Studio for example is trying to do that.

    • @maskedvillainai
      @maskedvillainai 4 месяца назад +2

      I mean, you’re comparing your knowledge as a dev to the ability of a tool. Knowing how to code as a developer equates to == whatever you want to code. It’s your knowledge as a tool. As No code tools are very focused on a task, they can’t really be compared with the ambiguity of ‘code something’. The only no code tools I use as a dev are FlutterFlow and DraftBit

    • @wfwfwfwfwfwf
      @wfwfwfwfwfwf 4 месяца назад

      I love Webflow and have started building more and more client websites in it, but I would never let the client touch the Designer... There's a different login for them to update content that I've designated them to alter. A developer learning the principles, up- and downsides of the platform can really take advantage of the platform, and clients are super happy with the easy way to on-screen edit content, simple billing and no stress of updating plugins... I'm not a super experienced developer though, so the tradeoff is maybe different for me.

  • @tim_longhurst
    @tim_longhurst 4 месяца назад

    Great video and insights. I really appreciate your thoughts and predictions on these topics. I also like how you seem to articulate confidently without constant video cuts and jumps. Are you using a prompter or cue cards or is it off-the-cuff. Either way, it's great to see clear, confident explanations delivered at a great pace and not overwhelming. Thanks as always for sharing :)

  • @OhmVibe
    @OhmVibe 16 дней назад +2

    00:27 Dimensionality and Layering (Trend #1)
    01:13 Usage of 3D Elements (Trend #2)
    01:57 Complex Animation (Trend #3)
    03:07 Vibrant Color & Gradients (Trend #4)
    04:01 AI Imagery (Trend #5)
    04:59 Dark Mode (Trend #6)
    05:56 Bento Grids (Trend #7)
    06:49 Morphism (Trend #8)
    07:37 Massive Typography (Trend #9)
    08:21 No-Code Builders (Trend #10)

  • @williamjobson3092
    @williamjobson3092 4 месяца назад +3

    Excited by all of these things - gonna rewatch more than once to keep motivated!

  • @EM-fz3hf
    @EM-fz3hf Месяц назад

    These are the exact types of styles I was looking for when I get ready to build my Ecom store & now I know how to explain it better. I'm building a niche brand but launching with 1 product & going for the complex 3D visual that animates as you scroll down. Just super luxe & modern looking. Now I have a better vision for the design aspect. This video matches my vision completely.

  • @shirleyxie7144
    @shirleyxie7144 4 месяца назад +3

    Webflow is awesome!!!!!!
    Thanks for sharing.

  • @YarivBE
    @YarivBE 3 месяца назад

    Thanks a lot Jesse. Beautiful summery of things that i guess where already cooking in 23 and now kind of more "officially here to stay" in 24. Good one 🔥

  • @bigplantpapi
    @bigplantpapi Месяц назад

    LESS FRICTION!! Yes, very smart analysis... these all make a lot of sense to me as a 3D architect and graphic designer, thanks for putting these together.

  • @juls2334
    @juls2334 4 месяца назад +3

    Exciting trends for 2024! Thanks for sharing! 🎉🎉

  • @patriciopomies
    @patriciopomies 4 месяца назад

    Love the esoteric prediction's style! THE YEAR OF FUN!!!!

  • @muathsurakji2443
    @muathsurakji2443 4 месяца назад

    Thanks PRO see you in 2024

  • @thewebstylist
    @thewebstylist Месяц назад

    Great vid and highlights sir!

  • @danielavega3739
    @danielavega3739 2 месяца назад +3

    I love how you use amazing examples and not just random pages

  • @robertsimondj
    @robertsimondj 4 месяца назад +5

    I remember when I designed a website with illustrator in several weeks, where is it now...maybe it was a long time, but I really enjoyed the journey to the goal, I found my joy in creativity in the process.

    • @maskedvillainai
      @maskedvillainai 4 месяца назад +1

      Shit man you got a super good memory 😂

    • @svnbit8408
      @svnbit8408 4 месяца назад

      I still think it's a tool that others that "prototype" fail to emulate from speed and handling typography etc.

  • @chadleebryson
    @chadleebryson 4 месяца назад +4

    Great video. Where's mobile, though? Why are designers and these type of trend videos care so much about desktop so much?

  • @henrythomas7112
    @henrythomas7112 2 месяца назад +2

    I extremely like the video, man. Very helpful and informative. Thank you very much. It is presented so well too. Great, positive work.

  • @trvnq
    @trvnq 11 дней назад

    this feels more applicable to expressing yourself via a personal portfolio as opposed to making something that is user friendly and thoughtfully designed. i'm not in the field yet, but i find it hard to believe that users want to scroll through a website with 20 different animations just to achieve the thing they came to the website for

  • @jromecabugwason5140
    @jromecabugwason5140 4 месяца назад

    intro sold me

  • @mrvfino
    @mrvfino 4 месяца назад +1

    As someone who's starting to get into a hobby of creating websites as an artistic medium this adds more fuel to the fire of my desire lol

  • @FrederickHqz
    @FrederickHqz 4 месяца назад

    Less friction, excellent way to put it

  • @renaissauce9516
    @renaissauce9516 4 месяца назад +18

    Am I the only one who doesn't like the bento grid trend lol? I don't know where my eye is supposed to go or which element on the page is most important. Trying to find what I'm looking for takes a little longer.

    • @darkmode_memes
      @darkmode_memes Месяц назад

      bento grid is good for gallery or ads

  • @BleakDeath
    @BleakDeath 4 месяца назад

    Thanks Jesse 👏 😊

  • @nakreid771
    @nakreid771 4 месяца назад +6

    I think the biggest trend in 2024 will keep the same positive attitude like the one u have. I’m tired of listening everyone crying about AI. Just use it in ur advantage and have fun with that. Great videos as always short and informative. Happy Holliday bro.

  • @nicofebrio4821
    @nicofebrio4821 4 месяца назад

    Sir,, can I use Adobe Illustrator for designing the UI and UX and applicate it on real applications? Thank you..

  • @nimakarimi90
    @nimakarimi90 3 месяца назад

    amazing dude

  • @SusanneGeert
    @SusanneGeert Месяц назад

    Great video - thanks for taking the time to create and share this 🫶 As a photographer (branding portraits / products / food) I am very curious to hear what you think is the trend for photographer websites?

  • @konstantinshmarin2676
    @konstantinshmarin2676 3 месяца назад

    Cool! Realy cool bro! Hello from Russia!

  • @Amressefarrow
    @Amressefarrow 2 месяца назад

    Excellent video

  • @AmbientMusicStudio
    @AmbientMusicStudio 21 день назад

    Many of these examples look great on desktop, but how well do they transfer to mobile? It seems like mobile is a lot easier to use if it is flat, minimalist and, well, kind of boring.

  • @rkem1000
    @rkem1000 3 месяца назад

    These design trends may look very slick, but it all boils down to user experience and visibility. Some of these are great for personal sites but might not work in real-world scenarios. Many companies are still adapting old legacy platforms with outdated technologies and design approaches.

  • @XenaK-ti2ej
    @XenaK-ti2ej Месяц назад

    Happy to see Noomo agency, founded by Ukrainian family 😍 on my fav youtube channel

  • @gebbygeb3547
    @gebbygeb3547 3 месяца назад

    Breath of fresh air, really. It's February, yet I was still stumbling on what style I wanna go for this year before seeing your video. Thanks a lot!

  • @yasamankhani3603
    @yasamankhani3603 23 дня назад

    Bento is my favourite

  • @deipty222
    @deipty222 2 месяца назад +1

    Do you have tutorials to teach the complex animations?

    • @JesseShowalter
      @JesseShowalter  2 месяца назад +1

      My new course has an entire section on complex animation www.30dayui.com/

  • @LightsaberPanda
    @LightsaberPanda 4 месяца назад

    I think these trends are pretty accurate. If I was going to add two more trends to this list, it would be implementing AI chatbots in websites as a standard and having accessibility being a must. I know EU has passed a11y laws. It'll be a only a matter of time before US and other countries follow suit.

    • @denistroler8452
      @denistroler8452 3 месяца назад +1

      What does it mean (a11y laws). How will this affect us?

    • @LightsaberPanda
      @LightsaberPanda 3 месяца назад

      @@denistroler8452 In the industry we're seeing more and more product teams having mandates in place to ensure the products we design meet or exceed accessibility standards based on the WCAG guidelines. So if you have a beautifully designed app or website and it doesn't meet A11y standards, you may have to redesign it and trade off beauty for inclusivity for users that have disabilities. This also protects the companies from getting sued for being inaccessible.

  • @ArminmoTV
    @ArminmoTV 4 месяца назад +3

    we need a course about animation

    • @JesseShowalter
      @JesseShowalter  4 месяца назад

      I talk about animation in my www.30dayui.com course

  • @jamielocreda9780
    @jamielocreda9780 3 месяца назад

    how do software engineers/mobile devs feel about these trends?

  • @joshuajumbo1586
    @joshuajumbo1586 4 месяца назад +2

    Lovely Jesse 😂

  • @NintendoFreakify
    @NintendoFreakify 4 месяца назад +1

    Didn't you also mentioned like half of these last year? Easy vid to make 😂
    Anyways, no code is making big steps but it still lacks the flexibility to really go all out for a client, also adhering to guidelines and stuff.

    • @JesseShowalter
      @JesseShowalter  4 месяца назад +1

      This is my first “trends” video

  • @milanrdesign
    @milanrdesign 4 месяца назад +1

    Where do you see these trends? What tools do you use to research them?

    • @robertsimondj
      @robertsimondj 4 месяца назад

      he searches, reads, looks, uses only the eyes

    • @JawsoneJason
      @JawsoneJason 4 месяца назад

      ​@@robertsimondjanecdotal bias then ok

    • @wfwfwfwfwfwf
      @wfwfwfwfwfwf 4 месяца назад

      Dribble f.i

    • @CiaranBoylePhoto
      @CiaranBoylePhoto 4 месяца назад +1

      @@JawsoneJason It's a RUclips video not a thesis

  • @obvinpro
    @obvinpro 4 месяца назад +1

    Bento design was popularized by Microsoft

  • @user-mh9jm3ph9w
    @user-mh9jm3ph9w 4 месяца назад

    I learned front

  • @user-mh9jm3ph9w
    @user-mh9jm3ph9w 4 месяца назад

    how can I earn money I ma web designer

  • @bloojkl4520
    @bloojkl4520 2 месяца назад +5

    Most of these give me a headache

  • @igo2054
    @igo2054 19 дней назад

    none of these trends is really new

  • @vaxonoff
    @vaxonoff 27 дней назад

    So shitty trends, bruh

  • @JulieRoberts-od8ff
    @JulieRoberts-od8ff Месяц назад

    Less friction, excellent way to put it