{"id":19723,"date":"2023-11-14T19:00:00","date_gmt":"2023-11-14T10:00:00","guid":{"rendered":"https:\/\/designcompass.org\/?p=19723"},"modified":"2025-06-06T13:34:21","modified_gmt":"2025-06-06T04:34:21","slug":"ux-class-update-lv2-3","status":"publish","type":"post","link":"https:\/\/designcompass.org\/en\/2023\/11\/14\/ui-design-class-update-tab\/","title":{"rendered":"UI Design Class Update: Added Tab Creation Lesson"},"content":{"rendered":"<p>A tab is a component that, when pressed, displays relevant information in a specific area. It&#039;s easy to understand if you think of switching tabs around the bottom navigation bar in a mobile app. Tabs help users easily understand by dividing large amounts of information into large chunks. It is modeled after the device used in the past to classify large amounts of offline documents or address books by grouping them by common characteristics. It is often used to reduce user awareness while containing a large amount of information. On the other hand, it may be difficult to predict what a tab contains just by its name.<\/p>\n\n\n\n<p>UI, an essential competency for product designers. We are creating the best class where you can go beyond imitating others and become an outstanding designer who can handle things freely. We will teach you the principles of how to catch fish. Instead of creating a class once and calling it a day, we update it every month to make it closer to perfection.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img fetchpriority=\"high\" decoding=\"async\" width=\"1024\" height=\"1024\" src=\"https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-02-1024x1024.png\" alt=\"\" class=\"wp-image-19724\" srcset=\"https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-02-1024x1024.png 1024w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-02-300x300.png 300w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-02-150x150.png 150w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-02-768x768.png 768w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-02-1536x1536.png 1536w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-02-12x12.png 12w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-02-600x600.png 600w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-02-924x924.png 924w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-02-671x671.png 671w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-02-1320x1320.png 1320w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-02-100x100.png 100w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-02.png 1600w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"1024\" src=\"https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-03-1024x1024.png\" alt=\"\" class=\"wp-image-19725\" srcset=\"https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-03-1024x1024.png 1024w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-03-300x300.png 300w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-03-150x150.png 150w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-03-768x768.png 768w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-03-1536x1536.png 1536w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-03-12x12.png 12w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-03-600x600.png 600w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-03-924x924.png 924w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-03-671x671.png 671w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-03-1320x1320.png 1320w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-03-100x100.png 100w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-03.png 1600w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"1024\" src=\"https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-04-1024x1024.png\" alt=\"\" class=\"wp-image-19726\" srcset=\"https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-04-1024x1024.png 1024w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-04-300x300.png 300w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-04-150x150.png 150w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-04-768x768.png 768w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-04-1536x1536.png 1536w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-04-12x12.png 12w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-04-600x600.png 600w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-04-924x924.png 924w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-04-671x671.png 671w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-04-1320x1320.png 1320w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-04-100x100.png 100w, https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-04.png 1600w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>","protected":false},"excerpt":{"rendered":"<p>\ud0ed\uc740 \ub204\ub974\uba74 \ud574\ub2f9\ud558\ub294 \uc815\ubcf4\uac00 \ud2b9\uc815 \uc601\uc5ed\uc5d0 \ud45c\uc2dc\ub418\ub294 \ucef4\ud3ec\ub10c\ud2b8\uc785\ub2c8\ub2e4. \ubaa8\ubc14\uc77c \uc571\uc5d0\uc11c \ud558\ub2e8 \ud0d0\uc0c9 \ubc14\ub85c \uc774\ub9ac\uc800\ub9ac \ud0ed\uc744 \uc804\ud658\ud558\ub294 \uac83\uc744 \ub5a0\uc62c\ub9ac\uba74 \uc774\ud574\ud558\uae30 \uc27d\uc2b5\ub2c8\ub2e4. \ud0ed\uc740 \ub9ce\uc740 \ub7c9\uc758 \uc815\ubcf4\ub97c \ud07c\uc9c0\ub9c9\ud558\uac8c \ub098\ub220 \uc0ac\uc6a9\uc790\uac00 \uc774\ud574\ud558\uae30 \uc27d\uac8c \ub3d5\uc2b5\ub2c8\ub2e4. \uacfc\uac70 \uc624\ud504\ub77c\uc778\uc5d0\uc11c \ub9ce\uc740 \ub7c9\uc758 \ubb38\uc11c\ub098 \uc8fc\uc18c\ub85d\uc744 \uacf5\ud1b5 \ud2b9\uc131\uc73c\ub85c \ubb36\uc5b4 \uad6c\ubd84\ud558\ub294 \uc7a5\uce58\uc758 \ubaa8\uc2b5\uc744 \uadf8\ub300\ub85c \ub530\uc654\uc2b5\ub2c8\ub2e4. \ub9ce\uc740 \ub7c9\uc758 \uc815\ubcf4\ub97c \ub2f4\uc73c\uba74\uc11c \uc0ac\uc6a9\uc790\uc758 \uc778\uc9c0\ub97c \uc904\uc774\ub294 \uc6a9\ub3c4\ub85c \ub9ce\uc774 \uc4f0\uc785\ub2c8\ub2e4. \ubc18\uba74 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":20145,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[891],"tags":[921],"class_list":["post-19723","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-891","tag-ui"],"acf":[],"jetpack_featured_media_url":"https:\/\/designcompass.org\/wp-content\/uploads\/2023\/11\/update-ui-class-tab-05.png","publishpress_future_action":{"enabled":false,"date":"2026-05-21 06:21:37","action":"change-status","newStatus":"draft","terms":[],"taxonomy":"category","extraData":[]},"publishpress_future_workflow_manual_trigger":{"enabledWorkflows":[]},"_links":{"self":[{"href":"https:\/\/designcompass.org\/en\/wp-json\/wp\/v2\/posts\/19723","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/designcompass.org\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/designcompass.org\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/designcompass.org\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/designcompass.org\/en\/wp-json\/wp\/v2\/comments?post=19723"}],"version-history":[{"count":0,"href":"https:\/\/designcompass.org\/en\/wp-json\/wp\/v2\/posts\/19723\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/designcompass.org\/en\/wp-json\/wp\/v2\/media\/20145"}],"wp:attachment":[{"href":"https:\/\/designcompass.org\/en\/wp-json\/wp\/v2\/media?parent=19723"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/designcompass.org\/en\/wp-json\/wp\/v2\/categories?post=19723"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/designcompass.org\/en\/wp-json\/wp\/v2\/tags?post=19723"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}