The Easy Way to Design Top Tier Websites

Поделиться
HTML-код
  • Опубликовано: 17 янв 2025
  • НаукаНаука

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

  • @konjugate-40k
    @konjugate-40k 3 месяца назад +145

    "Creativity is a process not a moment... Being creative is about connecting ideas." Very inspiring, thank you~
    -Recovering Perfectionist

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

      As a perfectionist as well, I often get way too demoralised from all the doubts and overthinking about whether I'm always achieving the highest quality in anything. Hearing this definitely let's me know I'm only holding myself back by spending time worrying about every little detail.

    • @adamzoltan1685
      @adamzoltan1685 Месяц назад +1

      Wtf recovering perfectionist what is that bs

    • @fiveshorts
      @fiveshorts 14 дней назад

      It’s ok. There is no cure. You just have to manage the disease. At least you don’t suffer from “Goodenoughitis”

  • @evertonalmeida1165
    @evertonalmeida1165 5 месяцев назад +599

    Now this is a S++ tier tutorial. The sponsoring was more than deserved.

    • @NickTheCodeMechanic
      @NickTheCodeMechanic 5 месяцев назад

      @evertonalmeida1165 totally it captured my short attention spa-...
      ... long enough for me to save it to Favs! 😍

  • @verdaderoken
    @verdaderoken 6 месяцев назад +585

    Criminally underrated channel.

    • @Toopa88
      @Toopa88 5 месяцев назад +8

      10 month old channel, only 10 videos, over 20k subs. How is that underrated?

    • @fastingman4726
      @fastingman4726 5 месяцев назад

      @@Toopa88bruh, there are channels with far more subs and views with far worse quality. I value my time, and I want a high value per minute, not lots of meaningless videos. Only bugmen watch tech vids for eNtErTaInMeNt.

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

      @@Toopa88 its not a statement meant to be taken literally but rather a way to compliment the quality of those videos

  • @erwan6797
    @erwan6797 5 месяцев назад +114

    Alright, thank you for this video. I saved it and make my own time code for next time.
    00:17 The Golden Rules
    3:06 Atomic Design
    8:01 How to elevate elements
    8:43 How to be creative

  • @Liam-tv7hx
    @Liam-tv7hx 6 месяцев назад +150

    This is one of the best design tutorials in general, you can apply it in basically every field of design, not just web design

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

      And not even just design. It can be applied to any creative field. Including engineering/programming

  • @CarloNyte
    @CarloNyte 6 месяцев назад +38

    Greatly surprised with how much value was in the video. And especially liked that your advert didn’t feel like an ad. Just a tool to be used for reference

  • @itsmenatika
    @itsmenatika Месяц назад +15

    The hardest part here is to how to get a proper sleep

  • @waiitwhaat
    @waiitwhaat 9 дней назад +3

    Steps to become a better designer:
    1. Get good
    2. Look hard
    3. Think hard
    4. Touch grass
    5. Don't propose??
    /s obviously. This gave me tons of ideas to better my design. Definitely saving this video!

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

    This is one of the best visualized video I have ever seen. That the information in it is also incredibly valuable is the cherry on top.

  • @boiimcfacto2364
    @boiimcfacto2364 6 месяцев назад +47

    I clicked on this video half-asleep thinking I'd just note some points and fall asleep. But oh boy this was amazing, it's jam-packed with good quality advice. I love your style of "direct" lessons, straightforward. Keep up the good content, you've earned this subscriber! ❤

    • @whosajid
      @whosajid  6 месяцев назад +6

      I hope you got a good sleep afterward.

    • @bigh1708
      @bigh1708 5 месяцев назад

      same here

    • @captain_finn
      @captain_finn 5 месяцев назад +1

      For real, this is making me rethink my process in a more simplified manner.

  • @davidwagstaff5494
    @davidwagstaff5494 6 месяцев назад +92

    Watching this is like going to a buffet made by world class chefs. It's all wonderful, and I'll have to come back to eat your video about 10 times to truly taste all the goodness and make it a part of me. Megakudos.

    • @whosajid
      @whosajid  6 месяцев назад +10

      omg 😭

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

      after readin this idk if i'am motivated or hungry😂

  • @stanislavknopp6870
    @stanislavknopp6870 5 месяцев назад +49

    This is the best UI / UX video tutorial for beginners on RUclips. Every young designer should watch this. Great work.

  • @davidwagstaff5494
    @davidwagstaff5494 6 месяцев назад +35

    This video pairs up nicely with your video redesigning Lex Fridman's site . One covers concepts, and the other is a complete implementation using those concepts.
    Hell, all your videos support each other nicely. I just particularly love these two as a combo. Salt and pepper.

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

    your ending steps on the design process is immaculate and should be used on every tutorial. Stress and being too in love with your work will make things harder. Design takes time, a lot of time and should not be rushed.

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

    Some S tier advices, God knows how many time I have designed something with dummy content to find out looks out of place with the real content, learned from my mistakes. This is years of experience summed in one video, great work man, subbed.

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

    this was realllllly so helpful, like creating a system and planning beforehand about font sizes, spacing and making those css variables sounds way better than just randomly testing whatever value looks good on the website. I am going to implement this
    thank you so much ❤❤❤

  • @yosgir
    @yosgir 6 месяцев назад +468

    Not all heroes wear a Cape 🫡

    • @opticalreticle
      @opticalreticle 6 месяцев назад +25

      how do you know he doesn't wear a cape?

    • @whosajid
      @whosajid  6 месяцев назад +29

      @@opticalreticle I don't 😂😂

    • @shimadamada9929
      @shimadamada9929 6 месяцев назад +7

      Theres a staaaaaaar meeen waaiting in the skyy...

    • @aminmahmidi1076
      @aminmahmidi1076 5 месяцев назад +1

      True

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

      ​@@shimadamada9929bruh, stop!!!! Man, watching reels has traumatized me

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

    If only all content on RUclips was as educational as this. Thank you

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

    A bit of disclaimer I gotta add about “as little design as possible”: This doesn’t mean “make it less functional”. The functionality just has to be expressed in as little UI as possible, without removing so much that it’s cumbersome to find what your users need.

  • @ioplop2943
    @ioplop2943 2 дня назад +1

    Damn, you hit me right in the soul with the "get proper sleep" thing 😭
    Very useful information, clear and concise presentation, well-structured video. This has it all. Thanks a lot!

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

    Wow this was really good content. Usually when it comes to ads I have the feeling to roll my eyes and skip but the ad was integrated so well to the topic of the video I was so compelled to watch through the ad as it had core information in it and not so much selling me on the product. Job well done sir.

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

    i was supposed to be a programmer not a designer, but here i am

    • @danielmoylan3033
      @danielmoylan3033 20 дней назад +1

      Often times, developers need to wear multiple hats anyways. Having the experience on both sides is good.

    • @fiveshorts
      @fiveshorts 14 дней назад +1

      I was supposed to be a designer not a programmer, but here I am.

  • @nexTabDE
    @nexTabDE 5 месяцев назад +9

    Truth be told, I was a bit sceptical at the beginning. I thought the rest of the video might be more text on black background and just telling us about design.
    Then you really got into it and provided excellent examples that illustrated your points. So if somebody else is on the fence and they're not sure whether they should keep watching after the 1 minute mark, I promise you it's worth the ride.
    Really good video, thanks for winning me over! I'll sub to the channel now. 🙂

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

      Oh yeah, I was exhausted by all the designs and editing. So I said F it, and just put captions in the beginning.
      I am glad you finished the video, and found it helpful :)

  • @nebuladevelopments
    @nebuladevelopments Месяц назад +2

    This is one of the best design videos I have ever watched. Thank you for this.

  • @raj_srikar
    @raj_srikar Месяц назад +2

    10:57 I never felt more called out by a video before. Thanks a ton for making this!

  • @OlabodeAdedoyin
    @OlabodeAdedoyin Месяц назад +1

    "If you can't explain it simply you don't understand it". This was a masterclass in explaining simply. It's basically what I've been scouring youtube for. Thank you 🙏

  • @AbelHaddis-h8h
    @AbelHaddis-h8h 4 месяца назад +1

    I saw this video in my recommendations a while ago and watched a snippet of it. Instantly, I knew that you know your stuff and I had to come back and binge the rest of your videos! Mentioning the Law of Proximity & Relativity plus the Gestalt Principle was the icing on the cake because people never talk about this stuff! Definitely have my sub!

  • @AmanCiphers
    @AmanCiphers 4 дня назад +3

    10:34, Step 4 : stay away from the problem,
    This definitely works

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

    You are by far the best communicator I have encountered on RUclips - the things that you say and the way you say it are just so on-point - would you care to make a video about that? Your visuals are also top-notch too - but I guess that's a given since you're a designer. Bravo! 👏

  • @davidaugustofc2574
    @davidaugustofc2574 6 месяцев назад +6

    I love the bit where I realized you were applying your recommendations on this very video, and how this helped me understand the topic more clearly.

  • @pitabean8509
    @pitabean8509 6 месяцев назад +2

    Dude, this is the best design video I've ever watched in my life. Those 12 minutes passed for me in a second. Thank you, you are the best!

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

    Thats not a design tutorial anymore. Its a lesson of modern art.

  • @isaacvr
    @isaacvr 5 месяцев назад +5

    Perfect. That's quite useful for me. I'm not a designer, I'm a web dev but I have my own app with my own design and this is more than welcome.

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

    This easily the best video I've seen on this topic. I love how you connected the design and the dev elements.

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

    I watched so many UI videos but they never solved my problem YOU have cracked the code! With the help of your video, I designed my website and it looks 10000 times better than any other project I've ever built! Thanks so much!

  • @HemstitchedIrony
    @HemstitchedIrony 5 месяцев назад +41

    This is honestly why I love tailwind CSS, it basically tricks developers into using a design system instead of just freeballing their CSS and making a monstrosity. It takes a lot of the effort of stuff like spacing and text sizing out of your brain and into the per-existing classes.

    • @whosajid
      @whosajid  5 месяцев назад +14

      Yeah, Tailwind is awesome. But once you get good at vanilla CSS or design principles, you don't really need it anymore. (At least for simple apps and websites).

    • @nullquest
      @nullquest 5 месяцев назад +1

      @@whosajid You're only really good at tailwind if you know css well, since the classes are almost identical. I haven't heard of anyone that goes from Tailwind to CSS.

    • @whosajid
      @whosajid  5 месяцев назад +7

      @@nullquest Bro, I know a lot of devs who went back to vanilla CSS, including myself.
      Again, nothing against Tailwind. It's a blessing for devs.

    • @casper64
      @casper64 5 месяцев назад +5

      I’ve switched back to vanilla CSS from using tailwind about half a year ago. For me it’s just faster

    • @whosajid
      @whosajid  5 месяцев назад +3

      @@casper64 Yep

  • @Chenjv2
    @Chenjv2 6 месяцев назад +6

    I love your videos man, there just better than all these other 20 hours Tutorials. Thank you so much!❤

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

    This video is pure gold and will be relevant for decades to come. My hats off to you 🎩

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

    WOW! This information is pure gold. Also the way it is structured, the rythm, everything is good... Thank you so much man!!

  • @tech.bharat18
    @tech.bharat18 Месяц назад +1

    This is one of the best design tutorial I ever watched !

  • @CoreDumpped
    @CoreDumpped 5 месяцев назад +1

    As a back-end person, I gotta say I loved this.

  • @AmIWhatIAm
    @AmIWhatIAm 5 месяцев назад +1

    Just subscribed for the quality of the video! 100% Informavtive no bs. This is such an underrated channel.

  • @torreslarabrunoalfredo9292
    @torreslarabrunoalfredo9292 Месяц назад +1

    This is tutorial is so good that it made me comment on a YT video for the first time in my life, absolutely inspiring, awesome job.❤

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

    Automatic CSS has made my workflow so much faster by using combo classes to set width, spacing, grid gap, global colors/buttons, etc etc.

  • @noobdev25
    @noobdev25 5 месяцев назад +1

    Ngl, this channel is S++ Tier. Straight up no BS. You deserves million subs.

  • @Pamination-b8j
    @Pamination-b8j 5 месяцев назад +1

    This channel is definitely gonna blow up real soon, amazing content keep it up

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

    I’ve come back to this video many times for website decisions, much appreciated !

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

    BLESS YOU, we learned a bunch of stuff but never did they sit us down to just tell us this. big help!

  • @spicyCoder99
    @spicyCoder99 6 месяцев назад +2

    Man, I learned with that video more than with 100 other tutorials... Great work, keep it up!

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

    This is a perfect YT video. Straight to the point, stays interesting throughout, the sponsor is actually relevant to the topic and could just as well work if it wasn't a sponsor.... you are preaching by example here!

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

    I am just a student that interested in frontend framework and wow, this give me a lot of idea to design my side-project!
    Thank you!

  • @MuchLove.12
    @MuchLove.12 Месяц назад +1

    This is the best video on design I’ve ever watched.

  • @Hoover04
    @Hoover04 6 месяцев назад +6

    give this man an award please

  • @ftheg99
    @ftheg99 5 месяцев назад +1

    better content and easier to understand than bootcamp and it was free. thank you so much for making this!

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

    exceptional work. saved for rewatching later. thank you

  • @Daniel-do2mh
    @Daniel-do2mh 6 месяцев назад +2

    Wow! I wasn't expecting this much quality information. I am more of a technical person, and now I am quite intrigued about design theory. Thanks!

  • @alvespdaniel
    @alvespdaniel 5 месяцев назад +1

    One of the best videos I've watched in my entire carrer. The ultimate guide about design and it process.

  • @valenciaricardo2011
    @valenciaricardo2011 11 дней назад +1

    one of the better youtube videos out there.

  • @AndersonBassan
    @AndersonBassan 6 месяцев назад +1

    The best video about design that I have ever watched. Keep up the amazing work! Commenting for the algorithm.

  • @phoebeyutbt
    @phoebeyutbt 6 месяцев назад +3

    Reminds me of Juxtopposed! Straight forward, to the point, so clean.

    • @whosajid
      @whosajid  6 месяцев назад +2

      OMG. I am such a huge fan of hers and Hyperplexed.

  • @grizwastheshizz
    @grizwastheshizz 5 месяцев назад +1

    This video is GOATED. Seriously, this is an incredibly useful breakdown. Thank you

  • @raymundverallo1967
    @raymundverallo1967 5 месяцев назад +1

    The best video I’ve seen regarding the topic. Finally thank you

  • @aminmahmidi1076
    @aminmahmidi1076 5 месяцев назад +1

    I've never seen a ui/ux channel that explains that well, good job bro

  • @arcadam8820
    @arcadam8820 5 месяцев назад +7

    I rarely comment anything on internet, but holy shit. It's probably one of the best tutorials I have ever seen on the topic of designing a website. I wished web designers that I met along the way did the same things that were presented in the video. The worst and most annoying part of the job when I was working as Frontend Dev were website designs that were overcomplicated, multiple unecessary colors that even didn't match up and as in the video it always ended with ugly design, took ages to make it pixel perfect. Everything in the video is spot on, the spacing, grabbing user's attention by color, font size, spacing, size of the elements and more. Honestly, hugely underrated channel.

    • @whosajid
      @whosajid  5 месяцев назад

      🥹🥹🥹

    • @aaravasawa
      @aaravasawa 5 месяцев назад +1

      "I rarely comment anything on internet" i can see why wtf is this this aint no comment this is a letter to youtube to have a fking wod limit

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

      @@aaravasawa I don't see anything bad in giving lengthy and an honest opinion on a matter, especially with background experience.

  • @idmt93
    @idmt93 5 месяцев назад +1

    First time seeing your content. I’m a dev, I have a good eye and can tell what looks bad but I’m not skilled at creating good ui/ux. I always thought it would be really cool to get good at it. This was a great start! Awesome video.

  • @MaxJones123
    @MaxJones123 6 месяцев назад +1

    This is one of the best videos in design ever made.

  • @nelke.michael
    @nelke.michael 6 месяцев назад +2

    Beautifully stated. Thank you. Lots of screen shots taken to remind myself…

  • @thitithanachaipornsakun1978
    @thitithanachaipornsakun1978 5 месяцев назад +1

    wholesome, A++++, S-tier crash course on design thinking and systems

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

    This was simply amazing. These are the type of tips we all need to hear and apply.
    Thank you for this

  • @ModerateDev
    @ModerateDev 2 дня назад +1

    This video is a gold mine thankyou sir for the good work!

  • @StormWolf01
    @StormWolf01 5 месяцев назад +3

    This video is much better than what i thought. It went into the principles, and not the technologies. Thanks.

  • @serafimthaler
    @serafimthaler 5 месяцев назад +1

    Best compact and detailed video about design I have ever seen!

  • @lynic-0091
    @lynic-0091 7 дней назад +1

    This is such a perfect video for a design noob like me. Awesome job. Subscribed.

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

    Creativity is the literal gate between disposition and originality. It’s always about the first time to do something. That doesn’t mean every element has to be. But creativity isn’t just having ideas. It’s forming reason from abstraction. Not reason from reason.

  • @jeetbania
    @jeetbania 6 месяцев назад +1

    One of the single greatest video on web design!

  • @guilhermelucena8565
    @guilhermelucena8565 5 месяцев назад +1

    your content is Tier S+++. a hug from Brazil. Thank you for your provision!

  • @cindyc2363
    @cindyc2363 6 месяцев назад +1

    Just as i discovering i had this problem, i saw this video. Glad i had this problem for 3 days. Now i am motivated to try again! Thanks!!

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

    more ads need to be done in this format
    didn't even feel the need to skip it cuz it was actually useful and related to the tutorial

  • @shabeeurrehman
    @shabeeurrehman День назад +1

    God bless you for breaking down things so easily. 🙏

  • @GDesign-mo6ve
    @GDesign-mo6ve 6 месяцев назад +2

    Guys believe me this channel is underrated !!

  • @phoenix2558
    @phoenix2558 6 месяцев назад +1

    I wonder just how much time and effort you put in making this single video ? Great stuff ! Keep it up !🔥🔥

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

    This is actually really useful. It would be nice to see a full walkthrough of a design process, to learn good habits. As well as having a PDF cheat sheet for the size & hierarchy thing, which is so damn hard for me.

  • @SivakD
    @SivakD 5 месяцев назад +1

    I've been tinkering with some design too and I agree that uniform margin and padding values along with consistent colors is good. But the final point is best: Just finish something and get it out there.

  • @CodixFlow
    @CodixFlow 5 месяцев назад +1

    O man, that was such a great video. Enjoyed every sec of it. And i can't wait to see such more content from you.
    Lots of love ❤

  • @gat-susama7409
    @gat-susama7409 5 месяцев назад +2

    Imma downlaod and save this. This is too good to be true.

  • @animemv6183
    @animemv6183 5 месяцев назад +1

    Wow dude. Thanks for ur hard work it's the best design roadmap/tutorial I've seen on yt

  • @danielheredia8890
    @danielheredia8890 Месяц назад +1

    What an insane tutorial. Infinite kudos!

  • @ascientistanengineer8038
    @ascientistanengineer8038 5 месяцев назад +1

    This is the content I pay my internet bills for! Seriously polished content Sajid!

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

    This channel deserves at least 10M subscribers

  • @bilalillahi6347
    @bilalillahi6347 6 месяцев назад +3

    Why is this Video So Perfect!

  • @paullouppe9947
    @paullouppe9947 6 месяцев назад +1

    never seen a better ux ui design video

  • @Comedianalexj
    @Comedianalexj 5 месяцев назад +1

    Best video on spacing hands down!!!

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

    What an inspiration, I opened the video with just ok lets see but this video is really underrated and the ending got me.

  • @jerichoserr1479
    @jerichoserr1479 6 месяцев назад +1

    I just completed a UI design fundamentals course by Gary Simon in Scimba, and this felt like a review; it's so good. Another great addition to my design journey

    made me subscribe. Keep it up, bro.

  • @alexloquendero1000
    @alexloquendero1000 6 месяцев назад +16

    I love beluga appeared in the video

    • @whosajid
      @whosajid  6 месяцев назад

      😂😂😂

  • @DCZT
    @DCZT 6 месяцев назад +1

    I was already doing these without watching this video. That's nice to know I was a good designer by heart.

  • @CalmDesigner
    @CalmDesigner Месяц назад +1

    Great job !Love this one.For sure will be rewatching consistantly 🙂

  • @rvft
    @rvft 5 месяцев назад +1

    Extremely useful. Cheers, man!

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

    This video makes me relaxed, especially while im having a design block rn lol.

  • @sudiprajbanshiii
    @sudiprajbanshiii 5 месяцев назад +1

    I dont have words to describe how helpful the video was to me