{"id":3530,"date":"2025-11-13T10:51:22","date_gmt":"2025-11-13T03:51:22","guid":{"rendered":"https:\/\/portal-atlasx.cdg.co.th\/home\/?post_type=docs&#038;p=3530"},"modified":"2025-11-13T10:55:29","modified_gmt":"2025-11-13T03:55:29","slug":"prototyping-with-figma","status":"publish","type":"docs","link":"https:\/\/portal-atlasx.cdg.co.th\/home\/docs\/gis-design-system-v1-0\/how-to-use\/prototyping-with-figma\/","title":{"rendered":"Prototyping with Figma"},"content":{"rendered":"\n<h1 class=\"wp-block-heading\" id=\"prototyping-with-figma\">Prototyping with Figma<\/h1>\n\n\n\n<div class=\"wp-block-group has-global-padding is-layout-constrained wp-container-core-group-is-layout-a31aa551 wp-block-group-is-layout-constrained\">\n<p>\u0e27\u0e34\u0e18\u0e35\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19 Design System \u0e1a\u0e19 Figma \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e01\u0e32\u0e23\u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a Prototype \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e42\u0e04\u0e23\u0e07\u0e01\u0e32\u0e23\u0e15\u0e48\u0e32\u0e07\u0e46<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>\u0e40\u0e02\u0e49\u0e32\u0e44\u0e1b\u0e17\u0e35\u0e48 Figma Master File \u0e14\u0e49\u0e27\u0e22\u0e25\u0e34\u0e49\u0e07\u0e01\u0e4c\u0e19\u0e35\u0e49\u00a0<a href=\"https:\/\/www.figma.com\/file\/b6ACnlnRiKco3uI26HQTxV\/%F0%9F%92%A1GISC---Design-System-v1.0?type=design&amp;t=Q5QHpenJmrNwDjIT-6\" target=\"_blank\" rel=\"noreferrer noopener\">https:\/\/www.figma.com\/file\/b6ACnlnRiKco3uI26HQTxV\/%F0%9F%92%A1GISC&#8212;Design-System-v1.0?type=design&amp;t=Q5QHpenJmrNwDjIT-6<\/a><\/li>\n\n\n\n<li>\u0e04\u0e25\u0e34\u0e01\u0e17\u0e35\u0e48\u0e1b\u0e38\u0e48\u0e21\u0e25\u0e39\u0e01\u0e28\u0e23\u0e2b\u0e25\u0e31\u0e07\u0e0a\u0e37\u0e48\u0e2d\u0e44\u0e1f\u0e25\u0e4c GISC &#8211; Design System v1.0 \u0e08\u0e32\u0e01\u0e19\u0e31\u0e49\u0e19\u0e04\u0e25\u0e34\u0e01\u0e17\u0e35\u0e48 Duplicate to your drafts \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e17\u0e33\u0e2a\u0e33\u0e40\u0e19\u0e32\u0e44\u0e1f\u0e25\u0e4c\u0e21\u0e32\u0e44\u0e27\u0e49\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e40\u0e1b\u0e47\u0e19 Prototype \u0e02\u0e2d\u0e07\u0e42\u0e04\u0e23\u0e07\u0e01\u0e32\u0e23<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image aligncenter\"><img decoding=\"async\" src=\"https:\/\/portal-atlasx.cdg.co.th\/assets\/images\/guideline\/howtouse\/figma\/figma-02.jpg\" alt=\"\" title=\"null\"\/><\/figure>\n\n\n\n<ol start=\"3\" class=\"wp-block-list\">\n<li>\u0e44\u0e1b\u0e22\u0e31\u0e07\u0e44\u0e1f\u0e25\u0e4c Figma \u0e17\u0e35\u0e48 Duplicate \u0e21\u0e32\u0e41\u0e25\u0e49\u0e27 \u0e17\u0e35\u0e48\u0e41\u0e16\u0e1a\u0e40\u0e21\u0e19\u0e39\u0e14\u0e49\u0e32\u0e19\u0e0b\u0e49\u0e32\u0e22 \u0e04\u0e25\u0e34\u0e01\u0e17\u0e35\u0e48\u0e1b\u0e38\u0e48\u0e21\u0e40\u0e04\u0e23\u0e37\u0e48\u0e2d\u0e07\u0e2b\u0e21\u0e32\u0e22\u0e1a\u0e27\u0e01\u0e2b\u0e25\u0e31\u0e07\u0e04\u0e33\u0e27\u0e48\u0e32 Pages \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e43\u0e2b\u0e21\u0e48<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image aligncenter\"><img decoding=\"async\" src=\"https:\/\/portal-atlasx.cdg.co.th\/assets\/images\/guideline\/howtouse\/figma\/figma-03.jpg\" alt=\"\" title=\"null\"\/><\/figure>\n\n\n\n<ol start=\"4\" class=\"wp-block-list\">\n<li>\u0e17\u0e33\u0e01\u0e32\u0e23\u0e2a\u0e23\u0e49\u0e32\u0e07 Frame \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e43\u0e0a\u0e49\u0e40\u0e1b\u0e47\u0e19\u0e2b\u0e19\u0e49\u0e32\u0e15\u0e48\u0e32\u0e07\u0e46 \u0e02\u0e2d\u0e07 Prototype \u0e42\u0e14\u0e22\u0e01\u0e32\u0e23\u0e04\u0e25\u0e34\u0e01\u0e17\u0e35\u0e48\u0e40\u0e21\u0e19\u0e39 Region Tools > Frame \u0e08\u0e32\u0e01\u0e19\u0e31\u0e49\u0e19\u0e40\u0e25\u0e37\u0e2d\u0e01\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e17\u0e35\u0e48\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e32\u0e23<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image aligncenter\"><img decoding=\"async\" src=\"https:\/\/portal-atlasx.cdg.co.th\/assets\/images\/guideline\/howtouse\/figma\/figma-04.jpg\" alt=\"\" title=\"null\"\/><\/figure>\n\n\n\n<ol start=\"5\" class=\"wp-block-list\">\n<li>\u0e01\u0e32\u0e23\u0e40\u0e1e\u0e34\u0e48\u0e21 Component \u0e2a\u0e33\u0e40\u0e23\u0e47\u0e08\u0e23\u0e39\u0e1b\u0e15\u0e48\u0e32\u0e07\u0e46 \u0e17\u0e35\u0e48\u0e21\u0e35\u0e43\u0e2b\u0e49\u0e43\u0e0a\u0e49\u0e43\u0e19 GISC Design System \u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e17\u0e33\u0e44\u0e14\u0e49\u0e42\u0e14\u0e22\u0e01\u0e32\u0e23\u0e04\u0e25\u0e34\u0e01\u0e17\u0e35\u0e48\u0e40\u0e21\u0e19\u0e39 Resource \u0e08\u0e32\u0e01\u0e19\u0e31\u0e49\u0e19\u0e20\u0e32\u0e22\u0e43\u0e15\u0e49\u0e41\u0e17\u0e47\u0e1a Components \u0e43\u0e2b\u0e49\u0e40\u0e25\u0e37\u0e2d\u0e01 Component \u0e17\u0e35\u0e48\u0e04\u0e38\u0e13\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e32\u0e23\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e25\u0e07\u0e44\u0e1b\u0e22\u0e31\u0e07 Frame<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image aligncenter\"><img decoding=\"async\" src=\"https:\/\/portal-atlasx.cdg.co.th\/assets\/images\/guideline\/howtouse\/figma\/figma-05.jpg\" alt=\"\" title=\"null\"\/><\/figure>\n\n\n\n<ol start=\"6\" class=\"wp-block-list\">\n<li>\u0e04\u0e38\u0e13\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e1b\u0e23\u0e31\u0e1a\u0e41\u0e15\u0e48\u0e07\u0e2a\u0e35 \u0e15\u0e33\u0e41\u0e2b\u0e19\u0e48\u0e07 \u0e02\u0e19\u0e32\u0e14 \u0e23\u0e39\u0e1b\u0e41\u0e1a\u0e1a \u0e41\u0e25\u0e30\u0e2d\u0e37\u0e48\u0e19\u0e46 \u0e02\u0e2d\u0e07 Component \u0e44\u0e14\u0e49\u0e08\u0e32\u0e01\u0e41\u0e16\u0e1a\u0e40\u0e21\u0e19\u0e39\u0e17\u0e32\u0e07\u0e14\u0e49\u0e32\u0e19\u0e02\u0e27\u0e32<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image aligncenter\"><img decoding=\"async\" src=\"https:\/\/portal-atlasx.cdg.co.th\/assets\/images\/guideline\/howtouse\/figma\/figma-06.jpg\" alt=\"\" title=\"null\"\/><\/figure>\n<\/div>\n","protected":false},"featured_media":0,"parent":3529,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"nav_title":"","positive":"","negative":"","footnotes":""},"docs_category":[],"class_list":["post-3530","docs","type-docs","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/portal-atlasx.cdg.co.th\/home\/wp-json\/wp\/v2\/docs\/3530","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/portal-atlasx.cdg.co.th\/home\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/portal-atlasx.cdg.co.th\/home\/wp-json\/wp\/v2\/types\/docs"}],"replies":[{"embeddable":true,"href":"https:\/\/portal-atlasx.cdg.co.th\/home\/wp-json\/wp\/v2\/comments?post=3530"}],"version-history":[{"count":10,"href":"https:\/\/portal-atlasx.cdg.co.th\/home\/wp-json\/wp\/v2\/docs\/3530\/revisions"}],"predecessor-version":[{"id":3540,"href":"https:\/\/portal-atlasx.cdg.co.th\/home\/wp-json\/wp\/v2\/docs\/3530\/revisions\/3540"}],"up":[{"embeddable":true,"href":"https:\/\/portal-atlasx.cdg.co.th\/home\/wp-json\/wp\/v2\/docs\/3529"}],"wp:attachment":[{"href":"https:\/\/portal-atlasx.cdg.co.th\/home\/wp-json\/wp\/v2\/media?parent=3530"}],"wp:term":[{"taxonomy":"docs_category","embeddable":true,"href":"https:\/\/portal-atlasx.cdg.co.th\/home\/wp-json\/wp\/v2\/docs_category?post=3530"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}