หน้าเว็บไหนก็เป็น
เลเยอร์ Figma ที่แก้ไขได้
ข้อความจริง สีจริง Auto Layout และคอมโพเนนต์ที่ปรับได้ ไม่ใช่ภาพหน้าจอ หน้าที่ต้องล็อกอินก็จับได้ และทุกอย่างเกิดขึ้นบนเครื่องคุณเอง ไม่มีการอัปโหลดไปไหนทั้งนั้น
ต้องใช้ทั้งคู่ ส่วนขยายเป็นคนจับหน้า ปลั๊กอิน Figma เป็นคนวาง ทั้งสองฟรีและติดตั้งไม่ถึงนาที
วิธีใช้
จับสิ่งที่เห็นตรงหน้า
Copy for Figma
ติดตั้งปลั๊กอิน แล้ววาง
สร้างมาเพื่อหน้าที่เครื่องมืออื่นเข้าไม่ถึง
Snapture อ่านหน้าเว็บสด ๆ ในเบราว์เซอร์ของคุณ อะไรที่คุณมองเห็น คุณจับได้หมด ทั้งแดชบอร์ดหลังล็อกอิน เครื่องมือภายในบริษัท ลิ้นชักกับป็อปโอเวอร์ที่เปิดค้าง รวมถึงเว็บคอมโพเนนต์และ iframe
หน้าที่ต้องล็อกอิน
การจับทำงานในแท็บที่คุณล็อกอินอยู่แล้ว เครื่องมือภายใน แดชบอร์ดแบบเสียเงิน และเว็บ staging จึงแปลงออกมาตรงตามที่คุณเห็นเป๊ะ
Auto Layout เที่ยงตรงระดับพิกเซล PRO
เลย์เอาต์ flex และ grid กลายเป็น Auto Layout ของจริง แต่เฉพาะเมื่อเอนจินของ Figma วางลูกทุกตัวได้เพี้ยนไม่เกินครึ่งพิกเซลเท่านั้น ถ้าไม่ผ่าน คุณจะได้พิกัดสัมบูรณ์ที่แม่นยำแทน ไม่มีอะไรขยับเคลื่อนเลย
ไอคอนมาครบ
ไอคอนแบบ CSS mask, SVG sprite และ icon font คือสามวิธีวาดไอคอนที่ตัวแปลงส่วนใหญ่ทำหล่นหาย Snapture รองรับครบทั้งสาม
กราฟ แผนที่ 3D
แคนวาส WebGL กับ embed ข้ามโดเมนไม่มีใครแปลงเป็นเลเยอร์ได้ Snapture จึงวางภาพหน้าจอคมชัดของตรงบริเวณนั้นแทนที่จะเป็นกล่องสีเทา ส่วน iframe โดเมนเดียวกันไปไกลกว่านั้น คือแปลงเป็นเลเยอร์จริง
คอมโพเนนต์และสไตล์ PRO
การ์ดที่ซ้ำกันกลายเป็นคอมโพเนนต์พร้อมอินสแตนซ์ ตัวอักษรกับสีที่ใช้ซ้ำกลายเป็นสไตล์ และสีที่เว็บประกาศเป็นตัวแปร CSS มาถึงเป็นตัวแปร Figma ภายใต้ชื่อเดิมของเว็บเอง เช่น brand-primary ไม่ใช่รหัส hex
ส่งผ่านคลิปบอร์ด
จับ แล้ววาง ไม่ต้องมีไฟล์ งานจับเดินทางไปหาปลั๊กอินผ่านคลิปบอร์ดของคุณ และไม่แตะเซิร์ฟเวอร์เลย
จับเป็นชุด PRO
วางรายการ URL หรือดึงจาก sitemap ของเว็บนั้นเอง แล้ว Snapture จะเปิดและจับให้ทีละหน้า สูงสุด 30 หน้าต่อรอบ
PROทุกฟีเจอร์รวมอยู่ในโควตาฟรีทั้ง 5 ครั้ง ไม่ต้องใส่บัตร ไม่ต้องสมัคร Pro แค่ปลดลิมิตออก
ไกด์
เขียนจากงานจับจริงและของที่พังจริง ไม่ใช่จากลิสต์ฟีเจอร์
Why Figma Auto Layout breaks after importing a web page
Flexbox and Figma's Auto Layout are different systems that look alike. Here is where they disagree, why converters apply Auto Layout anyway, and how to tell whether yours checked.
Why icons go missing when you import a web page into Figma
Icons on the web are drawn four different ways — inline SVG, sprites, icon fonts and CSS masks — and each one breaks differently on import. How to tell which you have, and what a converter has to do about it.
How to import a page behind a login into Figma
URL-based converters return the login screen because a server cannot see a page that requires being you. What actually works, what several tools now offer, and the question worth asking instead.
ไม่มีอะไรออกจากเครื่องคุณ
manifest ของปลั๊กอิน Figma ประกาศ networkAccess: "none" และ Figma เป็นฝ่ายบังคับใช้เอง แปลว่าต่อให้ปลั๊กอินอยากยิงเน็ตเวิร์กก็ทำไม่ได้ นี่ไม่ใช่นโยบายที่เราสัญญาว่าจะทำตาม แต่เป็นความสามารถที่เราไม่มีตั้งแต่ต้น
เปิด DevTools ระหว่างจับแล้วดูแท็บ network ได้เลย คุณจะเห็นแค่คำขอพวกนั้นและไม่มีอย่างอื่น รายละเอียดเต็มอยู่ในนโยบายความเป็นส่วนตัว
ไม่มีเซิร์ฟเวอร์ในวงจร โดยโครงสร้างของมันเอง
เครื่องมืออื่นตั้งค่าให้เก็บงานจับไว้ในเครื่องได้ก็จริง แต่ Snapture ไม่มีการตั้งค่าให้พลาด เพราะไม่มีเซิร์ฟเวอร์ให้ส่งอะไรไปหาตั้งแต่ต้น
| Snapture | เครื่องมือที่มีเส้นทางฝั่งเซิร์ฟเวอร์ | |
|---|---|---|
| ถ้าอยากให้เป็นส่วนตัว | เป็นเสมอ | ต้องเลือกออปชันโลคัลเอง |
| แผนฟรีให้อะไร | ฟีเจอร์ครบ 5 ครั้ง | โควตารายเดือน |
| สถานะล็อกอิน / อินเทอร์แอกทีฟ | ได้เสมอ | แล้วแต่เครื่องมือ |
| ต้องมีบัญชีไหม | ไม่ต้อง | ต้อง |
| ราคา Pro | $5/เดือน | มักแพงกว่า |
ใช้ฟรีได้เลย จ่าย Pro เมื่อมันคุ้มค่าตัวมันเอง
ลองของจริงทั้งตัวฟรี 5 ครั้ง Pro แค่ปลดลิมิต ฟีเจอร์เท่าเดิม ไม่มีตัวนับ
- 5 ครั้ง แบบผลิตภัณฑ์เต็มตัว
- หน้าล็อกอิน ไอคอน กราฟ
- ส่งผ่านคลิปบอร์ด
- ไม่ต้องใส่บัตร ไม่ต้องมีบัญชี
- ทุกอย่างในแผนฟรี
- Auto Layout เที่ยงตรงระดับพิกเซล
- คอมโพเนนต์จากการ์ดที่ซ้ำกัน
- สไตล์ตัวอักษรกับสีพร้อมชื่อโทเคน
คำถามที่ตอบกันตรง ๆ
ข้อมูลหน้าเว็บของฉันปลอดภัยจริงไหม
ปลอดภัยในระดับโครงสร้างเลย การแปลงรันในแท็บเบราว์เซอร์ของคุณ และผลลัพธ์ไปลงดิสก์หรือคลิปบอร์ด ไม่มีเซิร์ฟเวอร์ Snapture ให้ส่งไปหา manifest ของปลั๊กอิน Figma ประกาศการเข้าถึงเน็ตเวิร์กเป็นศูนย์ ซึ่ง Figma บังคับใช้และใครก็เปิดตรวจได้ ส่วนขยายมีคำขอไม่กี่อย่าง คือรูปของหน้านั้นเองเพื่อให้ไปโผล่ในไฟล์คุณ เช็กคีย์ไลเซนส์ถ้าใช้ Pro และอ่าน sitemap ตอนกดจับเป็นชุด ไม่มีอันไหนพกเนื้อหาหน้าเว็บคุณไป ทั้งหมดแจกแจงอยู่ในนโยบายความเป็นส่วนตัว
ต่างจาก html.to.design กับเครื่องมือทำนองเดียวกันยังไง
เครื่องมือพวกนั้นก็จับหน้าที่คุณล็อกอินอยู่ได้เหมือนกันผ่านส่วนขยายของเขา และถ้าเลือกออปชันไว้ ไฟล์ก็เก็บในเครื่องได้ ความต่างคือกับ Snapture ไม่มีออปชันให้ต้องเลือก เพราะไม่มีเซิร์ฟเวอร์ เส้นทางส่วนตัวจึงเป็นเส้นทางเดียวที่มี และปลั๊กอิน Figma มาพร้อม networkAccess: "none" ที่ Figma บังคับใช้แทนเรา นอกจากนั้น แผนฟรีของเราคือผลิตภัณฑ์เต็มตัวไม่ใช่รุ่นตัด และเราใส่ Auto Layout เฉพาะเมื่อเอนจินของ Figma ทำซ้ำหน้าคุณได้เพี้ยนไม่เกินครึ่งพิกเซล
ฟรีแล้วได้อะไรบ้างกันแน่
จับได้ 5 ครั้ง และทุกครั้งคือผลิตภัณฑ์เต็มตัว หน้าล็อกอิน ไอคอน กราเดียนต์ กราฟเป็นภาพหน้าจอ Auto Layout คอมโพเนนต์ การถอดสไตล์ และโฟลว์คลิปบอร์ด ไม่มีอะไรถูกกั๊กไว้ คุณจะได้รู้จากหน้าเว็บของคุณเองว่า Snapture คุ้มจ่ายไหม พอครั้งที่ห้าผ่านไป Pro ก็ปลดลิมิตให้
ฟอนต์ใน Figma ดูไม่เหมือนเดิม
Figma ใช้ได้แค่ฟอนต์ที่ติดตั้งบนเครื่องคุณ Snapture จับ font stack มาเป๊ะอยู่แล้ว พอติดตั้งฟอนต์ที่ขาด (เช่น Pretendard หรือ Inter) แล้วรีสตาร์ต Figma ทุกอย่างก็ตรงกัน ระหว่างนั้น Figma จะแทนด้วยฟอนต์ใกล้เคียงที่สุดที่มี
ไลเซนส์เดียวใช้หลายเครื่องได้ไหม
ได้ ไลเซนส์ครอบคลุมอุปกรณ์ส่วนตัวของคุณ (เปิดใช้งานได้สูงสุด 3 เครื่อง) ถ้าเปลี่ยนเครื่องแล้วชนลิมิต เขียนหาเราแล้วเรารีเซ็ตให้
นโยบายคืนเงินเป็นยังไง
ถ้า Snapture ใช้กับหน้าเว็บของคุณไม่ได้ผล บอกเราภายใน 14 วันหลังซื้อ แล้วรับเงินคืนเต็มจำนวนผ่านผู้ให้บริการชำระเงินของเรา ไม่มีฟอร์ม ไม่มีขั้นตอนยุ่งยาก
เลิกวาดซ้ำสิ่งที่มีอยู่แล้วกันเถอะ
ติดตั้งส่วนขยาย จับหน้าที่คุณกำลังดู แล้ววางลง Figma ใช้เวลาราวหนึ่งนาทีก็เห็นผลแล้ว