By 
Figma เป็นหนึ่งใน Design Tool ที่มาแรงที่สุดในปีนี้ ด้วยความเรียบง่าย แต่ลูกเล่นเยอะ ทำให้ Figma ไม่ใช่แค่โปรแกรมที่ดีไซเนอร์ชอบใช้ แต่ฝ่ายอื่นๆ ที่ทำงานร่วมกับดีไซเนอร์ เช่น โปรแกรมเมอร์และนักการตลาด ก็ถูกใจด้วยเช่นกัน
ด้วยความฮิตของ Figma นี้เอง ทำให้มีคนสร้าง Plugin ขึ้นมาอีกมากมาย ที่เป็นเหมือนส่วนต่อเติมของโปรแกรม ซึ่งจะช่วยทำให้ Figma ทำงานได้หลากหลายยิ่งขึ้น
วันนี้เราเลยจะมาแนะนำ 7 Plugins ใน Figma ที่จะเพิ่มความไว ความงาม และความว้าว! บทความนี้จะช่วยให้ดีไซเนอร์หลาย ๆ คนที่กำลังมองหา Plugin ช่วยเสริมประสิทธิภาพในการออกแบบผ่าน Figma แข็งแกร่งขึ้นไปอีก! 💪🦾
Table of Contents
1. Google Sheet Sync
ดึง Data จริง จากตาราง Google Sheet มาใช้ในงานออกแบบ UI ได้อย่างสะดวก รวดเร็ว โดยสามารถตั้งค่าให้ดึงแบบเจาะจงหรือ Random ข้อมูลจาก Google Sheet ได้ด้วย อีกทั้งยัง Support การดึง Image URL Link เข้ามาใส่ใน Shape ได้อีก เหมาะมากสำหรับ Designer สาย Perfectionist ที่ไม่อยากใช้ Lorem Ipsum บอกเลยว่า Google Sheet Sync เป็น Plugin ที่ช่วยได้ทั้งการออกแบบ UI และงานออกแบบทั่วๆ ไป
2. LottieFiles
LottieFiles จะช่วยทำให้งานออกแบบของเหล่าดีไซเนอร์ที่ฝันอยากจะเอา Motion Graphic ไปใช้กับงาน UI ให้เป็นจริง เพราะ Plugin นี้ใช้สำหรับการนำ Animation จาก After Effect เข้ามา Preview ใช้ใน Figma ได้
รวมถึง File ที่ Export จาก Bodymovin (Plugin ฝั่ง After Effect) ยังสามารถนำไปใช้บน Production จริง ได้อีกด้วย
3. Unsplash
หา Mock Up รูปภาพสวย ๆ มาใช้ออกแบบได้ง่าย เร็ว และสวยงาม ผ่าน Unsplash! Plugin นี้ จะช่วย เลือกรูปที่มีสไตล์เดียวกัน ใน Category เดียวกันได้เพียงไม่กี่คลิก โดยมีโหมดให้เลือกรูปถึง 14 หมวด ซึ่ง Unsplash เหมาะมากสำหรับการออกแบบที่ต้อง Mockup รูปไว ๆ เพื่อดู Look & Feel ของผลิตภัณฑ์ แต่ไม่เหมาะกับการใช้จริง เพราะรูปที่ Generate ออกมาจะเป็น Low-res ซึ่งประโยชน์คือช่วยโหลดงานตอนเรานำ Prototype ไป Present ได้เร็ว
4. Charts
หมดปัญหากับการทำ UI หน้า Dashboard เพราะ Plugin Chart จะเข้ามาช่วยเราทำ Mock Up กราฟ หรือ Data Visualization ได้ฟินมากขึ้น โดยไม่จำเป็นต้องใช้ Visualization tools อื่นๆ ซึ่งความโหดของ Plugin นี้คือสามารถดึงข้อมูลจริง ๆ จาก Google Sheet, CSV หรือ JSON เข้ามาใช้งานได้โดยตรง
ซึ่ง Chart แบบ Free Version จะสามารถใช้ได้สอง Chart เท่านั้น (Line Chart กับ Area Chart) ถ้าใครอยากใช้ทั้งหมดต้องจ่ายค่าบริการเพียง $10 ต่อปี สำหรับคนที่อยากใช้เป็น Free Version การใช้ Line chart แบบเรียบๆ ก็ทำให้งานออกแบบของเราดูดีได้ไม่ยาก
5. Autoflow
อยากลากลูกศรเพื่อทำ Wireframe ภาพรวม แต่ไม่ได้อยาก Link Prototype แนะนำให้ใช้ Autoflow! เพียงคลิกสอง Object แล้วเปิด Autoflow ก็จะมีลูกศรโผล่ขึ้นมาแบบ Auto เลย
เหมาะกับช่วง Ideate มาก ๆ เพราะจะช่วยทำให้ทีมเห็นภาพรวมของทั้ง Flow โดยไม่ต้องคลิกดู Prototype ทีละหน้า
6. Angle Mockups
Plugin ช่วยทำ Mockup Presentaion แบบเร็วทันใจ โดย Angle มี Vector และ 3D Mockup ให้เลือกถึง 1,900 กว่าแบบ ตั้งแต่มือถือ iOS, Android จนไปถึง Desktop
เรียกว่าครบทุกเครื่อง ทุกมุม ซึ่ง Plugin นี้ Free สำหรับการใช้แบบส่วนตัว แต่ถ้าใครอยากใช้เชิงพาณิชย์ก็สามารถจ่ายเพียงครั้งเดียวในราคา $79 หรือประมาณ 2,500 บาท นับว่าเหมาะมากสำหรับ Software House หรือ Digital Agency
7. Iconify
ดึงไอคอนต่าง ๆ จาก Google Material Icon, FontAwesome หรือ Twitter Emoji และอื่น ๆ อีกกว่า 50,000 ชิ้น ได้ผ่าน Figma โดยตรง ซึ่งสิ่งที่ดีงามคือ Search Bar และ Tags ใน Plugin ที่ช่วยค้นหา Icon ได้ง่ายและรวดเร็วขึ้น และยังแนะนำ Slyte ของ Icon ที่คล้าย ๆ กัน ทำให้ Design Process ลื่นไหลขึ้นไปอีก!
งานออกแบบ UI หรือการทำ Prototype ในปัจจุบันนี้ง่ายขึ้นมาก ๆ ยิ่งถ้ามี Plugins เหล่านี้ติดไว้ใน Figma ยิ่งทำให้งานของเราดูโปรมากขึ้นอีกด้วย
หรือถ้าใครกำลังมองหาตัวช่วยสำหรับงานออกแบบ ก่อนจะลงมือทำงานในโปรแกรม Figma แนะนำเป็น 5 Chrome Extensions เพิ่ม Productivity ให้กับเหล่า UI Designer
ส่วนคนที่อยากใช้ Design Tools หรือใช้เครื่องมืออื่นๆ อยู่ แล้วอยากเปลี่ยนมาใช้ Figma แต่ไม่รู้จะเริ่มต้นเรียนรู้ยังไง ตอนนี้ Skooldio มีหลักสูตร UI Design with Figma แล้ว สามารถดูรายละเอียดได้ที่นี่
อยากให้มีบทความดี ๆ แบบนี้อีก ซื้อกาแฟเลี้ยงคนเขียนได้ทาง https://ko-fi.com/thanon
