I Designed Your Goofiest UI Ideas

Design should be fun. What happened to this? Or this? Or this? Or this? What happened to colorful UI and buttons that look like candy? What happened to being a little adventurous? Well, I'm feeling adventurous today, and you guys gave me 600 ideas to satisfy that chaotic need. And I chose the wildest, craziest, outright nefarious, and sometimes actually kind of good ideas to design out of them. So, let's get this party started. Mojo said, "Design a watch UI for traveling in time. You can check which time or location is safe or unsafe to travel to, disaster warnings, etc." The first thing that comes to my mind is Avengers Endgame. How they tap on this watch thing they have to go to a prespecified time and location, but that doesn't have a UI. The second thing I can think of is Back to the Future, which has indicators for present time, destination time, and the time you've last departed because you got to keep track, right? Honestly, I haven't even fully captured those three movies yet, let alone time travel as we know it today. But I know that you can't just grab your watch, open the time travel app, input a time, and hit go. What if someone dug a hole right underneath your feet in the future? This is simply a bad product. Let's say time is a stream. So, just like it could exist in different locations on Earth, you can exist in different times along the stream. It's a constant going forward. So, on a calendar, times that you have lived in should be marked. Maybe you live in some other time for only 3 hours. that should be recorded too. Then you need to see the dangerous times reported by other users. So try not to travel to those days. Instead, choose a better date, select a time, and hold go. Now your watch is recording you living in that time. You could add a note for future reference or past reference. When you travel back to your time and you notice something isn't right, the app tells you that you're not in your own timeline anymore. And oh sh How many times do they have to tell you to respect time travel laws? They're going to be here any minute. Quick, you need to leave. CDKW2 said, "Try to design old Nintendo, Pepsi, or Apple websites, but with their current color schemes to make an amalgamation of retro and modern web." For this challenge, I'm going to choose Apple because their colors changed a lot since, let's say, 2001. They looked so bright back then, and now they look more dark and shiny instead. So, what if we put this into this? Let's see. I'm kind of scared, but let's try a dark theme with the old menu. Hm. That's That's all right. The bottom menu goes nice, too. But let's not forget these lines at the back. And now the iMac. Maybe I'll add a little reaction, a little blur here, and the texts and their original font. But now we're going to add little blue buttons like the new website. And wait, that actually slaps. It kind of looks like the UI modernized, but the tech didn't, which is funny if you think about how UI evolved right alongside tech. Let that sink in. For this bottom part, I'll just put the images in the center and the texts on top. Kind of like the Apple website today. And we've got ourselves a solid alternate reality Apple website. Honestly, I didn't expect it to look half as good as this, but here you are. The old Apple website with modern styles. Mr. No Maiden said, "Not quite sure if this falls under UI, but make chunks of the mouse cursor fall off when clicking until there is no cursor." Now, this is a great suggestion, actually. I mean, think about it. Cursors are so overused that nothing ever happens to them despite being like any other tool. And we know that tools can break, right? The reality is chunks of your cursor could fall off with every click and before you know it, your cursor is gone and you would have to renew your cursor. Okay, no, that is evil. Maybe something more fun, like the button we're trying to click on is made of rock. And maybe the cursor is made of glass, so every time you try to click, a piece of the glass breaks. Sad and lonely. But let's make it even more emotionally draining. What if the text changed and rushed you to click? I'm trying. Okay. For this one, I put the code out there. So, why don't you go give it a click? A mean said, "A PC builder web app using only skuomorphic components." So, you're saying PC part picker but realistic? Oh, hell yeah. PC Part Picker is a website where you can choose different components for the PC you want to build. And honestly, it's a lifesaver. A lot of people told me to redesign it, but I feel like it works. And for a data heavy site like this, it's good when it's simple. But when I saw that idea, I immediately thought of PC Building Simulator, the game that allows you to assemble different PCs. And I thought, well, why not mix them? Let's say you have your desk and you're trying to come up with a list of components to buy, but not this robotic, something more realistic, like on an actual piece of good old paper. You draw your lines, you write your component list, and it's time to do some research. So, pop your knuckles and get on with the first, your case. You choose something from your list and taa, it appears right here on your desk. As you go ahead with other components, they visually appear in the same spot they would when you assemble them. Your RAM, your storage, your GPU, case fans, and done. Here's your grand total. That was easy enough, but it's not that simple. You need to check if your components are even compatible or what's the estimate wattage of this build. And in the end, you need your buttons to save your setup or be able to sign up or login and all that stuff. What a nice PC. Can't wait to order it and play this baby on it. So, tell me, what will your belt look like? Cine said, "A music app like Spotify that works like a vinyl player where you'd have to take albums from a shelf, pull out the vinyl, and put it on the record player to start playing a song." Okay, I have a theory. I think we humans listen to music in a repeated process of listening, feeling, listening, feeling, and listening more and feeling more. And ideas like this, they add another layer of seeing, touching, smelling, and a bunch of other senses to it. like the old Windows media player and other popular skins of it. So, let's actually redesign a Spotify in record player. We need shelves for the album or playlist categories up here. I was thinking of making it more like a record storage where you check out the albums one at a time. And that's just more realistic cuz who in real life arranges all their records on a flat space to decide what to listen to every time? But on a phone, it's only good when you're not in a hurry to just play something and make the voices stop. So, I'll just go with the first one down here. We need an empty record player, plain and simple. Probably some controls like volume or next and previous track and maybe even a shuffle button. Just adds to the general realism. Now, let's listen to this playlist. It comes up, shows you a list of the tracks in the playlist or album. We grab the vinyl and put it in the record player. Then, it starts playing from the side towards the center, and that's when the playlist is finished. No track bar or pause or play button. This is the real deal. If you want to pause a record player, you would lift the tone arm. But this is as realistic as possible. So instead, we just tap the tone arm and it stands aside like a good boy. Then you can go to the next track, play another album, and basically just live the [Music] life. Brilliant. Today's sponsor said, "Here's an idea. What if you could learn more about tech and computers through interactive lessons? Every lesson has multiple quizzes and playgrounds so you can really capture the stuff you're learning. It literally never gets boring." and motivates you to keep on learning every day. And there are courses in every tech field, math, programming, data analysis, and so much more. The math courses on Brilliant really help consolidate mathematical concepts for me as someone who does a lot of creative coding. The best part of all of this is you can visit brilliant.org/jxapose to try Brilliant for free for 30 days and see for yourself. Just click on the link in the description or scan this QR code. You'll also get 20% off an annual premium subscription. Matt for me said in Family Guy, there's an episode where Peter Griffin goes under his house to a secured facility, enters a thousand passwords, goes through a lot of security checks, and at the end, all of that just to read some journal. Would be cool to have an authentication system like that. What am I doing with my life? The very first step of the authentication is your username and password. Duh. If you're thinking why I chose this specific design for it, one, I've been really wanting to try this style for a while. Two, it's more secret and futuristic. and three you'll see in a minute. The second step is your biometric verification, your Face ID or your Touch ID, whichever one you chose. The third step is obviously a code sent to your email cuz why not? We love those anyway, don't we? The fourth step is your security question. You might ask, which question? Well, if it's really you, you would know, wouldn't you? Now, the fifth step, enter your PIN. That's an easy one. Step six, typing test. You got to match your previously recorded typing speed. Don't worry, you'll just have to score around the same number. Step eight, confirming your geol location. Step nine, wait for the doors to open. What? It's a shame, honestly. Keeping this poor snake here on autopilot to eat all the apples and get trapped inside the box over and over again. And you have the audacity to come back here and keep feeding it apples, too. Go little snake, go be free. This design experience is officially over. William Defense said, "Make an app like a streaming service that is filled with ads and pop-ups, requiring multiple clicks and pop-ups to cancel the subscription or exit the service, but only takes two or a few clicks to subscribe. Make the app as painful to use as possible." The way I see this is grab Netflix or Prime Video and take it to a more evil alternate reality. Hell, it's not even about the design. It's about the art of making users subscribe and keeping them subscribed. I mean, you're not going to not allow them to unsubscribe. No, that would be unethical. There are other ways. Disclaimer: streaming services, please do not try this at home. Step one, hide the unsubscribe button, but don't completely hide it. Just make it small and maybe not so straightforward. Like, how about changing the phrasing to stop receiving premium entertainment? Huh, how about that? Step two, put as many ads as possible. Maybe even on the unsubscribe button and you can only close it after 5 seconds. Step three, make an ad about a limited time offer show up just as the user is about to go for the unsubscribe button. Step four, you want to unsubscribe? Well, you should know that we will be heartbroken. We are trying to fund thousands of creators and their families and you'll have to watch twice the ads. We hope you're happy. Step five, are you really sure you want to unsubscribe? I mean, have you looked at our new new crazy discount? Come on, it's $2 less than the previous deal. Just take it. Step six, beat this game and you can unsubscribe without a fee. Oh yeah, step seven, impose an unsubscribing fee. Hey, I learned from the best. Okay, back to step six, beat this game. Can't beat the game? No worries. Try again after this quick ad. Great, you don't have to pay any fees now. Step eight, hold this button to unsubscribe. That's it. No tricks. Just trying to make sure it didn't accidentally end up here and that you're fully certain that you want to cancel. Step nine. Please enjoy this ad while we process your request. Step 10. We'll check your request in 72 hours. Until then, feel free to cancel your request and keep your subscription. Oh, shut up. Dark Matter Maestro said, "Games often make staring in menus and interacting with UIs feel great in a way that apps rarely do. Thus, I'd like to see some apps UI designed in the style of some distinctive games. For example, Thunderbird, the email client, in the style of Skyrim's UI. Okay, beside the fact that this idea is cool in general. I mean, that's why so many game UI skins exist for different apps, it's also true. I love to check my emails if it looked like Skyrim, so why the hell not? Back then, the meme was that if it exists, there's a Skyrim mod of it. But is there a Skyrim mod for it? The only challenge here is capturing the true essence of Skyrim's little quirky arcade style. No, there are no design resources for it. Fine, I'll do it myself. It's literally just redrawing everything. All right, let's replace the replaceables with my cool new Skyrim email address. I mean, the Elder Scrolls address, all the different mail categories. Separate it with this cute little line. Put a beautiful wallpaper at the back and wait for the mails to come in. Welcome to the Tamreel mailing system regarding that dragon incident. Oh, this must be important. Let's build this side of the app, too, and open the mail. Citizen, it has come to my attention that you were present during the dragon attack at the Western Watchtower. My court wizard, Farenar, would like to speak with you at your earliest convenience. Okay, delete. Well, I'll leave the rest of the emails to you, Dragon Born. Soulbean said, "Redesign a UI idea from another person's form and make it VR boxing." Oh, I have the perfect design for this. The subscription nightmare. There are several games I can't live without on VR. And I mean, I use them as therapy. Beat Saber, Synth Riders, Fruit Ninja, and games like that. And what's more therapeutic to punch than excessive ads? Clicking on them earlier was all right, but not good enough. So, I'm going to bring this game to VR. The first step is recreating the UI in 3D. But there is no way I'm turning all of this into textures one by one. So, I'll do an imitation of the site for VR. If the site detects a VR headset, it allows you to play the game in VR. Oh, hi guys. Because why would you do this when you can do this? This is too easy. Crank up those numbers. Whoa, stop. Stop. Okay, I've settled somewhere in between. It starts slow and easy. Okay, it starts slow and gets more difficult in time. Okay, pause. What are these? This isn't a fist. It has to be a fist. Otherwise, you might not get the assignment. After searching on different websites for a while for a simple hand, I came across this. It's perfect. Now I just need to put it on as a two controllers. Smash. Okay, maybe a little smaller. Now I'm going to create some more ad types, add a bunch of punching sound effects, and improve the game settings and its environment. Oh, we are so back. This is a therapy. Now that I'm thinking about it, I need a whole website just for this. BCS said, "Design a mobile OS using the Fruity Fruity Gear Figero fuigator fruity gearo." This isn't such an out-of- pocket idea, but ever since the new iOS dropped, I've been dying to redesign the control center in Frerier Arrow style like the old iPhone OS's. Fruier Arrow was a bluish glossy design style during the 2000s, like on Windows Vista or Windows 7. I really love the style, but I feel like it's getting a little too romanticized nowadays. I can't blame anyone, though. It's literally eye candy, unlike the new iOS 18 control center. It does look a bit weird at the first glance, but the advantages definitely outweigh the disadvantages. like how you can finally customize everything for yourself, which was awesome because the very first thing I did was get rid of multiple pages and put everything in one page, more specifically down here where my thumb can reach everything easily. All that aside, this control center is more rounded and uses more colors, so it's yelling for some happy 3D effects. First, I'm going to change the background to something blue and green because, well, then I'll remove the dark colors and give it some basic shadows, light and dark on opposite sides. Then I'm going to slap the glossy effect on top of it. Now let's bring the colors from the icons to the entire button instead and make them all a little shinier. And for the final controversial move, I'm going to round out these two completely. And also maybe add little shiny circles. And here you go. iOS becomes eye candy OS. Y2K38 said, "Please make a countdown to the year 2038 with something really cool around numbers. make it crash like falling elements or whatever, symbolizing the end of 32-bit time, like a game you could not win. The year 2038 bug is a bug that makes old 32-bit computers not be able to show the time after 3:1407 a.m. January 19th, 2038. 32-bit systems can only count about 2 billion seconds after the arbitrary beginning of time, which was January 1st, 1970. And those two billion seconds will be up in 2038. After that, the computers will either revert to the 1970 time or show some other behavior. Don't worry though, your 64-bit computers are safe, but only until the year 292 billion. So, don't get too happy. For this website, I want to go a little retro. So, I'm considering the whole site a monitor. Then, I'm putting the exact days, hours, minutes, and seconds till the apocalypse on the top in a pixelated font cuz, well, first, it's me, and second, it's more retro like Windows 98 fonts. Now, how can I play with numbers in a game that I can't win? Hm. You know, the best thing about a game where you can't win is that you can't lose either. So, the only thing you're losing is time. Oh, wait. Losing time. Say that again. Like a game of Breakout where you hit the ball at the blocks on the top to eliminate them. We could have a paddle-like thing down here with a ball and it hits these blocks on the top. But here's the catch. Every second the numbers get updated, refilling the blocks again. So, when you hit the second blocks, they refill the next second. You hit the minute blocks, they refill the next minute. And the day blocks refill the next day. You might say, "But Jax, this is super easy. I could just destroy all the day, hour, and minute blocks and then it's boring." Yeah, that's right. And that's why we pull a super breakout and every minute refill one of the rows on all numbers. Now, how about that, huh? Of course, if you use the game physics, like hit the ball with a certain angle and speed, you could take out more blocks, but you're not really achieving anything. Remember, you're not stopping the countdown or the time. And every time you lose, everything goes back to normal. It's finally time to design the most requested idea of all, to destroy a website. And I found this a very good opportunity to demonstrate just how invincible Tumblr actually is. Yeah, Tumblr. You either use it or you never know what it's really about. The Tumblr UI is such a vibe. It has interesting or unique choices sometimes, and other times it could probably use a little improvement. But that's not what I'm doing today. Today, I want to destroy it step by step. Step one, Fabrizio said, "I'm interested to see how many different colors you can fit into one design with all of them still being in cohesion." Well, good thing Tumblr supports multiple themes and customizations, so I can happily go ahead and change everything into a different color. Make the background purple, the sidebar something like yellow and orange. For this site, something obnoxious, but not horrible obnoxious, more like complimentary obnoxious. Change these backgrounds into very light red. Make this one red and orange with a blue button on top. Turn all the follow buttons pink, all the usernames blue, and choose a green for this button right next to the pink because it's more harmonic. The rest of the stuff can be red or orange, too. And that's most of the colors. And if you look at it long enough, you might start to get used to it. It's actually not half as bad as I thought. Step two, real goose said, make a product site or something like that where absolutely everything is misaligned. This one should be easy. Move these ones apart and this one to the left. Mess the whole thing up here and move these ones to be untidy. Move this one out. Misalign these and make everything untidy up here. Finally, let's change the buttons in an eccentric way. Hm. What else can we mess up? Oh, yeah. I was almost forgetting. Change the line height here too. It's still missing just one more thing here. I see you. I can already see it all coming together. Step three, and I came up with this all on my own. Font frenzy. The whole fut of making this look cursed is to be absolutely random with the fonts. Yeah, I could just choose comic sands or papyrus. That would be funny, wouldn't it? But you already know those. So, for these ones, I'm just closing my eyes and rolling the middle mouse button on the font list. Are you kidding me? This is adorable. Same thing for the rest of them until it all looks different and unhinged. And here's the final product. As I said before, Tumblr UI is a vibe. And truth be told, I kind of vibe with this. The whole website is silly and not trying to take itself too seriously. So, if they actually allowed me to make this on it, I probably would. Okay, I wouldn't. This whole silliness and trying weird ideas is affecting me and not in a good way. So, I guess I'll have to stop here. But I really, really had fun doing this. And I wish I could design more of your cool ideas, but I couldn't fit them all in one video. So, for the next one, tell me what else I should make. Well, that's all for this video. If you liked it, make sure you do your magic down below, and see you on the next one.