Interactive UI/UX Crash Course

  Рет қаралды 63,336

DesignCourse

DesignCourse

Күн бұрын

Пікірлер: 84
@DesignCourse
@DesignCourse 3 ай бұрын
Soon, we will start involving ourselves with more advanced ui and motion design!
@sdskodali4971
@sdskodali4971 3 ай бұрын
yess sirrr
@Mahnoor123-y5n
@Mahnoor123-y5n 3 ай бұрын
waiting sir
@anishamalhotra6195
@anishamalhotra6195 3 ай бұрын
Yesss please
@diaarraaa
@diaarraaa 3 ай бұрын
this is amazing thanks to y’all !!
@MuratKarakus-to4tr
@MuratKarakus-to4tr 2 ай бұрын
Hi, is this gonna happen? Will there be more to this course? Because I really need to learn some. advanced stuff as well. I was thinkin of startig this series but felt a bit beginner level, I need at least intermediate. Please tell me you will be making more of these...
@deepmoitra4638
@deepmoitra4638 28 күн бұрын
00:01 Learn UI/UX design in a 6-hour course 02:11 UI focuses on aesthetics and visuals 07:03 UI/UX design tools are pivotal for interface development. 09:30 Tools for UI/UX design and testing 14:05 Understanding the purpose of navigation bars. 16:15 Place client's logo with proper alignment and whitespace 20:14 Designing with training wheels on reduces the thought process 22:18 Font size plays a crucial role in establishing visual hierarchy. 26:30 Grouping and styling elements for better UI/UX design 28:48 Using contrast and accessibility checker for web content accessibility standards 33:01 Aligning elements using Auto layout 35:05 Ensuring equal white space and alignment for better UI/UX design. 39:19 Establish grouping through whitespace and alignment. 41:23 Reviewed various submissions for UI design improvements 44:59 Improving visual hierarchy and consistency in design elements 46:45 Visual hierarchy issue addressed with button design 50:39 Designing a hero section for a website 52:33 Designing an effective hero section for a product 56:19 Adjusting line height and alignment for better visual appeal 58:22 Visual hierarchy is key in UI design 1:02:28 Adjust padding and text alignment for better UI/UX design 1:04:35 UI/UX design allows elements to extend beyond layout confines for illustrations and unimportant elements. 1:08:47 Color contrast is important for visual hierarchy 1:10:43 Discussing the integration of a fictional service for virtual instruments 1:14:42 Improving UI elements for better visibility and hierarchy 1:16:40 Improving card design and call to action placement 1:20:29 UI/UX Crash Course covering navigation, hero section, and card design with upcoming challenges and changes in design types. 1:22:10 Install the Iconify plugin for easy access to icons. 1:25:43 Proper spacing and font choices for UI elements 1:27:53 Maintain appropriate white space for better UI design 1:32:13 Tips for copying and pasting with styling 1:34:48 Design user cards to fit the landing page theme 1:38:46 Adjustments for visual balance and user experience 1:40:49 UI/UX design changes for card elements 1:44:39 UI/UX design must be responsive for all device sizes. 1:46:31 Addressing navigation in responsive design 1:50:20 Considering layout adjustments for responsive design 1:52:24 Using Whit space effectively in designing UI 1:56:43 Understanding and adjusting design elements for different screen widths. 1:59:04 Adjust size and proportions for better UI 2:03:34 Reviewing tablet and mobile UI design submissions 2:05:30 Optimizing white space for improved UI flow 2:09:33 Improving layout by reducing white space and optimizing design consistency 2:11:30 Improvements made in UI/UX design including line height and color adjustment. 2:15:26 Improving UI elements for better layout and readability. 2:17:28 Translate desktop design to tablet and phone layouts 2:21:32 Optimizing white space and font size for better clarity in design. 2:23:34 Proper element spacing is crucial for readability 2:27:33 UI/UX design adjustments for better alignment 2:29:36 Importance of getting forms right in UI/UX design. 2:33:22 Improve visibility of text fields with stroke and proper contrast 2:35:13 Styling text fields and error handling in UI/UX design. 2:39:27 Designing states for text fields 2:41:18 Visual indicators for active and error states in text fields. 2:45:25 Switch to prototype mode and set up the states and transitions. 2:47:16 Fixing the error state and adding a call to action button 2:51:22 Customize checkboxes and input fields using AIify plugin 2:53:16 Design revisions are crucial for UI/UX improvement. 2:57:10 Designing desktop UI using columns and spacing 2:59:05 UI/UX design feedback on color, graphic, and form elements 3:03:02 Utilizing same concepts for interactive UI/UX design 3:04:46 Creating button with default and hover state 3:08:58 Adding interactions in Adobe XD 3:11:09 Troubleshooting and adjusting element properties 3:15:23 Creating an infinite scrolling Marquee 3:17:20 Creating and adjusting components in UUX design 3:21:28 Introduction to Animation & Interaction Challenge 3:23:24 Explore animations and prototyping in UI/UX design 3:27:30 Implementing Speedy UI transitions 3:29:58 Using generative AI to enhance UI design workflow 3:33:51 Using website background patterns to enhance design 3:35:51 Discussing embellishments and modifications in UI design. 3:39:56 Demonstration of editing and merging layers in Figma for design workflow. 3:42:27 Using Firefly tool in Illustrator to create vector-generated assets for UIs 3:46:28 Using embellishments to change the look and feel of a layout 3:48:21 Demonstrating the process of creating and positioning shadows using the pen tool. 3:52:28 Using mid-Journey AI tool for image generation and applying glass morphism technique for UI elements. 3:54:43 Adjusting background color and opacity for better visibility 3:59:05 Get creative with layout design and style 4:00:58 Review of different designs and making necessary adjustments 4:04:46 Improving design by simplifying elements and enhancing contrast. 4:06:36 Simplification and optimization of UI elements. 4:10:15 Improved UI design for enhanced readability and clarity 4:12:12 Learn to create dark mode UI for provided layout 4:15:52 Consistency in color application is important. 4:18:09 Improving UI contrast and readability. 4:22:26 Creating a toggle button for light and dark mode variation 4:24:30 Focus on changing colors and not adding or moving elements. 4:28:04 Focus on simplicity and strong typography in hero sections 4:30:07 Create a unique single-page landing page for your design portfolio or agency. 4:33:51 Unique layout design for web professionals 4:35:44 Design concept of elevating digital interactions with animated UI 4:39:36 Transitioned from busy layouts to modern, clean designs 4:41:38 Topography and design execution need improvement 4:45:52 Designing navigation and page titles 4:47:48 Design upcoming shows display 4:52:13 Customizing design elements for better visual hierarchy 4:54:12 Designing curriculum page for a coding platform 4:57:59 Simplified UI adjustments for curriculum page 5:00:04 Adjustments made to UI for better visual hierarchy 5:03:55 Design is good, minor adjustments needed 5:05:55 Focus on creating a dashboard design with efficient use of space 5:09:35 Adding drop shadow for separation and date picker placement 5:11:25 Creating a date selector and sidebar navigation for a UI layout 5:15:22 Designing first page orders with key elements 5:17:35 Tips for selecting and using icons effectively. 5:22:00 Design a statistics feature with additional elements. 5:23:41 Optimize UI design for better usability 5:27:40 Improving UI design through color and stroke adjustments 5:29:38 Ensure proper color contrast for better readability 5:33:27 Improve visual hierarchy and contrast for better user experience. 5:35:20 Improving readability and layout for better UI/UX design 5:39:24 Enhancements made to portfolio section 5:41:27 Simplify design by removing borders and adding white space.
@estherayewoh1077
@estherayewoh1077 10 күн бұрын
Amazing. Thank you
@DiffamaNature
@DiffamaNature 9 күн бұрын
Not all superheroes wear capes. Thank you fella
@ShehryarKhtk
@ShehryarKhtk 3 ай бұрын
Starting my UI UX journey with this as my first video. THANK YOU IN ADVANCE DesignCourse.
@ArtTipswithJohnS.-ty7nr
@ArtTipswithJohnS.-ty7nr 2 ай бұрын
same here
@Nyame-Studios-BOURNEMOUTH
@Nyame-Studios-BOURNEMOUTH Ай бұрын
same here
@emmm_4465
@emmm_4465 3 ай бұрын
Awesome all in one! Please add timestamps if you can to jump between. Thank you so much ❤
@usamaamjad-z3m
@usamaamjad-z3m Ай бұрын
this course was very amazing. please make 100 days advance UX-Ui challenges.
@rafaelfonseca7942
@rafaelfonseca7942 3 ай бұрын
Because of this crash course, you've just got a new subscriber!
@aminansar5294
@aminansar5294 3 ай бұрын
Awesome stuff sir. Thanks for putting in so much effort to make this course. Very valuable
@estherayewoh1077
@estherayewoh1077 10 күн бұрын
Best tutorial out there. Thanks for posting this 😊
@slapp.martines
@slapp.martines 14 күн бұрын
Gary, bless you.
@maraxoff6393
@maraxoff6393 3 ай бұрын
The best ui ux course
@flawxy4445
@flawxy4445 Ай бұрын
Please get us some advance course on this. looking forward to it. Thanks.
@drinlajci7388
@drinlajci7388 3 ай бұрын
u got shredded bro, nice.
@ahmadasyraf665
@ahmadasyraf665 2 ай бұрын
I thought rob halford from judas priest in 80s doing tutorial😅but thousand thanx to you and really appreciate your videos..thumbs up
@Angshu1038
@Angshu1038 3 ай бұрын
Great stuff. Another 30-days series pleaseeeeeeeeeee ❤
@sdskodali4971
@sdskodali4971 3 ай бұрын
yes pleasee
@designerdude07
@designerdude07 3 ай бұрын
Feels awesome being mentioned 3 times in there 🥰
@poppingjaz
@poppingjaz 3 ай бұрын
Great stuff!! You looking like a buff 70's Judas Priest guitarist lol
@rawanack9196
@rawanack9196 3 ай бұрын
How useful ❤❤ Thank u sir I really appreciate ur efforts ❤
@yusufsami9573
@yusufsami9573 Ай бұрын
Extremely Amazing
@ImaginativeEra
@ImaginativeEra 3 ай бұрын
please make a master class for them who already knows figma and working. make them advance from mid. :D
@everythingnaruto5682
@everythingnaruto5682 3 ай бұрын
you, my sir, are a chad. awesome!
@omarahmed51512
@omarahmed51512 2 ай бұрын
This guy is jacked, damn.
@moviezpoint935
@moviezpoint935 3 ай бұрын
Mannn yorrrrr biceps 🤯
@aghileslounis
@aghileslounis 3 ай бұрын
Excellent content! Please add timestamps.
@paradox9091
@paradox9091 3 ай бұрын
Thank you 🤩
@giripiri7557
@giripiri7557 3 ай бұрын
using consolas as a font adds a steep learning curve of figuring out it's a font that needs downloading..it would be more beneficial if you use default fonts or state the obstacle your viewers need to cross. that way you make sure people with lower levels of frustration tolerance can follow the course...would say you're dealing with accessibility then, as some folks with learning difficulties will try to use this video to learn. if you use yt analytics, that will explain why people stop watching the video :)
@vladislavpalenik329
@vladislavpalenik329 3 ай бұрын
If you have learning difficulties, you definitely should not even try to learn stuff from youtube and such. The material is great, no one says is entry level OR for everyone. Why don't you try to create something for free AND for everyone to be available before criticising others that have done much more for the community than this pathetic comment of yours.
@godigitize904
@godigitize904 3 ай бұрын
Thank you bro
@multipointcreative5167
@multipointcreative5167 Ай бұрын
Lessons 3 - 14 are not available on the Figma file Pages. Is there another way to access those?
@giripiri7557
@giripiri7557 3 ай бұрын
anyone else having problems with browser memory and Figma lagging extremely? apparently, Figma uses up to 2gb per tab, and since this community file is big, any changes make big problems :/ best would be to just copy separate files and do ourselves, but as a non-paying user of Figma, I can only work on limited number of files...
@TheIndianOutcast
@TheIndianOutcast 3 ай бұрын
Man, I thought Axl Rose jumped out of somewhere to teach UI UX design 😂😂😂.
@TheDailyFa
@TheDailyFa Ай бұрын
Siigma coach
@ImaginativeEra
@ImaginativeEra 3 ай бұрын
who is going to finish this course in 1 day? :P
@PrinceNsude
@PrinceNsude 3 ай бұрын
i have stayed 5 days now 😂😂 so bad
@yuiitodoro7791
@yuiitodoro7791 Ай бұрын
U both finished this ?
@aleksandarstanisic1848
@aleksandarstanisic1848 3 ай бұрын
Ty man. 😊
@IamShafiDev
@IamShafiDev 3 ай бұрын
i clicked seeing those biceps
@qad1miy
@qad1miy 3 ай бұрын
Nice Work )
@EnglishRain
@EnglishRain 3 ай бұрын
Legend
@WaleedMujtaba
@WaleedMujtaba 2 ай бұрын
Great, how can i learn graphic design? give me some tips, Thank YOU
@lastspoil5547
@lastspoil5547 3 ай бұрын
Do you have a trailer for your UI UX course that’s on your website? I want to enroll but I want to know what I’m getting into. 😂
@starkrizwanali
@starkrizwanali 2 ай бұрын
Add 2024 in video title please add now increase reaches
@Sharmarke35
@Sharmarke35 2 ай бұрын
Hello, I have created a template that I would like to save and use in my WordPress site. Could you please provide me with the steps on how to save it as a template? Thank you.
@Ackerman-GOD
@Ackerman-GOD 3 ай бұрын
started with this challenge and figma changed it's UI :D so i have no idea where to use features like components
@ahyesthatguy60
@ahyesthatguy60 2 ай бұрын
heyy... just right click on any frame (and if its a normal element right click on that then a menu pops up where u select the frame selection option) and the click create component from there.
@giripiri7557
@giripiri7557 3 ай бұрын
which keyboard are you using?
@MrDubanddnb
@MrDubanddnb 3 ай бұрын
im 12 mins in the video and im disappointed he didn't mention "Lunacy" which is also open source and with free plan. Should i continue watching :D?
@DesignCourse
@DesignCourse 3 ай бұрын
I haven't heard of Lunacy in a long time!
@MrDubanddnb
@MrDubanddnb 3 ай бұрын
I guess Penpot also isn't bad at all, if you are ok to use web/cloud based solution. For the 2-3 hobby projects, I did with Lunacy, i could say it is doing pretty good job
@rabailahmed24
@rabailahmed24 2 ай бұрын
Bravo
@3dmodelling-vk2ud
@3dmodelling-vk2ud 2 ай бұрын
can someone help me with form design, I can't understand this topic more clearer
@Bhavishya_est
@Bhavishya_est 3 ай бұрын
Daaammmmm
@giripiri7557
@giripiri7557 3 ай бұрын
how did you add this gradient of color from bottom at 1:18:20 ?
@chriscap3784
@chriscap3784 2 ай бұрын
please give timeline in this video
@DanielHDme
@DanielHDme 3 ай бұрын
GAH DEMMMMMMM
@PrinceNsude
@PrinceNsude 3 ай бұрын
how can i submite my work ?
@Supersingularity4ever
@Supersingularity4ever 3 ай бұрын
timestamps please
@Bythewaymridul
@Bythewaymridul 3 ай бұрын
sir your biceps were teaching me not you
@littlebitrelaxation-calmre8602
@littlebitrelaxation-calmre8602 2 ай бұрын
Please add time stamps
@marcuslinux785
@marcuslinux785 3 ай бұрын
wow
@jamespaterson81
@jamespaterson81 Ай бұрын
Rodriguez Gary Thompson Shirley Martin Michael
@adityagaming7876
@adityagaming7876 Ай бұрын
his arms are bigger than video🥸
@DoraSpring-m9o
@DoraSpring-m9o Ай бұрын
Lee Donna Anderson Daniel Miller Barbara
@EquipteHarry
@EquipteHarry Ай бұрын
Allen Michelle Clark Anthony Brown Jennifer
@jadabloomfleming2318
@jadabloomfleming2318 Ай бұрын
Moore Dorothy Jackson David Miller Anthony
@estherayewoh1077
@estherayewoh1077 10 күн бұрын
Karen’s of the internet 💀
@edwards438
@edwards438 Ай бұрын
White Robert Robinson Michael Young Helen
@GraceCalvin-f2y
@GraceCalvin-f2y Ай бұрын
White Kenneth Taylor Paul Thomas Ronald
@mostlyoldschool
@mostlyoldschool Ай бұрын
I'll resume at 4:44:35
@christophermenardi1782
@christophermenardi1782 8 күн бұрын
Fantastic insight on interactive UI/UX! #mediaartssbcc
@MdMostafizurRahmantitu
@MdMostafizurRahmantitu 3 ай бұрын
wow
UI/UX Desktop Navigations in Figma (Challenge)
31:21
DesignCourse
Рет қаралды 20 М.
Reacting to 21 Design Portfolios in 22 Minutes
22:41
Flux Academy
Рет қаралды 636 М.
This dad wins Halloween! 🎃💀
01:00
Justin Flom
Рет қаралды 58 МЛН
Osman Kalyoncu Sonu Üzücü Saddest Videos Dream Engine 275 #shorts
00:29
Каха и лужа  #непосредственнокаха
00:15
5 UX/UI Portfolios You SHOULD Copy
15:02
Leander Angst
Рет қаралды 111 М.
Why Beautiful Websites Don’t Convert
12:57
Malewicz
Рет қаралды 211 М.
How I Made The Career Switch to UX Design at 30 years old
19:32
Every React Concept Explained in 12 Minutes
11:53
Code Bootcamp
Рет қаралды 759 М.
"The Life & Death of htmx" by Alexander Petros at Big Sky Dev Con 2024
23:01
Montana Programmers
Рет қаралды 67 М.
UI / UX Design Tutorial - Wireframe, Mockup & Design in Figma
1:26:21
freeCodeCamp.org
Рет қаралды 2,6 МЛН
Free Figma Crash Course for Beginners 2024 | UI/UX Design
1:01:20
DesignWithArash
Рет қаралды 720 М.
How to Earn Lakhs as a Freelancer?
43:22
Cutting Edge School by Ansh Mehra
Рет қаралды 180 М.
The UI/UX of Hero Sections (Challenge)
24:41
DesignCourse
Рет қаралды 15 М.
This dad wins Halloween! 🎃💀
01:00
Justin Flom
Рет қаралды 58 МЛН