พลังของ Figma เป็นเครื่องมือออกแบบ

Figma เป็นเครื่องมือออกแบบบนคลาวด์ที่คล้ายกับ Sketch ในด้านการทำงานและคุณสมบัติ แต่มีความแตกต่างอย่างมากที่ทำให้ Figma ทำงานร่วมกันเป็นทีมได้ดียิ่งขึ้น สำหรับผู้ที่ไม่เชื่อในคำกล่าวอ้างดังกล่าว เราจะอธิบายว่า Figma ช่วยลดความซับซ้อนของกระบวนการออกแบบได้อย่างไร และมีประสิทธิภาพมากกว่าโปรแกรมอื่นๆ ในการช่วยให้นักออกแบบและทีมทำงานร่วมกันอย่างมีประสิทธิภาพ

มาดูกันดีกว่า

Figma ใช้งานได้กับทุกแพลตฟอร์ม

Figma ทำงานบนระบบปฏิบัติการใด ๆ ที่รันเว็บเบราว์เซอร์ สามารถใช้ Mac, พีซีที่ใช้ Windows, เครื่อง Linux และแม้แต่ Chromebook กับ Figma ได้ เป็นเครื่องมือออกแบบประเภทเดียวที่ทำสิ่งนี้ และในร้านค้าที่ใช้ฮาร์ดแวร์ที่ใช้ระบบปฏิบัติการต่างกัน ทุกคน ยังสามารถแชร์ เปิด และแก้ไขไฟล์ Figma ได้

ในหลายองค์กร นักออกแบบใช้ Mac และนักพัฒนาใช้ Windows PC Figma ช่วยนำกลุ่มเหล่านี้มารวมกัน ลักษณะสากลของ Figma ยังป้องกันความรำคาญของ PNG-pong (ซึ่งภาพที่อัปเดตจะถูกตีกลับไปมาระหว่างสาขาวิชาของทีมออกแบบ) ใน Figma ไม่จำเป็นต้องมีกลไกการไกล่เกลี่ยเพื่อให้งานออกแบบพร้อมใช้งานสำหรับทุกคน

การทำงานร่วมกันใน Figma เป็นเรื่องง่ายและคุ้นเคย

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

การทำงานร่วมกันในไฟล์แบบเรียลไทม์ช่วยลด "การเบี่ยงเบนของการออกแบบ" ซึ่งหมายถึงการตีความผิดหรือหลงทางจากการออกแบบที่ตกลงกันไว้ การออกแบบล่องลอยมักจะเกิดขึ้นเมื่อความคิดเกิดขึ้นและดำเนินการอย่างรวดเร็วในขณะที่โครงการกำลังดำเนินการ น่าเสียดายที่สิ่งนี้มักจะนำไปสู่การเบี่ยงเบนไปจากการออกแบบที่สร้างขึ้น ทำให้เกิดการเสียดสีและการทำงานซ้ำ

การใช้ Figma หัวหน้าฝ่ายออกแบบสามารถเช็คอินเพื่อดูว่าทีมกำลังออกแบบอะไรในแบบเรียลไทม์เพียงแค่เปิดไฟล์ที่แชร์ หากนักออกแบบตีความบทสรุปหรือเรื่องราวของผู้ใช้อย่างผิด ๆ คุณลักษณะนี้จะช่วยให้การออกแบบสามารถเข้าไปแทรกแซง แก้ไขหลักสูตร และประหยัดเวลานับไม่ถ้วนที่อาจสูญเสียไป (โดยการเปรียบเทียบ ทีมที่ใช้ Sketch ไม่มีทางบอกได้ทันทีว่านักออกแบบกำลังหลงทาง)

หมายเหตุด้านข้าง: นักออกแบบบางคนไม่ชอบให้ถูก "สอดแนม" ขณะทำงาน ดังนั้นจึงขึ้นอยู่กับหัวหน้างานออกแบบที่จะอธิบายประโยชน์ โดยทั่วไปแล้ว นักออกแบบส่วนใหญ่จะมองเห็นคุณค่าในคุณลักษณะดังกล่าวอย่างรวดเร็ว และปรับให้เข้ากับการทำงานในสภาพแวดล้อมที่ใช้ร่วมกันได้อย่างง่ายดาย

Figma ใช้ Slack เพื่อการสื่อสารในทีม

Figma ใช้ Slack เป็นช่องทางการสื่อสาร เมื่อสร้างช่อง Figma ใน Slack ความคิดเห็นหรือการแก้ไขการออกแบบที่ทำใน Figma จะ "หย่อน" ให้กับทีม ฟังก์ชันนี้มีความสำคัญเมื่อออกแบบสด เนื่องจากการเปลี่ยนแปลงในไฟล์ Figma จะอัปเดตทุกอินสแตนซ์อื่นๆ ที่ฝังไฟล์ไว้ (อาจทำให้นักพัฒนาต้องปวดหัว) การเปลี่ยนแปลงของหุ่นจำลอง ไม่ว่าจะมีการรับประกันหรือไม่ จะได้รับการตรวจสอบทันที และช่องคำติชมก็พร้อมใช้งาน

การแบ่งปัน Figma นั้นไม่ซับซ้อนและยืดหยุ่น

Figma ยังอนุญาตให้แชร์ไฟล์ เพจ หรือเฟรมตามสิทธิ์ (เรียกว่าอาร์ตบอร์ดในเครื่องมือออกแบบอื่นๆ) เมื่อมีการสร้างลิงก์แชร์ไปยังเฟรมบนเพจ บุคคลที่คลิกลิงก์นั้นจะเปิด Figma เวอร์ชันเบราว์เซอร์และโหลดมุมมองแบบซูมเข้าของเฟรม

รูปแบบการแชร์แบบเลือกสรรนี้ ตั้งแต่ไฟล์จนถึงเฟรม ช่วยให้นักออกแบบ เจ้าของผลิตภัณฑ์ และนักพัฒนาสามารถแชร์สิ่งที่จำเป็นในเครื่องมือติดตามจุดบกพร่องและซอฟต์แวร์ชุมชน เช่น Confluence หรือ SharePoint

ไฟล์ Figma แบบฝังให้การอัปเดตตามเวลาจริง

Figma ยังแชร์ข้อมูลโค้ดฝังตัวแบบสดเพื่อวาง iFrame ในเครื่องมือของบุคคลที่สาม ตัวอย่างเช่น หากใช้ Confluence เพื่อแสดงไฟล์ม็อคอัพที่ฝังไว้ ไฟล์เหล่านั้นจะไม่ "อัปเดต" โดยการบันทึกไฟล์ Figma—ไฟล์ที่ฝังไว้เหล่านั้นคือไฟล์ Figma

หากใครก็ตามใน Figma ได้ทำการเปลี่ยนแปลงกับม็อคอัพ การเปลี่ยนแปลงนั้นจะสามารถเห็นได้จริงในม็อคอัพ Confluence ที่ฝังไว้ (คุณสามารถอ่านเพิ่มเติมเกี่ยวกับการรวม Figma และ Confluence ได้ที่นี่)

ผลกระทบของคุณลักษณะนี้ต่อกระบวนการ UX นั้นแสดงให้เห็นในไดอะแกรมต่อไปนี้:

ก่อน Figma มีการใช้เครื่องมืออื่นๆ อีกหลายอย่างเพื่ออำนวยความสะดวกในการแลกเปลี่ยนแบบจำลองการออกแบบและการอัปเดต วงจรการวนซ้ำเป็นชุดของการอัปเดตไฟล์ไปมา เพื่อให้ทีมสามารถตรวจสอบและนำการออกแบบปัจจุบันไปใช้

หลังจาก Figma เครื่องมือของบุคคลที่สามไม่จำเป็นอีกต่อไป (แต่สามารถใช้ได้หากต้องการ) เนื่องจาก Figma จัดการฟังก์ชันการทำงานของเครื่องมือของบุคคลที่สามที่อธิบายไว้ก่อนหน้านี้ จึงมีขั้นตอนเดียวเท่านั้นในกระบวนการ—ย้ายจากภาพร่างไปยัง Figma และทุกกลุ่มมีการจำลองล่าสุด ไม่มีคำว่า "แฮนด์ออฟ" ในความหมายที่เข้มงวดที่สุดของคำ

Figma เหมาะสำหรับรีวิวการออกแบบ

Figma รองรับการแสดงความคิดเห็นในแอปทั้งในโหมดการออกแบบและการสร้างต้นแบบ และเธรดความคิดเห็นจะถูกติดตามใน Slack และ/หรืออีเมล ไม่จำเป็นต้องเผยแพร่ไฟล์ PNG หรืออัปเดตอย่างต่อเนื่องเพื่อรับคำติชมจากทีมโดยใช้เครื่องมือของบุคคลที่สาม เช่น InVision หรือ Marvel

ระหว่างการตรวจทานการออกแบบ นักออกแบบทีมสามารถพูดคุยถึงงานบนหน้าจอขนาดใหญ่ บันทึกความคิดเห็น และแก้ไขปัญหาได้ ทั้งหมดนี้ใน Figma ฟีดแบ็คแบบสดรูปแบบนี้ไม่สามารถทำได้ใน Sketch ซึ่งต้องอัปโหลดไปยังบริการคลาวด์เพื่อรับข้อมูลจากทีม

แฮนด์ออฟสำหรับนักพัฒนาซอฟต์แวร์ได้รับการอำนวยความสะดวกโดยใช้Figma

Figma แสดงข้อมูลโค้ดบนเฟรมหรือวัตถุที่เลือกในรูปแบบ CSS, iOS หรือ Android เพื่อให้นักพัฒนาใช้เมื่อตรวจสอบไฟล์การออกแบบ ผู้พัฒนาสามารถตรวจสอบส่วนประกอบการออกแบบในไฟล์ใดก็ได้ที่สามารถดูได้ ไม่จำเป็นต้องใช้เครื่องมือของบุคคลที่สามเพื่อรับข้อมูล ถึงกระนั้น Figma ก็มีการรวมเข้ากับ Zeplin อย่างสมบูรณ์ หากทีมต้องการทำมากกว่าการวัดแบบธรรมดาและการแสดง CSS

ไฟล์โครงการ Figma อยู่ในที่เดียว—ออนไลน์

เนื่องจาก Figma เป็นแอปออนไลน์ จึงจัดการการจัดระเบียบไฟล์โดยแสดงโปรเจ็กต์และไฟล์ในมุมมองเฉพาะ Figma ยังรองรับหลายหน้าต่อไฟล์ เช่น Sketch ดังนั้นทีม Agile จึงสามารถจัดระเบียบโครงการได้อย่างมีเหตุมีผล:

• สร้างโครงการสำหรับ ธีม คุณลักษณะ
• สร้างไฟล์สำหรับคุณสมบัติที่ ยิ่ง ใหญ่หรือยิ่งใหญ่
• สร้างเพจในไฟล์นั้นสำหรับ เรื่องราว ของผู้ใช้แต่ละคน

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

Figma APIs ให้การผสานรวมเครื่องมือของบุคคลที่สาม

ตอนนี้ Figma มี API สำหรับนักพัฒนาเพื่อให้สามารถรวมเข้ากับแอพที่ใช้เบราว์เซอร์ได้อย่างแท้จริง บริษัทต่างๆ ใช้ข้อมูลนี้เพื่อรวมการแสดงไฟล์การออกแบบแบบเรียลไทม์ในแอปของตน ตัวอย่างเช่น Uber มีหน้าจอขนาดใหญ่ที่แสดงไฟล์การออกแบบ "ถ่ายทอดสด" รอบบริษัท มีการแบ่งปันการออกแบบ และยินดีรับคำติชมจากทุกคนในบริษัท

ซอฟต์แวร์ JIRA ของ Atlassian ได้ติดตั้งโปรแกรมเสริม Figma เพื่อให้เจ้าของผลิตภัณฑ์ นักพัฒนา และวิศวกรที่มีคุณภาพมักจะดูเวอร์ชันล่าสุดของการจำลองจากนักออกแบบอยู่เสมอ

นอกจากนี้ API ของ Figma ยังสัญญาว่าจะตอบสนองคำขอของลูกค้าสำหรับปลั๊กอินของบุคคลที่สามและการปรับปรุงฟีเจอร์ที่ Sketch มีให้อยู่แล้ว

การกำหนดเวอร์ชันไฟล์เป็นแบบอัตโนมัติหรือตามความต้องการ

ความไม่แน่นอนใดๆ เกี่ยวกับการอัปเดตไฟล์แบบสดนั้นลดลงอีกโดยระบบการกำหนดเวอร์ชันในตัวของ Figma นักออกแบบสามารถสร้างเวอร์ชันที่มีชื่อและคำอธิบายของไฟล์ Figma ได้ตลอดเวลา สามารถทำได้ทันทีหลังจากมีการเปลี่ยนแปลงการออกแบบที่ตกลงกันไว้

ไฟล์ที่ใช้งานจริงในสภาพแวดล้อมที่ใช้ร่วมกันจะไม่ได้รับผลกระทบจนกว่าการเปลี่ยนแปลงจะถูกส่งไปยังเวอร์ชันดั้งเดิมโดยเจตนา นอกจากนี้ยังสามารถกู้คืนเวอร์ชันที่บันทึกโดยอัตโนมัติเพื่อสร้างสำเนาหรือเขียนทับต้นฉบับ

การสร้างต้นแบบใน Figma นั้นตรงไปตรงมาและใช้งานง่าย

ในขณะที่ Sketch เพิ่งเพิ่มอาร์ตบอร์ดลงในการสร้างต้นแบบอาร์ตบอร์ด Figma ได้ก้าวไปอีกขั้นด้วยการเปลี่ยนระหว่างเฟรม คุณสมบัติการสร้างต้นแบบอย่างง่ายของ Figma ทำให้ไม่จำเป็นต้องใช้เครื่องมืออื่นที่ใช้สร้างต้นแบบสไตล์สไลด์โชว์ เช่น InVision หรือ Marvel เมื่อสิ่งที่จำเป็นคือการนำเสนออย่างง่ายพร้อมช่วงการเปลี่ยนภาพ ไม่จำเป็นต้องส่งออกไปยังเครื่องมือตรวจทาน

ต้นแบบ Figma สามารถแจกจ่ายได้เหมือนกับไฟล์การออกแบบของ Figma ทุกคนที่มีสิทธิ์ลิงก์สามารถดูและแสดงความคิดเห็นเกี่ยวกับต้นแบบได้ และอีกครั้ง ความคิดเห็นนั้นจะถูกบันทึกไว้ในแผงความคิดเห็นของเครื่องมือและบันทึกไว้ใน Slack นักพัฒนาสามารถดูเวิร์กโฟลว์การออกแบบ ฝาก @messages โดยตรงสำหรับนักออกแบบ และรับการวัดและแอตทริบิวต์ CSS จากภายในต้นแบบ

Team Libraries ของ Figma เหมาะอย่างยิ่งสำหรับระบบการออกแบบ

ระบบการออกแบบ กลายเป็นสิ่งจำเป็นสำหรับหลายๆ บริษัท และมีความจำเป็นสำหรับส่วนประกอบ (สัญลักษณ์ใน Sketch และ Illustrator) ที่สามารถนำมาใช้ซ้ำ ปรับขนาดได้ และ "เป็นโทเค็น" เพื่อใช้ในไลบรารีรูปแบบที่มีให้สำหรับนักออกแบบ UX และนักพัฒนาส่วนหน้า

วลีที่ใช้บ่อย "แหล่งเดียวของความจริง" เหมาะสมที่นี่—เมื่อสร้างไลบรารีของทีม Figma แล้ว ใครก็ตามที่เข้าถึงโปรเจ็กต์ได้สามารถใช้อินสแตนซ์ของส่วนประกอบในการออกแบบของพวกเขา และมั่นใจได้ว่าพวกเขากำลังทำงานกับเวอร์ชันล่าสุด

แนวทางของ Figma ในไลบรารีคอมโพเนนต์นั้นง่ายและจัดการได้ง่าย นักออกแบบสามารถสร้างไฟล์ที่เต็มไปด้วยส่วนประกอบหรือใช้ส่วนประกอบบนหน้าเพื่อจัดระเบียบไลบรารีรูปแบบ แต่ละเฟรมในหน้า Figma จะกลายเป็นส่วนองค์กรในไลบรารีของทีม (ไม่จำเป็นต้องสร้างลำดับชั้น\ชอบ\สิ่งนี้)

วิธีหนึ่งในการจัดระเบียบไลบรารีคือการมีโปรเจ็กต์เฉพาะสำหรับส่วนประกอบเท่านั้น ไฟล์ภายในโปรเจ็กต์นั้นสามารถจัดระเบียบได้ตามต้องการ และสามารถจัดเรียงเพจภายในไฟล์เหล่านั้นได้ตามต้องการ

Figma สร้างขึ้นเพื่อเพิ่มประสิทธิภาพการทำงานเป็นทีม

การใช้ Figma เป็นระยะเวลาเท่าใดก็ได้แสดงให้เห็นถึงประโยชน์ของเครื่องมือการทำงานร่วมกันแบบสดนี้ ช่วยให้ทีมทำงานและสนับสนุนการเปิดเผยข้อมูลอย่างครบถ้วน ซึ่งจำเป็นต่อการสร้างระบบการออกแบบสำหรับสาขาวิชาต่างๆ Figma นั้นง่ายสำหรับทุกคนที่จะใช้บนแพลตฟอร์มใดก็ได้ และให้ทีมแบ่งปันงานและห้องสมุดของพวกเขาได้อย่างรวดเร็ว

ผู้เชี่ยวชาญด้านการออกแบบที่ใช้ Figma หลังจากเปลี่ยนจาก Sketch (ไฟล์ Sketch สามารถนำเข้าด้วยความเท่าเทียมกันใน Figma) ไม่ผิดหวัง:

…มันเปลี่ยนวิธีการทำงานร่วมกับเพื่อนร่วมงานและลูกค้าของคุณโดยสิ้นเชิง – ปรับปรุงการออกแบบการทำงานร่วมกันด้วย Figma

Figma รวบรวมสิ่งที่ดีที่สุดในโลกของเครื่องมือออกแบบ UI ในช่วงไม่กี่ปีที่ผ่านมา – ทำไมทีมออกแบบของคุณจึงควรพิจารณาเปลี่ยนไปใช้ Figma

ในปีที่แล้ว ฉันใช้ Figma ในกระบวนการออกแบบ UI/UX และช่วยประหยัดเวลาในการทำงานได้หลายชั่วโมง มันเปลี่ยนเวิร์กโฟลว์การออกแบบของฉันอย่างแท้จริง – วิธีปรับปรุงเวิร์กโฟลว์ UI/UX ของคุณด้วย Figma

เวลาของฉันที่ใช้ใน Figma มักจะเป็นส่วนที่สนุกและมีประสิทธิผลมากที่สุดในสมัยของฉัน – Figma กำลังเปลี่ยนรูปแบบการทำงานทั้งหมดของฉัน และมันยอดเยี่ยมมาก!

• • •

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

• ฝึกฝนฝีมือของคุณด้วยเครื่องมือ UX ยอดนิยมเหล่านี้
• ปรับปรุงการออกแบบการทำงานร่วมกันด้วย Figma
• ใช้ Craft by InVision เพื่อเพิ่มความคล่องตัวในการทำงานร่วมกันในทีม
• ความตายสู่โครงลวด ตรงสู่ความเที่ยงตรงสูง!
• มาเป็นนักออกแบบระดับโลกด้วยการทำให้โลกทั้งใบเป็นสำนักงานของคุณ