Site icon PlusMagi's Blog By Pitt Phunsanit

Figma: เลือกหลาย object เพื่อ เปลี่ยน property

phunsanit

การเลือก Object จำนวนมากเพื่อเปลี่ยน Property ใน Figma สามารถทำได้หลายวิธี ขึ้นอยู่กับว่า Object เหล่านั้นวางตัวอยู่อย่างไรครับ นี่คือเทคนิคที่ช่วยให้คุณทำงานได้เร็วขึ้น

การกด Shift

การกด Shift เพื่อเลือก Object ใน Figma มี 2 รูปแบบหลักครับ ซึ่งให้ผลลัพธ์ต่างกันตามพื้นที่ที่คุณใช้งาน (Canvas vs Layers Panel)

  1. การเลือกบน Canvas (พื้นที่ทำงานหลัก)
    การเลือกตัวแรกแล้วกด Shift ค้างไว้เพื่อคลิกตัวอื่น ๆ จะเป็นการ “เลือกเพิ่มเข้ากลุ่ม” (Add to selection)
    • วิธีใช้: คลิก Object ตัวแรก > กด Shift ค้าง > คลิก Object ตัวที่ 2, 3, 4…
    • ประโยชน์: ใช้เลือก Object ที่อยู่กระจายกัน ไม่ได้วางเรียงกันเป็นระเบียบ
    • การยกเลิก: หากกด Shift แล้วคลิกซ้ำที่ตัวเดิม จะเป็นการ “ยกเลิกการเลือก” (Deselect) เฉพาะตัวนั้นครับ
  2. การเลือกบน Layers Panel (แถบด้านซ้ายมือ)
    การใช้ Shift ในแถบ Layer จะทำงานเหมือนการเลือกไฟล์ในโฟลเดอร์คอมพิวเตอร์ คือการ “เลือกแบบเหมาช่วง”
    • วิธีใช้ คลิกชื่อ Layer ตัวแรกที่ต้องการ > กด Shift ค้างไว้ > คลิกชื่อ Layer ตัวสุดท้ายที่ต้องการ
    • ผลลัพธ์: Figma จะเลือก Layer ทุกตัวที่อยู่ “ระหว่างกลาง” ของตัวแรกและตัวสุดท้ายให้ทันที
    • เหมาะสำหรับ: กรณีที่คุณตั้งชื่อ Layer ไว้อย่างเป็นระเบียบ หรือต้องการล้าง Layer จำนวนมากที่เรียงต่อกัน

ตารางเปรียบเทียบการใช้ Shift และ Cmd/Ctrl

การกระทำบน Canvas (พื้นที่ออกแบบ)บน Layers Panel (แถบซ้าย)
Shift + Clickเลือกเพิ่มทีละตัว (สะสมไปเรื่อยๆ)เลือกแบบยกแผง (ตั้งแต่ตัวแรกถึงตัวสุดท้าย)
Cmd/Ctrl + Clickเจาะจงเลือกตัวที่อยู่ลึกที่สุด (Deep Select)เลือกเพิ่มทีละตัว (เหมือน Shift บน Canvas)

ทริคเด็ด: การใช้ Shift + ลากเมาส์ (Marquee Selection)

หากคุณต้องการเลือก Object จำนวนมากในพื้นที่หนึ่ง แต่ไม่อยากไปโดน Object อื่นที่อยู่ข้างหลัง (เช่น ไม่อยากให้ติดพื้นหลังหรือ Frame ใหญ่):

  1. กด Shift ค้างไว้
  2. ลากเมาส์คลุมพื้นที่ที่ต้องการ
  3. ผลที่ได้: Figma จะเลือกเฉพาะ Object ที่ยังไม่ถูกเลือก และ “ไม่ขยับ” ของที่เลือกอยู่ก่อนแล้ว ทำให้การเลือกแม่นยำขึ้นมากครับ

การเลือกแบบเจาะจงด้วย “Select All with…”

วิธีนี้แม่นยำที่สุดเมื่อต้องการเปลี่ยนคุณสมบัติที่เหมือนกันในทีเดียว (เช่น เปลี่ยนสี Fill หรือเปลี่ยน Font)

  1. คลิกเลือก Object ต้นแบบ 1 ชิ้น
  2. ไปที่เมนู Main Menu (ไอคอน Figma มุมซ้ายบน) > Edit > Select All with…
  3. เลือกเงื่อนไขที่ต้องการ เช่น
    • Same Fill: เลือกวัตถุทั้งหมดที่มีสีพื้นเดียวกัน
    • Same Stroke: เลือกวัตถุทั้งหมดที่มีเส้นขอบเหมือนกัน
    • Same Font: เลือก Text ทั้งหมดที่ใช้ฟอนต์เดียวกัน
    • Same Instance: เลือก Component ตัวเดียวกันทั้งหมดในหน้านั้น

การใช้ Multi-edit

หากคุณมีปุ่มหรือ Object ที่หน้าตาเหมือนกันกระจายอยู่ตาม Frame ต่างๆ คุณสามารถแก้ไขพร้อมกันได้

  1. เลือก Object ใน Frame หนึ่ง
  2. กดปุ่ม Multi-edit บน Toolbar (ไอคอนรูปสี่เหลี่ยมซ้อนกัน) หรือกด Shift + A (ในบางกรณี)
  3. Figma จะเลือก Object ที่มีโครงสร้างและชื่อเหมือนกันใน Frame อื่นๆ ให้ทันที จากนั้นคุณสามารถเปลี่ยนสีกำหนดขนาด หรือพิมพ์ข้อความใหม่พร้อมกันได้เลย

การใช้ Selection Colors

วิธีนี้เหมาะสำหรับกรณีที่มี Object จำนวนมากและคุณไม่อยากเสียเวลาไล่คลิกเลือกทีละตัว

  1. ลากเมาส์คลุมพื้นที่ทั้งหมดที่มี Object (เช่น คลุมทั้ง Screen)
  2. มองไปที่แถบ Design ด้านขวา หาหัวข้อ Selection Colors
  3. คุณจะเห็นรายการสีทั้งหมดที่ใช้อยู่ในพื้นที่ที่เลือก คุณสามารถกดเปลี่ยนสีจากตรงนี้ได้เลย โดยที่ Figma จะจัดการเปลี่ยนให้ทุก Object ที่ใช้สีนั้นๆ โดยอัตโนมัติ

การเลือกผ่าน Layers Panel

  1. Command (Ctrl) + Click: เลือกทีละชิ้นแบบเจาะจง
  2. Shift + Click: เลือก Object ตัวแรกและตัวสุดท้าย เพื่อเลือกทุกอย่างที่อยู่ระหว่างกลางในรายชื่อ Layer

การใช้ Deep Select และ Layer Selection

ในกรณีที่ Object ซ้อนอยู่ใน Group หรือ Frame หลายชั้น

การใช้คีย์ลัด “Select Parent/Children”

ช่วยให้เคลื่อนที่ไปตามโครงสร้าง Layer ได้โดยไม่ต้องละมือจากคีย์บอร์ด:

การใช้ Plugin (ตัวช่วยที่ทรงพลังที่สุด)

การเลือกเฉพาะ Layer ประเภทเดียวกัน (Keyboard Shortcuts)

การใช้ “Outlines View” เพื่อเลือก Object ที่มองไม่เห็น

บางครั้ง Object อาจจะโดนบัง หรือมีค่า Opacity เป็น 0% ทำให้คลิกเลือกยาก

การเลือก Object “ประเภทเดียวกัน” ทั้งหน้า (Quick Actions)

หากคุณไม่ได้อยากเลือกตามสี แต่ยากเลือกตาม ประเภท (เช่น เลือกเฉพาะรูปภาพทั้งหมด หรือ Frame ทั้งหมด) ให้ใช้คำสั่งผ่าน Quick Actions

  1. กด Cmd + / (Mac) หรือ Ctrl + / (Windows)
  2. พิมพ์คำว่า
    • Select all Tables
    • Select all Images
    • Select all Text

วิธีนี้จะช่วยกวาดเลือก Object ประเภทนั้นๆ ทั้งหมดในหน้า (Page) นั้นทันทีครับ

เทคนิค “Lasso Select” ด้วยการกดปุ่ม V

ปกติเวลาเราลากเมาส์คลุม (Marquee Select) มันจะเป็นรูปสี่เหลี่ยม แต่ถ้าคุณมี Object วางเรียงกันเป็นแนวเฉียงหรือซิกแซก

การเลือกผ่าน Search ใน Layer Panel

ถ้าไฟล์ของคุณใหญ่มากจนหา Layer ไม่เจอ

  1. ที่แถบ Layers (ด้านซ้าย) จะมีไอคอน แว่นขยาย (Search)
  2. คุณสามารถพิมพ์ชื่อ Layer (เช่น “Icon”, “Button”)
  3. เมื่อผลลัพธ์ขึ้นมา คุณสามารถกด Shift เลือกตัวแรกและตัวสุดท้ายในรายการค้นหาเพื่อเลือก Object เหล่านั้นพร้อมกันบน Canvas ได้เลย

    การใช้ “Section” ในการจัดกลุ่มเลือก

    หากคุณจัดงานไว้ใน Section (เครื่องมือข้างๆ Frame)

    1. เมื่อคุณคลิกที่ ชื่อ Section 1 ครั้ง แล้วกด Enter
    2. Figma จะเลือกทุกอย่างที่อยู่ภายใน Section นั้นให้ทันที เหมาะสำหรับการย้ายงานทั้งกลุ่มใหญ่ๆ หรือเปลี่ยน Property ของ Layer ที่อยู่ในกลุ่มนั้น

    เทคนิคเพิ่มเติม: ถ้าคุณต้องเปลี่ยน Property แบบนี้บ่อยๆ ผมแนะนำให้ทำเป็น Local Styles (Color Styles, Text Styles) หรือใช้ Components ครับ เพราะในอนาคตแค่คุณแก้ที่จุดเดียว ทุกจุดที่ใช้งานจะเปลี่ยนตามทันทีโดยไม่ต้องมานั่งไล่เลือกใหม่

    อ่านเพิ่มเติม

    Exit mobile version