The Easy Way to Design Top Tier Websites

แชร์
ฝัง
  • เผยแพร่เมื่อ 9 ก.ค. 2024
  • The key design principles and practical tips to build top tier websites.
    Try Mobbin: www.mobbin.com/?via=sajid
    Free Google Fonts: Inter, Open Sans, Work Sans, Lexend, Source Sans 3, DM Sans
    Type scales: codepen.io/whosajid/pen/dyBPWro
    Books Recommendations:
    Atomic Design - by Brad Frost
    Refactoring UI - Adam Wathan & Steve Schoger (Creators of Tailwind)
    www.iamsajid.com/
  • วิทยาศาสตร์และเทคโนโลยี

ความคิดเห็น • 389

  • @evertonalmeida1165
    @evertonalmeida1165 17 วันที่ผ่านมา +187

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

    • @NickTheCodeMechanic
      @NickTheCodeMechanic 7 วันที่ผ่านมา

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

  • @verdaderoken
    @verdaderoken 29 วันที่ผ่านมา +278

    Criminally underrated channel.

    • @Toopa88
      @Toopa88 17 วันที่ผ่านมา +3

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

    • @fastingman4726
      @fastingman4726 12 วันที่ผ่านมา

      @@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.

  • @Liam-tv7hx
    @Liam-tv7hx 28 วันที่ผ่านมา +75

    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 2 วันที่ผ่านมา

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

  • @erwan6797
    @erwan6797 17 วันที่ผ่านมา +29

    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

  • @davidwagstaff5494
    @davidwagstaff5494 29 วันที่ผ่านมา +43

    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  28 วันที่ผ่านมา +3

      omg 😭

  • @CarloNyte
    @CarloNyte 27 วันที่ผ่านมา +18

    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

  • @boiimcfacto2364
    @boiimcfacto2364 28 วันที่ผ่านมา +17

    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  28 วันที่ผ่านมา +2

      I hope you got a good sleep afterward.

    • @bigh1708
      @bigh1708 17 วันที่ผ่านมา

      same here

  • @yosgir
    @yosgir 29 วันที่ผ่านมา +192

    Not all heroes wear a Cape 🫡

    • @opticalreticle
      @opticalreticle 25 วันที่ผ่านมา +5

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

    • @whosajid
      @whosajid  23 วันที่ผ่านมา +12

      @@opticalreticle I don't 😂😂

    • @shimadamada9929
      @shimadamada9929 19 วันที่ผ่านมา +1

      Theres a staaaaaaar meeen waaiting in the skyy...

    • @aminmahmidi1076
      @aminmahmidi1076 7 วันที่ผ่านมา

      True

  • @arcadam8820
    @arcadam8820 2 วันที่ผ่านมา +3

    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  2 วันที่ผ่านมา

      🥹🥹🥹

    • @aaravasawa
      @aaravasawa วันที่ผ่านมา +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 วันที่ผ่านมา

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

  • @davidwagstaff5494
    @davidwagstaff5494 29 วันที่ผ่านมา +31

    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.

  • @davidaugustofc2574
    @davidaugustofc2574 26 วันที่ผ่านมา +3

    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 23 วันที่ผ่านมา +1

    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!

  • @Chenjv2
    @Chenjv2 29 วันที่ผ่านมา +6

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

  • @spicyCoder99
    @spicyCoder99 26 วันที่ผ่านมา +2

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

  • @AmIWhatIAm
    @AmIWhatIAm 12 วันที่ผ่านมา +1

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

  • @inner_melodies
    @inner_melodies 8 วันที่ผ่านมา +1

    You are by far the best communicator I have encountered on TH-cam - 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! 👏

  • @JordanStambaugh1
    @JordanStambaugh1 8 วันที่ผ่านมา +1

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

  • @flimo-l7s
    @flimo-l7s 2 วันที่ผ่านมา +1

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

  • @Daniel-do2mh
    @Daniel-do2mh 27 วันที่ผ่านมา +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!

  • @AndersonBassan
    @AndersonBassan 18 วันที่ผ่านมา +1

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

  • @animemv6183
    @animemv6183 8 วันที่ผ่านมา +1

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

  • @The-Athenian
    @The-Athenian วันที่ผ่านมา +2

    If this video were a painting I'd have it up on my wall.

  • @ftheg99
    @ftheg99 วันที่ผ่านมา +1

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

  • @tobisalami
    @tobisalami 18 วันที่ผ่านมา +5

    This is how a tutorial like this should be done. We don't need 10 hours to understand this!😊

  • @StormWolf01
    @StormWolf01 13 วันที่ผ่านมา +1

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

  • @JblgamingYt
    @JblgamingYt 27 วันที่ผ่านมา +1

    This was so direct and useful , no bs i love this
    good design is as little design as possible

  • @MarioDuch
    @MarioDuch 24 วันที่ผ่านมา +1

    Very well made video, this is going to be a classic. Keep up the great work mate!

  • @aminmahmidi1076
    @aminmahmidi1076 7 วันที่ผ่านมา +1

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

  • @noobdev25
    @noobdev25 4 วันที่ผ่านมา +1

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

  • @cindyc2363
    @cindyc2363 29 วันที่ผ่านมา +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!!

  • @kiwifan64
    @kiwifan64 5 วันที่ผ่านมา +1

    Wow, just wow. I haven't seen such a good tutorial for a long time!

  • @MaxJones123
    @MaxJones123 25 วันที่ผ่านมา +1

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

  • @ClooverDevs
    @ClooverDevs 28 วันที่ผ่านมา +6

    give this man an award please

  • @phoenixxofficial
    @phoenixxofficial 10 วันที่ผ่านมา +1

    Awesome production and amazing examples - thanks for the great information!
    Subscribed

  • @serafimthaler
    @serafimthaler 13 วันที่ผ่านมา +1

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

  • @Coder.tahsin
    @Coder.tahsin 29 วันที่ผ่านมา +8

    Absolutely great as always

  • @DCZT
    @DCZT 28 วันที่ผ่านมา +1

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

  • @jeetbania
    @jeetbania 27 วันที่ผ่านมา +1

    One of the single greatest video on web design!

  • @guilhermelucena8565
    @guilhermelucena8565 16 วันที่ผ่านมา +1

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

  • @ascientistanengineer8038
    @ascientistanengineer8038 7 วันที่ผ่านมา +1

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

  • @thitithanachaipornsakun1978
    @thitithanachaipornsakun1978 15 วันที่ผ่านมา +1

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

  • @sudiprajbanshiii
    @sudiprajbanshiii 8 วันที่ผ่านมา +1

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

  • @CodixFlow
    @CodixFlow 13 วันที่ผ่านมา +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 ❤

  • @nelke.michael
    @nelke.michael 23 วันที่ผ่านมา +2

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

  • @afraid2letgo
    @afraid2letgo 16 วันที่ผ่านมา +1

    Thank you! I'll soon start working on a web project of mine and I'll revisit this video a couple times for inspiration and tips when I'll be designing the figma version.

  • @iansantos3080
    @iansantos3080 14 วันที่ผ่านมา +1

    this is the best video I have seen with this topic, wonderful video

  • @nexTabDE
    @nexTabDE 17 วันที่ผ่านมา +2

    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  16 วันที่ผ่านมา

      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 :)

  • @Greinerdavid
    @Greinerdavid 20 วันที่ผ่านมา +1

    loved that video! most ppl tell you to build a full cluttered web site (mostly landing page) 🙌 learned a few things with just one video!

  • @xkarimink
    @xkarimink 9 วันที่ผ่านมา +1

    This is the greatest tutorial I've ever seen

  • @rvft
    @rvft 10 วันที่ผ่านมา +1

    Extremely useful. Cheers, man!

  • @SharoVideos
    @SharoVideos 28 วันที่ผ่านมา +1

    Haven't seen such simple and valid advice on web design before.

  • @Gerni2003
    @Gerni2003 28 วันที่ผ่านมา +1

    I love your videos man, the holy grail of web design

  • @--bountyhunter--
    @--bountyhunter-- 28 วันที่ผ่านมา +3

    HOLLLYYY.. ain't no way u only have 20k subs. hella underrated

  • @phoenix2558
    @phoenix2558 24 วันที่ผ่านมา +1

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

  • @alvespdaniel
    @alvespdaniel 17 วันที่ผ่านมา +1

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

    • @whosajid
      @whosajid  17 วันที่ผ่านมา

      🥹

  • @bilalillahi6347
    @bilalillahi6347 29 วันที่ผ่านมา +3

    Why is this Video So Perfect!

  • @paullouppe9947
    @paullouppe9947 26 วันที่ผ่านมา +1

    never seen a better ux ui design video

  • @lolnypop
    @lolnypop 27 วันที่ผ่านมา +3

    I've been so amazed by your designs and video style, I stayed till the end. Otherwise I would just click off.

  • @sanishshrestha4417
    @sanishshrestha4417 27 วันที่ผ่านมา +1

    so much of quality information packed in one video 🔥 keep creating 🙏

  • @fastingman4726
    @fastingman4726 12 วันที่ผ่านมา +2

    As a guy who builds websites “for a living” this a great video!

    • @alexia7693
      @alexia7693 6 วันที่ผ่านมา

      hey man! I'm studying ux and web design not many months left. do you have any tips to selling your sites or gaining clients?

    • @fastingman4726
      @fastingman4726 5 วันที่ผ่านมา

      @@alexia7693 yes. Run a few Facebook ads for $200 targeted to small businesses or solopreneurs . Land about 3-5 clients with those ads and do a really good job for them (exceed their expectations on cost, quality, or speed). You will make mistakes and that’s okay, just be willing to adjust and learn. I literally cut and paste the sales copy from a similar guy in Minnesota selling low maintenance web site services. My few ads converted pretty good.

    • @fastingman4726
      @fastingman4726 5 วันที่ผ่านมา

      @@alexia7693 UX is a massively growing niche. Stay in that specialty and you’ll have a job for life.
      Be social and have operate from a spirit of value creation for you clients and not maximizing profit generation. The early stages are tough but once you day is filled with clients, then you can raise your prices. I hope this helped.

  • @ulisescortes976
    @ulisescortes976 26 วันที่ผ่านมา +1

    Just the video I needed to see since a few days ago!

  • @Trixe-space
    @Trixe-space 27 วันที่ผ่านมา +1

    This is the best web design video I've seen. Thanks!

  • @jerichoserr1479
    @jerichoserr1479 20 วันที่ผ่านมา +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.

  • @alpree
    @alpree 10 วันที่ผ่านมา +1

    Thank you for such a high quality video. It was very inspiring.

  • @Anonym12351
    @Anonym12351 21 วันที่ผ่านมา +1

    Thanks man, I really needed this.

  • @carlosh1943
    @carlosh1943 14 วันที่ผ่านมา +1

    This is an awesome tutorial! Really really really useful. Well done!

  • @pepepa9
    @pepepa9 13 วันที่ผ่านมา +1

    Amazing video and no course sold at the end. Class 👏

  • @24abhinay6
    @24abhinay6 28 วันที่ผ่านมา +1

    Loved the video bro
    Good luck hope this video goes BOOM

  • @user-xx8yu1fh6e
    @user-xx8yu1fh6e 28 วันที่ผ่านมา +1

    This video itself is a piece of art !

  • @obiworm99
    @obiworm99 29 วันที่ผ่านมา +1

    I was actually looking pretty hard for a good web design TH-camr just this morning. I think my search is over :)

  • @Comedianalexj
    @Comedianalexj 18 วันที่ผ่านมา +1

    Best video on spacing hands down!!!

  • @warricksmythevideo
    @warricksmythevideo 24 วันที่ผ่านมา +1

    Really needed this, thank you !

  • @zeoneee
    @zeoneee 19 วันที่ผ่านมา +1

    This video is unbeliveably perfect

  • @nandakresna41
    @nandakresna41 15 วันที่ผ่านมา +1

    bro this is such a gem 💎

  • @GDesign-mo6ve
    @GDesign-mo6ve 27 วันที่ผ่านมา +2

    Guys believe me this channel is underrated !!

  • @marshmallow97012
    @marshmallow97012 17 วันที่ผ่านมา +1

    Great video!! Really touched on the philosophy of design

  • @leo-kk-leo
    @leo-kk-leo 14 วันที่ผ่านมา +1

    Great content. You just got a new subscriber!

  • @bsick6856
    @bsick6856 25 วันที่ผ่านมา +1

    The design examples go crazy

  • @arno_1741
    @arno_1741 13 วันที่ผ่านมา +1

    You are so good my guy many thanks !

  • @SivakD
    @SivakD 17 วันที่ผ่านมา +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.

  • @garethBarry_dev
    @garethBarry_dev 10 วันที่ผ่านมา +1

    Really enjoyed this video. Thank you.

  • @BeyonDemm
    @BeyonDemm 13 วันที่ผ่านมา +1

    Great video. Thank you for this! From an Algerian in Canada.

  • @Rhxrrrr
    @Rhxrrrr 10 วันที่ผ่านมา +1

    u did amazing bro good work

  • @marek3213
    @marek3213 4 วันที่ผ่านมา +1

    Very well explained. 10/10 would design again

  • @BridgingGapsSoftware
    @BridgingGapsSoftware 25 วันที่ผ่านมา +1

    great video. I will be referring to this video on my next interface project.

  • @alexloquendero1000
    @alexloquendero1000 29 วันที่ผ่านมา +11

    I love beluga appeared in the video

    • @whosajid
      @whosajid  28 วันที่ผ่านมา

      😂😂😂

  • @nihapmrm
    @nihapmrm 24 วันที่ผ่านมา +2

    Extremely helpful and clearly explained! 👏👏

  • @nathancwatkins
    @nathancwatkins 13 วันที่ผ่านมา +1

    Everyone loves your videos. keep it up

  • @TheAcebyte
    @TheAcebyte 9 วันที่ผ่านมา +1

    Yo this reminds me of a book called "Refactoring UI", only it's in video format, great work brother!

    • @whosajid
      @whosajid  7 วันที่ผ่านมา

      Yeah, this video wouldn't be possible without "Refactoring UI" & "Atomic Design".

  • @arod100
    @arod100 17 วันที่ผ่านมา +1

    Amazing channel brotha!

  • @guts5463
    @guts5463 7 วันที่ผ่านมา +1

    Amazing video, thank you!

  • @enilolobopromise5747
    @enilolobopromise5747 22 วันที่ผ่านมา +2

    The TH-cam algorithm has blessed me again today

  • @abinmanil5361
    @abinmanil5361 15 วันที่ผ่านมา +1

    Just amazing video,
    actually i am a backend developer but this tutorial hit next level.

  • @DesignerMehedi
    @DesignerMehedi 28 วันที่ผ่านมา +1

    BRO THANKS FOR MAKING SUCH A EASY TO UNDERSTAND VIDEO 😊

  • @CoreDumpped
    @CoreDumpped 14 วันที่ผ่านมา +1

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

  • @GN00
    @GN00 18 วันที่ผ่านมา +1

    better than a book! thanks Sajid!

  • @hicoop
    @hicoop 17 วันที่ผ่านมา +1

    Absolutely useful - using these techniques as soon as I can! Also, for the devs out there, just use tailwind

  • @gotcha44
    @gotcha44 29 วันที่ผ่านมา +1

    This whole channel is perfect! I needed something like this, I'm a new freelancer in the Denver area wanting to design websites for local businesses. I designed my own and one companies so far, this made me realize both are probably ugly... 😂 but I'm motivated to build something beautiful

  • @serialoxy
    @serialoxy 18 วันที่ผ่านมา +1

    Amazing content, thanks for this!

  • @farrela.846
    @farrela.846 29 วันที่ผ่านมา +2

    Solid advices. Thanks mate