Sketch มันของ Designer, Dev อย่างเรามันต้อง Zeplin

Nati Namvong
Stories of Sellsuki
2 min readOct 25, 2016

--

ทีม Design ของหลายๆทีมคงจะเริ่มเปลี่ยนมาใช้ Sketch กันแล้ว ซึ่ง Workflow ของแต่ละทีมก็คงจะแตกต่างกันออกไป บ้างก็ให้ Designer เป็นคน Export ทุกอย่างออกมาแล้วส่งให้ Dev เอาไปใช้ หรือบางทีมก็อาจจะส่งไฟล์ Sketch ไปให้ Dev แกะเอาเอง ซึ่งที่ Sellsuki เราก็ใช้ Workflow แบบหลังนี้อยู่พักใหญ่ๆเลยทีเดียว ซึ่งก็จะมีปัญหาเล็กๆน้อยๆ ตลอดเวลา เช่น

ใช้ Licence ที่ Share กันอยู่(ก็งบมันน้อย 555) ก็เลยต้องมาค่อยใส่ Licence Key ใหม่กันอยู่เรื่อยๆ ตอนที่โดนจับได้ แต่พอมาช่วงหลังๆนี้ Sketch เริ่มฉลาดขึ้น เริ่มเอา Key มา Share กันไม่ได้แล้ว T_T.. ก็เกิดปัญหาขึ้นมานะสิ

อีกปัญหาก็คือ ไฟล์ Sketch ที่ Share กันละหว่าง Designer กับ Dev นั้นมันแก้ไขได้ ทำให้ Dev อาจจะพลาดไปขยับนู่นนี่ได้ แล้วทำให้ Design เพี้ยน ซึ่ง Designer ของเรานี้มีสายตาที่เฉียบคมมาก แค่ 1px มันก็จับได้แล้ว(แอบแซว)

จากปัญหาที่เราเจอกันก็เลยไปลองหา Tools เข้ามาช่วยแก้ปัญหานี้ดู ซึ่งก็ไปเจอเจ้า Zeplin นี้เข้า ดูๆแล้วมันค่อนข้างตอบโจทย์มากเลยทีเดียว

Zeplin เป็นเครื่องมือสำหรับให้ Designer ได้ Share งาน Design ไปยัง Dev ด้วยวิธีง่ายๆ และ Update ได้ตลอดเวลา เพราะมี Plugin เอาไว้ให้ไปติดตั้งใส่ Sketch ส่วน Dev ก็เปิดงานผ่านโปรแกรม Zeplin ได้เลย ซึ่ง Dev จะแก้ไขงานไม่ได้ ดูได้อย่างเดียวเท่านั้น แต่ก็ไม่ใช้แค่ดูเฉยๆนะเพราะ Zeplin เค้าก็มีเครื่องมือที่ทำให้ Dev ทำงานได้สะดวกขึ้นมาให้ เช่น

style guides ที่ Update ให้อัตโนมัต ไม่ว่าจะเป็นค่าสี หรือ Font ก็ List มารวมไว้ที่นี่ที่เดียว

style guides

บอก Size ต่างๆ และ ไม้บรรทัดที่วัดได้สะดวกมากๆ

Inspecting specs has never been this painless.

…ขายของแค่นี้พอ ❤❤❤
ถ้าสนใจลองเข้าไปดู Feature อื่นๆของ Zeplin ได้ที่เว็บเลย Go go go…

--

--