BAD USER INTERFACE / UI EXPERIENCE

John Hammond · Intermediate ·🖌️ UI/UX Design ·6y ago

Key Takeaways

The video analyzes a website with a bad UI design, discussing issues such as unclear password requirements, slow scrolling, and a confusing 'next' button, as well as frustrating navigation and a misleading CAPTCHA task, highlighting the importance of user interface design and user experience, utilizing concepts from Human-Computer Interaction and User Experience Design, and referencing tools such as GitHub and Patreon

Full Transcript

hello people in the world who are on the internet and also hello to the people who are in the world that aren't on the Internet and hello the people that aren't on the world or in the world hi I'm John it's been a little bit since I posted a video or done anything I've only gone a little bit insane so this is what I wanted to showcase and give to you because it's kind of fun kind of silly kind of stupid you know just about everything else on my channel so this was a zero daily article that came out was released the other day actually today yeah today today's the ninth right now as I'm recording this as I'm doing this it's fine one of the links they gave us was a cool note go ahead and punish yourself if your dare challenge accepted Wendie neither neither I gotta be really really sorry and apologize I don't know the best way to present pronounce your name you're really important apparently this person has a lot of followers on the Twitterverse on the world and that's cool like that that's what gives a person value I'm just kidding I'm sorry please don't please don't be upset punish yourself oh you dear let me get the original quote here it says in my denial of trust attacks talk I mentioned dark patterns this is a brilliant example of bad UI design user interface design you really can't appreciate how bad it is until you try to use it so we have this link here user in your face calm and there's some retweets here that I really like I initially misread that as denial of thrust attack and I imagined someone being poked with a fencing foil that bow is absurdly instead of penetrating sorry it looks like it should take about 16 minutes to try this kind of thing it looks like it's a bit of a game maybe 16 minutes is good I don't know we're gonna find out see how I do get it go in cold let's do it user in your face hello it says hi doesn't say hello hi and welcome to user interface a challenging exploration of user interactions and design patterns to play the game simply fill in the form as fast and as to it as possible no okay not actually a button please click here to go to the next page not a link oh shoot ah here was whoa what is saying next page is not a link okay here the word here is the actual link user in your face the site uses cookies no yes is that a problem for you yes the site uses cookies nothing happens not really no then it goes away this one being time to have to fill this out choose a password anything whoa okay I have to actually remove the line that's in there how come it doesn't hide my password LastPass not that LastPass would be able to do anything that's just trying to suggest like generate a super secure password oh god is a video back is a video good my camera dropped this is gonna be a one-of-a-kind video ladies and gentlemen make sure that all right the cuts still good we're still looking fresh what's my email john hammond 9 8 5 hurry up time is ticking thanks oh that's not a close button that's a minimum that's an expand button what is lock how come lock unlock what the heck copyright closed for 19 years that is that actually and closing what it is ok 9 85 oh jeez I can't even like tab complete here at Yahoo never drop-down menu to choose the domain yahoo.com I do not accept the terms and conditions oh I actually I do accept the terms and conditions oh please read our Terms and Conditions oh no I'm trying to scroll right now that's really slow can I just drag this oh no I can't drag it down like that ok we're just gonna like run on the scroll wheel right now except now I can press the button thank you time is ticking [Music] close huh next Oh my password requires at least ten characters at symbol anything have one capital letter have at least one numeral one needs one letter of your email and my your password is not unsafe what does that even mean my password can have at least one Cyrillic character cool eight whatever I fight hit next oh sweet it does it to an afford this is me it's complete your profile please upload I didn't know I was gonna have to upload stuff in this guy's I don't know if there's stuff I want to show you in there download image what is that is this an image is that actually trying to load something or is that is that a picture or not I don't think so I can't like obe you background image that's that that's the one that we want let's put him on the desktop desktop avatar placeholder we'll use that as the actual thank you I know damn it upload Avatar placeholder I did it maybe it did something circle things still going choose three interests ponies ponies polos I like polos I have to turn all of these off why is there oh god I can't like Mouse that way I highlighted squares on accident tires closets select all oh no oh God I really shouldn't have done the video like this I don't know if you realize it but you're actually standing on a hotel trashcan that's upside down or kind of on its side so I have my phone's going off this is a good video everybody good quality content jeezum ponies polo unselect all oh that actually does it okay windows questions and squares I like those next first name placeholder John are we still fresh the camera angle is getting worse and worse not that that really matters not that there's anything quality in the camera right now choose a title mister surname what John Street John number number what is number means street number oh it's it I can't type in that I literally cannot no stop stop we're not gonna record this video a second time I'm not gonna do it it would ruin the effect hurry up time is ticking thank you lock closed number I cannot type in this 2:10 I love it it doesn't matter age I have to drag oh god I am a hundred and fifty five I can't be up to 200 years old guys man there's a lot of years ahead of me i'ma go something real close to my age so you guys don't know how old I actually am 200 sip John City John can I do those things is that oh gosh please choose a country that school did not put me in the actual thing there where is my country that's that's it there's America happy happy July happy the day that's a couple few days into the joy box box what does that have to do with anything I know the time is ticking off damn it this uh birthday 20 August year what's 200 years ago guys this is in the way hello oh that brings it up that brings it higher up why does it do that higher somewhat excuse me hypothesis I did not write hypothesis I wrote higher higher someone else send help please wait there 468 people online send to bottom Thanks take your sweet time there buddy okay why is it start at 1900 and go down to the latest ones 2017 male whoa wait a second which of these is actually which of these is actually the one that I'm selecting male or female next why is next cancel should not be green next should be green that should be in the other place next age and birthdate don't match yeah but at least I'm in the zip code of John do I have to actually do this math now 19:19 stop scroll wheel stop send to help bottom I'm going to annoyed the people in the hotel room beside me nineteen twenty nineteen nineteen next age and birthdate do not match I have to be like one year older cuz it's not it's not 2018 right is that right excuse me can I set my age to zero so now we'll set 2019 thank you time is ticking next are you kidding me I have yet to be born to age why do I so like that that's uh oh this is agony oh my gosh my mouse stop it get out of here how can we help you're like worse than Clippy the Microsoft potato product Microsoft Office PowerPoint oh no I can't deal with this it's just not gonna let me move on am I am i doing something wrong gender and title don't match okay mister okay so I'm supposed to be male when it's highlighted its own white good almost done now select all the pictures with glasses that's not a picture that's a Glock those are glasses okay that's a picture now thank you time I appreciate you I was I'm one year old right now glasses glasses glasses he's all have glasses what a CAPTCHA is that glass I mean that's considered to be glasses those are multiple pieces of glass can I scroll down at all no okay glad I can't select those oh there's another scroll bar in here oh no go away I literally wait oh oh oh oh they're supposed to be selected above no one did I see did I not see that was that was I wrong I was wrong that's what most of these videos are all pictures with glasses okay now those are glass panes stop get out of my life validate what I have to do more of them select all pictures with a circle what what is your classification of a circle here guys because a lot of things in these pictures could constitute circles Abreva that snip oh that's definitely a hippo let's google that what in fact the hippos look like those are hippos not a circle go away I'm a square thank you I appreciate that Earth you're a circle the earth is circle that's it has a circle in it can I just validate and go select all checks locked all pictures with the bow how am I get ever gonna get this right there's no way select all checks to check mark this guy's checking an airplane it's a checkered pattern is a checkbox checking his watch checks their checkbox validate oh my gosh I'm never gonna finish this I don't want to actually take the time to select all the pictures with a circle you have proof that I'm human you know that I'm 200 years old or 0 years old these are being arranged randomly that's awful that has a circle or hip who's supposed to be circles is that is that some is there some reference I'm not getting right now I feel like I got a ragequit on this validate there's no way that I can get this do I have to select all of these pictures because they're all in glass they're all glasses I will do it thank you thank you I know it's gonna be a long video don't remind me the comments section will I didn't select that up select all pictures with glasses literally all of these have glasses of spectacles you know what I'm wearing what you might be wearing well we're all wearing maybe not all of us but validate oh my gosh I did it 12:26 guys we could have been at like 13 minutes and 37 seconds we could have been leaked do you think it says something different let's go back well we got to do it again we got to submit so they could make it last 13 minutes no can't actually go back I tried to redirect I didn't want I wanted to enjoy the dancing man oh no I said it for the bit and I really wanted to enjoy the you are awesome text it was warm in my heart all right thanks for watching guys I hope that was stupid and fun that was user in your face I can't select that text is that a picture that might be a picture view background image oh it's an SVG file it's all white zoomed out a zoom way out on that great that was fun I hope it was a cool thing I hope you enjoyed it tell your friends show your mom show your dad stay in school kids I need to end this video I'm sorry

Original Description

If you would like to support me, please like, comment & subscribe, and check me out on Patreon: https://patreon.com/johnhammond010 E-mail: johnhammond010@gmail.com PayPal: http://paypal.me/johnhammond010 GitHub: https://github.com/JohnHammond Site: http://www.johnhammond.org Twitter: https://twitter.com/_johnhammond
Watch on YouTube ↗ (saves to browser)
Sign in to unlock AI tutor explanation · ⚡30

Playlist

Uploads from John Hammond · John Hammond · 0 of 60

← Previous Next →
1 Code Commentaries? PHP to JavaScript in Bash and PHP!
Code Commentaries? PHP to JavaScript in Bash and PHP!
John Hammond
2 Tutorials? MySQL connection with PHP and Bash!
Tutorials? MySQL connection with PHP and Bash!
John Hammond
3 Variable Naming in Python! Happy Birthday, Linux! Nokia N900!
Variable Naming in Python! Happy Birthday, Linux! Nokia N900!
John Hammond
4 JavaScript Splits The URL!
JavaScript Splits The URL!
John Hammond
5 HTML Tables in Python!
HTML Tables in Python!
John Hammond
6 HTML, Net Shares, GML!
HTML, Net Shares, GML!
John Hammond
7 Python 08 Programming Style and Comments
Python 08 Programming Style and Comments
John Hammond
8 Python 26 Object Oriented Programming
Python 26 Object Oriented Programming
John Hammond
9 75 Python Tutorials, Out Now!
75 Python Tutorials, Out Now!
John Hammond
10 Batch 14 Mathematical Expressions
Batch 14 Mathematical Expressions
John Hammond
11 Batch 85 Array Append
Batch 85 Array Append
John Hammond
12 Batch 86 Array Count
Batch 86 Array Count
John Hammond
13 Batch 87 Array Index
Batch 87 Array Index
John Hammond
14 Batch 88 Array Insert
Batch 88 Array Insert
John Hammond
15 Batch 89 Array Remove
Batch 89 Array Remove
John Hammond
16 Batch 90 Array Reverse
Batch 90 Array Reverse
John Hammond
17 Python [colorama] 00 Installing on Linux
Python [colorama] 00 Installing on Linux
John Hammond
18 Python [colorama] 09 Cursor Position
Python [colorama] 09 Cursor Position
John Hammond
19 Python [hashlib] 02 Algorithms
Python [hashlib] 02 Algorithms
John Hammond
20 Python 00 Installing IDLE on Linux
Python 00 Installing IDLE on Linux
John Hammond
21 Python [pygame] 11 Rectangular Collision Detection
Python [pygame] 11 Rectangular Collision Detection
John Hammond
22 Python [pygame] 12 Platforming Rectangular Collision Resolution
Python [pygame] 12 Platforming Rectangular Collision Resolution
John Hammond
23 Python [XML-RPC] 01 Research
Python [XML-RPC] 01 Research
John Hammond
24 Python [pyenchant] 03 Personal Word Lists
Python [pyenchant] 03 Personal Word Lists
John Hammond
25 FancyURLopener Authentication and User-Agent [urllib] 03
FancyURLopener Authentication and User-Agent [urllib] 03
John Hammond
26 Python 04: PEP8 Coding
Python 04: PEP8 Coding
John Hammond
27 Python Challenge! 17 COOKIES
Python Challenge! 17 COOKIES
John Hammond
28 Google CTF 2016: Ernst Echidna
Google CTF 2016: Ernst Echidna
John Hammond
29 Google CTF 2016: Spotted Quoll
Google CTF 2016: Spotted Quoll
John Hammond
30 Google CTF 2016: Can you Repo It?
Google CTF 2016: Can you Repo It?
John Hammond
31 Google CTF 2016: No Big Deal
Google CTF 2016: No Big Deal
John Hammond
32 Google CTF 2016: In Recorded Conversation
Google CTF 2016: In Recorded Conversation
John Hammond
33 Homemade CTF Challenge: 01 "Orchestra"
Homemade CTF Challenge: 01 "Orchestra"
John Hammond
34 Homemade CTF Challenge: 02 "Bae's Base"
Homemade CTF Challenge: 02 "Bae's Base"
John Hammond
35 Homemade CTF Challenge: 03 "Web Hunt"
Homemade CTF Challenge: 03 "Web Hunt"
John Hammond
36 Homemade CTF Challenge: 04 "UPX"
Homemade CTF Challenge: 04 "UPX"
John Hammond
37 Homemade CTF Challenge: 05 "The Assumption Song"
Homemade CTF Challenge: 05 "The Assumption Song"
John Hammond
38 Homemade CTF Challenge: 06 "A Brisk Stroll"
Homemade CTF Challenge: 06 "A Brisk Stroll"
John Hammond
39 Homemade CTF Challenge: 06 "I lost my password!"
Homemade CTF Challenge: 06 "I lost my password!"
John Hammond
40 web25 :: Mr. Robot : EKOPARTY CTF 2016
web25 :: Mr. Robot : EKOPARTY CTF 2016
John Hammond
41 web50 : RFC 7230 :: EKOPARTY CTF 2016
web50 : RFC 7230 :: EKOPARTY CTF 2016
John Hammond
42 misc50 : Hidden inside EKO :: EKOPARTY CTF 2016
misc50 : Hidden inside EKO :: EKOPARTY CTF 2016
John Hammond
43 Hack The Vote 2016 CTF: Sander's Fan Club [web100]
Hack The Vote 2016 CTF: Sander's Fan Club [web100]
John Hammond
44 Hack The Vote 2016 CTF Warpspeed [forensics150]
Hack The Vote 2016 CTF Warpspeed [forensics150]
John Hammond
45 Juniors CTF 2016 :: Black Suprematic Square
Juniors CTF 2016 :: Black Suprematic Square
John Hammond
46 Juniors CTF 2016 :: Six Strange Tales
Juniors CTF 2016 :: Six Strange Tales
John Hammond
47 Juniors CTF 2016 :: Lost Code
Juniors CTF 2016 :: Lost Code
John Hammond
48 Juniors CTF 2016 :: Here Goes!
Juniors CTF 2016 :: Here Goes!
John Hammond
49 Juniors CTF 2016 :: Southern Cross
Juniors CTF 2016 :: Southern Cross
John Hammond
50 Juniors CTF 2016 :: Clone Attack
Juniors CTF 2016 :: Clone Attack
John Hammond
51 Juniors CTF 2016 :: Dirty Repo
Juniors CTF 2016 :: Dirty Repo
John Hammond
52 Juniors CTF 2016 :: Hackers Blog
Juniors CTF 2016 :: Hackers Blog
John Hammond
53 Juniors CTF 2016 :: Voting!!!
Juniors CTF 2016 :: Voting!!!
John Hammond
54 Juniors CTF 2016 :: The Good, The Bad and The Junkman
Juniors CTF 2016 :: The Good, The Bad and The Junkman
John Hammond
55 Juniors CTF 2016 :: Stop Thief!
Juniors CTF 2016 :: Stop Thief!
John Hammond
56 Juniors CTF 2016 :: ROFL
Juniors CTF 2016 :: ROFL
John Hammond
57 Juniors CTF 2016 :: Restriced Area
Juniors CTF 2016 :: Restriced Area
John Hammond
58 Juniors CTF 2016 :: Oh SSH!
Juniors CTF 2016 :: Oh SSH!
John Hammond
59 HackCon CTF 2017 TRIVIA and BONUS Challenges
HackCon CTF 2017 TRIVIA and BONUS Challenges
John Hammond
60 HackCon CTF 2017 "Bacche" Challenges
HackCon CTF 2017 "Bacche" Challenges
John Hammond

The video discusses the importance of good UI/UX design, highlighting a website with a bad design and discussing issues such as unclear password requirements and frustrating navigation, and emphasizing the need for clear instructions and feedback, utilizing tools such as GitHub and Patreon, and referencing concepts from Human-Computer Interaction and User Experience Design

Key Takeaways
  1. Identify usability issues in a website
  2. Analyze user behavior and feedback
  3. Design intuitive user interfaces
  4. Implement clear navigation and instructions
  5. Test and iterate on the design
💡 Good UI/UX design is crucial for a positive user experience, and designers should prioritize clarity, intuitiveness, and user feedback

Related Reads

Up next
Free AI UX Design Course by Figma
The Cutting Edge School
Watch →