รีวิว Penpot อีกหนึ่งทางเลือกหากเราไม่อยากจ่าย Figma

Figma น่าจะเป็น Software สำหรับการ Design งาน UI ที่ได้รับความนิยมมากที่สุดแล้วละ แต่แน่นอนว่า บางคนก็ไม่ได้อยากที่จะจ่าย 16 USD ต่อเดือน ทำให้มันมี Figma Alternative ออกมาเยอะมาก ๆ จนเราไปเจอตัวนึงที่น่าสนใจ PenPot วันนี้เราได้ลองใช้แล้วจะมารีวิวให้อ่านกัน

เครื่องมือ และการใช้งานที่คล้าย Figma มาก ๆ

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

ด้านซ้ายเป็น Layer และ Page ด้านขวาเป็นกล่อง Properties สำหรับปรับการตั้งค่าของต่าง ๆ ทำออกมาได้เหมือนกับ Figma มาก ๆ แค่ว่าแถบเครื่องมือที่ Figma มันจะอยู่ด้านบนสุดซ้ายมือ แต่ Penpot จะอยู่ด้านบนตรงกลางของหน้าจอแค่นั้นเลย ที่เหลือเหมือนกันแทบจะเป็นฝาแฝดกันมา

จุดที่เราชอบ และเราไม่เคยใช้งานบน Figma มาก่อนคือ ตัวมันสามารถทำ Flexbox และ Grid Layout ได้เลย เพราะเมื่อก่อนช่วงแรกที่เราใช้งาน Figma เรามีปัญหากับเรื่องระบบ Layout เวลาเราจะทำหน้า Responsive มาก ๆ พอมันมาใช้ Flexbox Layout ที่เราเข้าใจอยู่แล้ว ทำให้เวลาเราจะ Convert มันไปเขียนในเว็บจริง เราทำงานได้เร็วและง่ายกว่าเดิมมาก ๆ

นอกจาก Feature สำหรับการ Design แล้ว มันยังมี Prototype Feature ให้เราใช้งานด้วยเด้อ แต่ถามว่า มันเก่งเท่า Figma มั้ย เราก็ตอบเลยว่า ไม่ขนาดนั้น โดยพื้นฐานการ Link ไปแต่ละหน้า เราทำได้เหมือนกันเป๊ะ ๆ มีเครื่องมือช่วยให้เราทำงานได้ง่ายขึ้น แต่สิ่งที่มันยังขาด น่าจะเป็นเรื่อง Effect ต่าง ๆ และการทำ Interactive Prototype ที่ Penpot ยังขาดอยู่ แต่ถามว่าส่วนตัวเราใช้งานมันบ่อยขนาดนั้นมั้ย เราก็บอกเลยว่างานพวก Interactive ไม่ได้เป็นสายเราเท่าไหร่ เราใช้แค่ Design UI พื้นฐานเท่านั้น เลยไม่ได้ติดปัญหาอะไรกับเรื่องนี้เลย

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

โดยรวมประการณ์ที่ได้ ต้องบอกเลยว่า มันคล้ายกับ Figma มาก ๆ แต่อาจจะมีหลาย ๆ จุดที่ติด ๆ ขัด ๆ นิดหน่อย โดยเฉพาะเรื่อง Performance ที่ถ้าเรามี Element จำนวนมากอยู่ภายใน Document มันจะกระตุกเร็วมาก ๆ ตัดภาพไปที่ Figma เยอะมาก ๆ กว่านี้อีก มันยังพอไปได้เลย ทำให้ถ้าเราอยากจะเอามาใช้งานกับเอกสารขนาดใหญ่อาจจะต้องดูด้วยว่ามันจะรอดมั้ย

Plugin ที่ยังไม่เก่งมาก

เรื่องที่เราคิดว่าน่าจะเป็นข้อด้อยของ Penpot เมื่อเทียบกับ Figma คือ Plugin เราต้องเข้าใจกันก่อนนะว่า Penpot เนี่ยเกิดมาหลัง Figma และพึ่งเปิดตัวระบบ Plugin มาไม่นานมานี้ ทำให้ ณ​ วันที่เขียนนี้จำนวน Plugin ของ Penpot ยังสู้ Figma ไม่ได้เลย และเมื่อเราเข้าไปดู Plugin ของ Penpot ต้องพูดตรง ๆ ว่า คุณภาพ และควาสามารถของมันยังไม่เท่า Figma ได้จริง ๆ ส่วนนึงเป็นเพราะ Plugin บางตัวของ Figma มันเสียเงิน หรือ Port มาจากโปรแกรมที่เสียเงินและ Mature แล้วอีกที แต่ Plugin ส่วนใหญ่ของ Penpot นั้นน่าจะทั้งหมดเป็น Open-Source เลยทำให้บางตัวที่ฮิตมาก ๆ มีการ Contribute เยอะ ๆ ก็จะ Mature หน่อย แต่ตัวที่ทำคนเดียว แก้ปัญหาเองมันก็อาจจะมีปัญหาบ้างอะไรบ้าง ก็ต้องแก้ ๆ กันไป

Deploying Penpot

1.3 Install with Docker

Design freedom for teams.

ในเมื่อมันเป็น Open-Source มาขนาดนี้แล้ว เราสามารถเอา Penpot มา Deploy แบบ On-Prem ภายในองค์กรของเราได้ด้วย ซึ่งวิธีการนั้นเรียกว่าง่ายมาก ๆ ผ่านการใช้ Docker Compose ได้เลย เขาเตรียมไฟล์มาให้เราเรียบร้อย ภายใน Compose File ถ้าเราลองไปอ่านดู คือ เขาเตรียมทุกอย่างมาให้เราหมดเลยตั้งแต่ Frontend, Backend และกระทั่ง Database ที่เป็น PostgreSQL สามารถอ่านวิธีการต่าง ๆ ได้ใน Document ด้านบนนี้เลย เราใช้เวลาติดตั้งใน VM ที่มี Docker อยู่แล้ว ไม่เกิน 5 นาทีเท่านั้น จากนั้นก็เริ่มตั้ง DNS แล้วใช้งานได้เลย

2. Penpot Configuration

Design freedom for teams.

แต่หากต้องการนำไปใช้งานบน Production แนะนำให้อ่านพวกเรื่องของการ Configurate ไว้ด้วยก็ดีเพื่อความปลอดภัย เช่น การปิดระบบการ Register หรือการทำ Whitelist ของ Email ที่สมัครได้ และหากองค์กรของเรามี SSO ก็สามารถตั้งค่าเพื่อให้มันไปเรียกก็ได้เช่นกัน ตัวที่เราใช้งานที่บ้านเรียก Authentik มันสามารถใช้งานได้แบบลื่นไหล ไม่มีปัญหาเลย

โดยเมื่อเรา Deploy Container ออกมา เราจะได้ออกมาทั้งหมด 6 Containers ด้วยกัน ซึ่งโดยปกติมันจะกิน RAM อยู่ที่ประมาณ 1.2 - 1.8 GB เท่านั้นเอง แปลว่าหากเราจะเปิด VM เพื่อรัน Penpot อย่างเดียว คิดว่าน่าจะต้องเปิด RAM ไว้สัก 3-4 GB น่าจะได้เลย ส่วน CPU เท่าที่ลองดูมา มันไม่ได้กินอะไรมากมาย Single Core ก็เอาอยู่สบาย ๆ แล้วละ และสุดท้าย Storage เท่าที่ทดลองรันบน HDD เราก็ไม่พบปัญหาอะไรกับการทำงานเลย ส่วนขนาดขึ้นกับงานที่เราต้องการเก็บมากกว่า ซึ่งหากเราทำงานใน Managed VM อยู่แล้ว เปิดไม่ต้องเยอะ แล้วถ้ามันใกล้จะเต็ม เราอาจจะค่อย ๆ เปิดเพิ่มก็ได้เหมือนกัน

สรุป

หลังจากเราลองใช้งานมา เรารู้สึกว่า Penpot ถือว่าเป็น Figma Alternative ได้สบาย ๆ เลยนะ ด้วย Feature พื้นฐานที่มีมาให้เราอยากครบครันมาก ๆ หากเราต้องการจะออกแบบ Web และ Application ก็สามารถนำมาใช้งานได้เลย แต่ถามว่า มันสามารถแทน Figma ได้ 100% เลยมั้ย จากการได้อยู่ในทั้งสองโลก เราก็ยังรู้สึกว่า ถ้าจ่ายได้ Figma ยังเป็นตัวเลือกที่ดีกว่าอยู่ เพราะ เวลาใช้งานไปใน Document ที่มีความซับซ้อน และขนาดใหญ่มาก ๆ Figma ยังลื่นอยู่ ในขณะที่ Penpot คือแทบจะค้างอยู่กับที่แล้ว ขนาดเราใช้ Arc Browser บน M4 Max แล้วนะ เท่าที่เราลองไปอ่านดูเหตุผลที่มันเป็นแบบนั้นเป็นเพราะ Figma ใช้ WSM เลยทำให้มันดึงประสิทธิภาพของเครื่องออกมาได้มากกว่า แต่ถ้าถามว่า สำหรับเรา เราจะเลือกใช้ตัวไหน ณ วันนี้ เราก็น่าจะตอบว่า Penpot แหละ เพราะ Feature และ Performance ถือว่าเพียงพอสำหรับเราแล้ว และเรามีเครื่องที่สามารถ Host มันได้สบาย ๆ เลยทีเดียว เป็นอีกทางเลือกที่ดีสำหรับคนที่ต้องการ Collaboration Design Software ฟรี ๆ สักตัว