Amateur vs Pro UI Design | with examples

In this video, we explore what separates top-tier UI design that attracts clients and lucrative positions from junior-level designs that struggle to gain traction. We'll examine a range of UI design samples, crafted by both novices and professionals, to guide you on your journey towards becoming a first-rate designer. From login & signup interfaces to dashboards and web apps, join us as we delve into color usage, hierarchy, contrast, spacing and more. This is the perfect resource for those looking to elevate their UI design skills!... Remember to Subscribe goo.gl/6vCw64
3 Month free trial with NordPass: nordpass.com/jesse
Code: JESSE
------------------------------------------------------------------------------------
🤝 //////////// 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.co...
🖥️ ////////// I Prototype Magic in ProtoPie
www.protopie.i...
🖥️ ////////// I Build websites in Framer
framer.link/jesse
📅 ////////// I run my life with Notion
affiliate.noti...
🎵 ////////// 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/13...

[@joselitosibayan8112]

As a graphic designer trying to transition into the UX industry, I think these senior-level interfaces wouldn't be possible without understanding research. Design isn't only about design-it's also knowing what the users actually need. Thanks for putting out such educational content!

[@peteroguntola8760]

I’m in the same boat

[@mattsmitt00]

I totally disagree. Research helps to some extent, but at the end of the day understanding the small nuances and adjustments that really level-up designs comes entirely from USING the designs you make. Research is just a zoomed-out and averaged way to understand how a user actually uses your product second-hand. If you actually try to use these designs, and learn to pay attention to how you're processing and reacting to a design will tell you everything you need to know. If you're pretending to be a user looking for a vacation rental, you'll notice that it takes you a couple seconds to scan across the whole page before you figure out where to start (implying there's not enough direction or separation between sections), or if you try to see where a rental is at on the map, you'll immediately notice that it's so vertical and lacks enough distinction that it is very difficult to get your bearings and tell where the map is even focused. (which tells you you're going to need more contrast and more horizontal space - and you can get that by reducing all the space being taken up by the sidebar that doesn't actually give you much more functionality.)

[@humairanaeempasha2362]

Would really appreciate if you'd show your version next to the version being critiqued. Good content! 👍🏽

[@OXMStudios]

yes! this is a great idea!

[@michaelmd3541]

Thank you. Was thinking the same

[@JesseShowalter]

Noted!

[@ladyxlittlemonster98]

bro, really, lower the volume of your intro, it is so annoying

[@ashishpatel9275]

Just take what he's giving 🤌🏻

[@katushya]

Honestly it's not too high. You know there's a reason why the volume key exists in every phone/pc.

[@brycehickson374]

The problem is the volume mixing. His voice is way too quiet in comparison to the music.

[@MrValVet]

second that

[@darlinsebastian.3229]

Agree.

[@Amrdys]

I really do think that the Dashboard design at 10:40 is way better than the one at 11:20. Talking from both UI design and Front-end development perspectives.

[@cyberhrc]

On last example, i do agree that colors 'might' be better but at the same time we cannot ignore that some clients DEMANDS usage of 'their' colors [ purpose of branding etc ] in the design. Setting good color itself is always required but on showed examples, last one is 'too perfect' with usage of photos that perfectly matches design while the previous one had more ' real life ' photos. I am personally tired of 'blue' for business, money, and corporate stigma. Colors should have purpose for a user and for a client as the same value [ tho that is hardest part ] :) Overall good video, keep it up !

[@healthadvice3091]

I agree on clients say "can you make it pop?" at the end of the day whatever argument we say they just pay us money and follow what they want 😅. At least for small businesses

[@JesseShowalter]

Thanks

[@saschac.949]

But you also have to bear in mind that the designs shown on KZbin, Dribbble and other design platforms often have nothing to do with reality or real customers. As already mentioned, the designs too often appear ‘too perfect’ or are only designed for the eye - and not for a subsequent code implementation or existing technologies to be used. It's often more like a painting than a real job.

[@---iy8xz]

thank you for your helpful video! i'd like to suggest lowering the volume of the intro in 0:30

[@kazx6716]

He just fucked my entire mod and almost get a heart attack

[@pedrosantos1338]

Very good video. But I really have a question. I'm a developer, but I like to study UI/UX. In the dashboard at minute 11:18, for example, it's very pretty, that's undeniable, but it doesn't seem like a good idea to be executed. Those rounded edges and that displaced footer menu, I really have no idea how to execute this to preserve these aspects. The browser, as far as I know, doesn't support this. But if anyone knows, I'd love to see an example of this execution. Because design is supposed to be beautiful and disruptive, but it has to be executable in code.

[@steffm.4884]

somewhere there's a video called "Amateur vs Pro Sound Mixing" using this as the worst case

[@ogunsolajulius5424]

This is so good and helpful Jesse, we`ll need a part 2. Thanks for all you do 😊

[@JesseShowalter]

You got it!

[@todd.mitchell]

How did I only just now discover you. Outstanding. Thank you, Sir.

[@JesseShowalter]

Welcome!!! So glad you’re here!

[@grafartist]

Does this mean you'll bring back the rework series? I can see that being super beneficial for someone who is junior level like myself. I'm currently doing the course and I'll be honest, I thought some of those designs were good until you offered insight into what makes them appear less than senior level, so it would be cool to see you make edits in real time to do a before and after comparison.

[@JesseShowalter]

I will bring that back, I’ll ask for designs from my designchamps.io/

[@tictac_oe4590]

Loved this one Jesse! We need more of these

[@Loggerr]

We'll need a part 2 of this. Its super useful to see! Good stuff Jesse!!

[@JesseShowalter]

Coming soon! While you wait, check out my new UI Design training program. It will help take you from Noob to Pro in 30-Days! www.30dayui.com/

[@raquelgarcialeyva9682]

Wow, Your 👀keen eye for detail is incredible; it really helps me pinpoint the issues in some of my designs. This video has been very helpful to me.

[@JesseShowalter]

Glad it helped! If you want Learn more about UI design check out my new course www.30dayui.com/

[@jayfunk2012]

That senior dashboard is the weaker one of the four

[@andresmeneses7514]

Yeah I was thinking that is used "Brutalism" in an unnecessary way, Data viz is about clear and fast. Number people want to see numbers as clear as possible

[@nathjones77]

The 3rd dashboard is clearly the best. The 4th is better than the first one. I didn’t like the green one at all. Very poor information/action ratio

[@mikeysouthwell]

More content like this please! I love these UI breakdowns 🤩

[@Davina-g1b]

Please make more videos of this, it's incredible

[@Bodybagbart]

Critiquing the Apple sign up screen is diabolical 😂

[@vineetboyle]

Broken down really well for us. Thanks Jesse.

[@JesseShowalter]

If you like this you’d love my full UI course www.30dayui.com/

[@AxsRock]

In apple's third Sign Up design, if it is a registration screen it should have a field to confirm the password.

[@JesseShowalter]

True these are not perfect screens just examples to start the conversation

[@domvial]

On the sign-up screens, the primary CTA state should be displayed as disabled since the mandatory info is not entered yet. Also, on that last map screen, should be “Satellite”, not “Sattelite” 😉

[@JesseShowalter]

Thanks

[@Erwin_t]

Great advice as always! could you do a video where you do a client project?

[@JesseShowalter]

Great idea!

[@UnKnown-hs3ic]

Kindly make part 2 of this video.

[@JesseShowalter]

Coming soon

[@G20Storm]

If I'm already a Graphic Designer, a lot of the stuff you talk about seems almost natural to me, would you say that Bootcamp or School is needed to be a UX/UI designer? I started working on some designs already using Figma, and so far "design" seems pretty simplistic. I'm wondering what more there is to the job, that would prevent me from doing it. I know the UX part of it, will come with time and practice, as I don't know what people want or need, but the UI part of it seems pretty straight forward.

[@RhettNewton-r7b]

Awesome video, Thanks for posting this! Some really good information here!

[@JesseShowalter]

Thank you so much!!

[@OlaTalaat-g7r]

I have to mention that I like your outro ❤

[@davidpsbn]

The last dashboard although it is everything good thing you said about it it’s also a fail UX wise. if used for a every day tool its just too much. Users and their eyes would be fatigued after 10 min of usage

[@JesseShowalter]

Just a UI design video

[@brycelee1529]

UI and UX should go hand-in-hand though… if you’re teaching designers this content to get hired, I think David has a valid point in saying that the last example is not the best. I personally don’t like it either because the spacing seems a bit off, and it’s not conventional to have nav bars on the bottom. I also think the colors are a bit distracting, but then again, I’m not a fan of neobrutalism.

[@osasoyara]

Hello Jesse, great work! I'm looking to improve in the area of the design critique, and I need more reps. What website would you recommend to gather examples for critique?

[@JesseShowalter]

We do design criteria in my free community designchamps.io/

[@viktorskarlatov8227]

That was super informative. Thanks!

[@JesseShowalter]

Glad it was helpful!

[@WadeMurley]

Do you use Tella for screen recording?

[@JesseShowalter]

No I use a custom live streaming setup

[@sofihakobyan7223]

Very helpful ideas, thank you. I hope, you’ll do other similar videos 😊

[@JesseShowalter]

I’ll do more like. this If you want Learn more about UI design check out my new course www.30dayui.com/

[@DavidCasey-ok1zs]

Great video. Great Examples. Great explanations.

[@JesseShowalter]

Thank you so much!!

[@nafaabout]

If you just remove that background music. Really helpful video for a developer like me. Thank you.

[@JesseShowalter]

Thanks so much for watching and for your feedback!!

[@SachinRana-x4h]

Really great content Jesse

[@peteroguntola8760]

Thanks boss. Insightful!

[@prmcabrita]

Thanks Jesse!

[@braidedwire]

Could anyone recommend some good UI design courses? Most stuff i see on Udemy for instance is all-in-one courses including graphic design basics (which as graphic designer i don't care for) or full Figma/XD instructions. I wish to learn good practices on UI design, based on real knowledge, analysis and so on.

[@JesseShowalter]

I just released the best UI course on the market. www.30dayui.com/

[@fareed_adam]

Very useful. Thanks for sharing!

[@JesseShowalter]

Glad it was helpful!

[@robertbruinsmaXXXX]

That dashboard one, I understand the principles but the example you showed was worse then the previous. I would not sell a product with that dashboard

[@solensovida]

Great video, but the music is way too loud juxtaposed to the speech levels

[@JesseShowalter]

Thanks so much for watching and thank you for the feedback! Have the best day!

[@jdaniels4055]

Hey, this was really helpful!

[@JesseShowalter]

Thanks. If you want Learn more about UI design check out my new course www.30dayui.com/

[@andrescastillo07]

thank you!!

[@JesseShowalter]

You're welcome!

[@vamboo8918]

Tq

[@JesseShowalter]

Welcome

[@caiobriggs95]

amazing video

[@audreymartingreen2228]

thank you man, i use to make simple websites out of WIX . i think i can start with this exp to jump into UI/UX builder, anybody here share the same exp with me? and Good content man! thanks again

[@I_am_very_lucky.]

Wow... 😊

[@yashshrivastava5799]

Can we make all these websites through no code softwares??

[@darkwoodmovies]

There's junior designers, there's senior designers, and then there's the designers that work at Apple that got some genetic enhancing drugs or something.

[@HowellsArlen-w4b]

Allen Brenda Young Susan Davis Anthony

[@ellazeaustin1404]

Hall Angela Hall Mark Harris Brenda

[@theroboticscodedepot7736]

IMHO, Number 4 (TI 5:11) sucks! I can't even tell what the image they used is. I'm literally staring at it and I don't know what it is! Things are all over the place and the gradients are ugly and completely unnecessary.

[@8BitSlayaOnTwitch]

someone needs to @ fortnite for this

[@Larasjo]

5:33 Senior wrote forgot password at the top and you found it right? I laughed, thinking about heatmap, why should I try to touch the top right with my finger? forgot password should not be there. If senior is doing this, I laugh a lot. When a user forgets their password, they should naturally look for forgot password on the login screen. He will not see what he is familiar with and will look in the upper right hand side. why is it not next to the familiar remember me?

[@JesseShowalter]

👍🏼👍🏼👍🏼

[@Burnout3D]

Just me personally, but the senior level designs are just bland and boring. All using similar layouts to 95% of the websites today. Nothing in those websites that stick out to me to say how unique they are, nothing to help differentiate from scammer copycat sites, they all use the same blueprint. I appreciate it if a brand is gonna put in the extra effort to sell me on their product by doing something unique or just little bit differently with their site design. I'm tired of seeing the same old repetitive pattern over and over again on every website.

[@JesseShowalter]

I appreciate your perspective!! Thank you!

[@GoddessofWarr]

I agree we need a part 2 !! This is so interesting !

[@JesseShowalter]

On its way

[@justinmiller3349]

Some constructive criticism: 1.) The audio level of your intro is waaaay louder than the audio level of your voice and is super jarring. 2.) Show, dont tell. Show examples of how you would improve on the existing design.

[@A8OC]

Whilst I enjoyed the video at 17:58 you show a professional level interface. The thing that would make me walk away from that designer though? The spelling of 'satellite' is incorrect. This is an absolute pet hate of mine that words are spelt incorrectly so regularly these days in print, in online text, when it so simple to spell check something. Call me picky if you like, but it's the details that are important.

[@Oxilorix]

the intro is too loud!

[@thebehiii5087]

real dude a shat myself

[@thebehiii5087]

real dude a shat myself

[@CNW21]

Great video, but man that second senior dashboard was brutal to look at. Might have been appealing on back on windows 98 but the poor shadowing and aged look mixed with the random neon colors made it overall distracting and unappealing.

[@olhaovcharenko1663]

Hi! The last example of a login screen is that the password os in the same color as the text in the inputs or looks like this. As it is a clickable element doesn't it need to be more highlighted?

[@ledinhanhtan]

Love and wish to see more of this series !

[@OXMStudios]

great vids! a nit pick maybe would be on the design showcased at 10:36, the Belgium Flag is wrong. I know that was not the point of the video and it was probably just placeholder stuff, but I think it's important if we are trying to get taken seriously :)

[@JesseShowalter]

Not really the focus of the video but good eye

[@adyme9420]

Great Jesse. Thanks for this video. But I cannot find the link to your 3 days program. Please send it to me.

[@JesseShowalter]

Try 30dayui.com

[@analuiza2677]

These tips are amazing! Thanks so much 😊

[@cris7ea]

no chapters.............skip

[@JackJill-g1d]

1303 Olen Shores

[@Naam_Karan]

4:21 Can someone please tell me the icon and font name?

[@JesseShowalter]

Inter I think

[@KieRej]

You as a designer should be creative not a copy paster from DesignSpo

[@JesseShowalter]

It's a saturated space so there may be overlap with lot's of other content. For example here's a quick search kzbin.info?search_query=pro+vs+amateur+design See what I mean, lot's of examples 🤣

[@KieRej]

I've learnt a lot from your content tho! I appreciate @@JesseShowalter

[@animehubking1537]

Wow it really did help me a lot thx 🙏

[@rishabhkumar17]

Great!..⛳

[@JesseShowalter]

Thanks!

[@kasforai]

How will the graph changes when imported into Bubble ?

[@CURIOSITYcapital]

I am a developer... having six years of experience in php, laravel , node, express,react,nextjs sveltkit etc...i still can't design well

[@faridmaman4969]

Same as me. That’s why I watch that kind of video

[@Mariamadk]

Very informative thank you so much! i was hoping for a part two with your guidance in redesigning a junior interface design while explaining more about the details to practice it with you.

[@JesseShowalter]

Great suggestion! I’m the meantime If you want Learn more about UI design check out my new course www.30dayui.com/

[@Lisa-vh3uh]

Great video for me as a junior 😊 Thank you!!

[@JesseShowalter]

I'm so glad! If you want Learn more about UI design check out my new course www.30dayui.com/

[@jennacorre8084]

Super helpful video, thank you! Rad 'burn the ships' cap too!👊

[@JesseShowalter]

Glad you liked it!

[@ladybubble82]

Excellent video!!

[@JesseShowalter]

Thank you very much!

[@kruzader]

Thank you

[@JesseShowalter]

You're welcome