Discover 27 Essential UI Elements that Will Transform Your UX Design Process (Lesson 15)

Today's topic:
There's no need to reinvent the wheel when creating digital interfaces. We created this guide to help you fast-track your UX Design process on your next project with these 27 UI elements.

Get your FREE Figma workbook and resources here:

Video chapters:
0:00 ⏤ Introduction
0:27 ⏤ Lesson Overview
0:40 ⏤ 1. Primary Buttons
2:04 ⏤ 2. Secondary Buttons
2:54 ⏤ 3. Tertiary Buttons
4:20 ⏤ 4. Toggle Buttons
4:52 ⏤ 5. Segmented Controls
5:28 ⏤ 6. Icons
6:04 ⏤ 7. Checkboxes
6:42 ⏤ 8. Radio Buttons
7:18 ⏤ 9. Dropdown Lists
7:57 ⏤ 10. Text Fields
8:34 ⏤ 11. Date Picker
8:54 ⏤ 12. Search Fields
9:14 ⏤ 13. Pages or Pagination
9:35 ⏤ 14. Tabs
10:15 ⏤ 15. Sliders
10:44 ⏤ 16. Tags
11:28 ⏤ 17. Breadcrumbs
12:02 ⏤ 18. Carousels
12:31 ⏤ 19. Notifications
13:49 ⏤ 20. Modals
14:42 ⏤ 21. Menus
15:13 ⏤ 22. Cards
15:48 ⏤ 23. Progress Bars
16:03 ⏤ 24. Progress Indicators
16:38 ⏤ 25. Tooltips / Hints
17:13 ⏤ 26. Hamburger Menus
17:53 ⏤ 27. Accordions
18:26 ⏤ Recap
18:58 ⏤ Outro

#ux #ui #design

[rajaiswarya]

This is so cool 😎 easy check list to learn elements.

[mailsudshekhar]

This is super quick and easy to learn UI elements from this video. Thanks for sharing the Free UX course - Course materials as well 🤛🤛

[brockman]

why would a dropdown be preferred when you have to select a country? then when you click on dropdown menu, you're presented with 150 countries. wouldn't that be a bad user experience? ...having to scroll to the bottom to get to 'yemen'? wouldn't' it be better to just have a field/text field where user inputs zip code and country is 'auto filled'?

[AkshayKumar-gyos]

Hello!
I am unable to download either the UI Kit or course material so what should I do even I got mails for both the things.

Please help me out.
Thank you.