What is The Best Git For Sketch 💎
“อะไรคือสิ่งที่เหมาะสมที่สุด สำหรับระบบ Git ในการใช้งานกับโปรแกรม Sketch”
วันที่เริ่มเขียนบทความนี้คือวันที่ สิบเจ็ด เดือนแปด สองห้าหกศูนย์ (17/08/2560) ที่ระบุวันไว้เพราะ โปรแกรมแต่ละตัวนั้นมีการอัพเดทแข่งขันกันสูงมาก เป็นช่วงที่ Git For Designer นั้นได้เปิดตัวขึ้นมาให้เราเลือกใช้กันหลายบริการ แถมยังมี Plugin Support กันอีรุงตุงนัง จะเยอะกันไปไหน😆 Designer หลายคนเลยอาจจะมีอารมณ์
ขี้เกียจมานั่งเล่นว่าอันไหนดีที่สุดสำหรับการใช้งาน ผมเลยจะมาเล่าให้ฟังเกี่ยวกับการใช้งานว่าโปรแกรมแต่ละตัวที่ผมได้ไปลองเล่นและใช้งานจริง ว่ามีความแตกต่างกันอย่างไร ที่จะนำมาพูดให้ฟังก็มีทั้งหมด 4 ตัวด้วยกัน ได้แก่ SourceTree, Katcus, Abstract, Brand Ai มาเริ่มที่ SourceTree กันก่อนเลย
อธิบายสักนิดก่อนเริ่มอ่าน
ผมอาจจะใช้คำที่เป็นกลาง อ่านแล้วเข้าใจได้ง่ายเพื่อที่จะให้ผู้อ่านที่อาจจะยังไม่เคยได้ลองสัมผัสระบบ Git มาก่อนเลย เข้าใจเมื่อได้อ่าน
ผมจะมีระบุวันที่ไว้ในบทความว่าเริ่มเขียนวันไหน นั้นเป็นเพราะว่าในอนาคตมันอาจจะมีการอัพเดทโปรแกรมเพื่อรองรับระบบเพิ่มขึ้น ซึ่งมันจะดีขึ้นกว่าเดิม เพราะฉะนั้นข้อเสียที่ผมบ่นไว้ มันอาจจะโดนแก้ในอนาคตแล้วก็เป็น ด้ายยยยยยย
ผมจะไม่พูดถึงความสามารถพื้นฐานของระบบ Git เช่น การอัพขึ้น Commit แตก Branches ดึงขึ้น ดึงลง ฉะเองเอ๋ย เพราะไม่ได้จะมาสอน แต่เราจะพูดถึงความแตกต่างระหว่างตัวโปรแกรมว่ามันเป็นยังไง ข้อดีข้อเสียต่างกันยังไง
ส่วนใครที่ยังไม่รู้เลยว่า Git คืออะไรวะ!! แนะนำว่าให้ค้นหากูเกิ้ลเลยครับ🤣
SourceTree
SourceTree เป็น Tool ตัวนึงที่จะทำให้เราจัดการระบบ Git ของเราได้ง่ายขึ้น โดยโปรแกรมจะ Support GitHub BitBucket เป็นหลัก แต่เราก็สามารถที่จะใช้ร่วมกับบริการ Git อื่นๆได้เช่นกัน ตัวอย่างเช่น Gitlab (ส่วนตัวผมก็ใช้ Gitlab อยู่) มันจะทำหน้าที่จัดการ ไฟล์ข้างในโปรเจกต์ของเราได้สะดวกมากขึ้น เช่นการดูไฟล์ แสดงการแตก Branches แสดงเป็นเส้นสีต่างๆ ดูว่าใครทำอะไรอยู่ ใครอัพเดทอะไรเข้าไปใหม่
ข้อดี 👍🏻
1. ฟรี!! ใครๆก็ชอบของฟรี ชิมิ😏
2. แสดงเส้นสายการแตก Branches เป็นสีๆให้เราได้เห็นอย่างชัดเจนว่าใครดึงไฟล์ไปทำอะไร แสดงไฟล์เปรียบเทียบ (Preview) ระหว่างไฟล์เก่าและไฟล์ใหม่ที่เราอัพเข้าไป
3.โปรแกรมรวดเร็วไม่เชื่องช้าทำงานได้ดี อัพปุ๊ป ขึ้นบั๊ป ดึงบั๊ป ขึ้นปุ๊ป 🤣
ข้อเสีย 👎🏻
1. แตก Branches ชัดเจนได้ดีก็จริง ก็ดัน Merge ไม่ได้ซะงั้นอะ🙄 เป็นเพราะว่าหลักๆแล้วมันถูกเอาไปใช้ในเชิงการใช้งานสำหรับ Developer ยังไม่ได้ถูกพัฒนามารับรองสำหรับ Designer มันไม่สามารถที่จะรวมไฟล์ของ Sketch ได้
2. บางครั้งมันก็มี Bug แปลกๆ เช่น เวลาจะ Clone Folder มันจะแจ้งว่า Folder ต้องเป็น Folder เปล่าๆ ไม่มีข้อมูลข้างในนะถึงจะเริ่ม Sync ข้อมูลได้ ซึ่งโฟลเดอร์ที่เราสร้างก็เพิ่งสร้างเลย แต่ไม่ได้ งงกับมัน ได้บ้างไม่ได้บ้าง (แต่เป็น Bug ที่พอรับได้)
สรุป 🤘🏻
มันก็เหมาะกับการนำไปใช้งานเชิงการ Backup File ข้อมูลงาน Design ของเราไม่ว่าจะเป็นพวกไฟล์ Sketch หรือ Resource ต่างๆที่เราเก็บไว้เข้าไปใน Git เลย แล้วก็ใช้วิธีอัพลง Master นั่นเหละ ทับกันไปเรื่อยๆ แต่อย่าไปเผลอแตก Branches ที่มี Sketch ไฟล์ข้างในเชียวละ
อัพเดทข้อมูล soruceTree เมื่อ 13/07/60
Kactus
Kactus กระบองเพชรน้อย ตะมุตะมิ เป็น โปรแกรมตัวนึงที่ถูกปล่อยบน Github ถูกพัฒนามาเพื่อรองรับไฟล์ Sketch โดยเฉพาะเลย หากใครเคยใช้งาน sourceTree มาก่อน ผมเชื่อว่าจะเรียนรู้การใช้งานเจ้า Kactus ได้ไม่ยากเพราะว่าลักษณะการใช้งานค่อนข้างมีความเหมือนกัน ไม่ว่าจะเป็น Interface ของโปรแกรม แล้วก็สัญลักษณ์ต่างๆ เช่นพวก ไฟล์เพิ่มใหม่ ไฟล์โดนลบ ไฟล์ที่ถูกแก้ไข มีการ Preview เปรียบเทียบระหว่าง เวอร์ชั่นตัวเก่าละตัวใหม่ ดูได้จากรูปตัวอย่าง
ข้อดี 👍🏻
1. ฟรีอีกแล้วครับท่าน!! ใครๆก็ชอบของฟรี 😏
2. ใช้งานค่อนข้างง่ายกว่าตัว sourceTree ขอใช้คำว่าค่อนข้างง่ายนะ เพราะว่าถ้าใช้คำว่าง่ายเลย มันก็ดูจะเวอร์ไป เพราะตัวโปรแกรม ได้เอาพวก Icon น่าตาแปลกๆที่ฝั่ง Dev ที่เคยใช้งาน Git จะเข้าใจ หรือพวกฟังชั่นต่างๆออก เหลือแต่ที่จำเป็น
3. แต่ Branches ได้ด้วยจ้า บะ บะ บะ สามารถแยกไฟล์กันทำงานได้แล้ว แล้วพอทำงานเสร็จก็สามารถที่จะ Merge ไฟล์ต่างๆเข้าตัว Master ได้อย่างไม่มีปัญหา
ข้อเสีย 👎🏻
1. มีไฟล์ Json ปริศนาอยู่ในโฟลเดอร์ ? แล้วไอ้ไฟล์นี้มันคืออะไร ผมก็ได้ไปทำการหาดูข้อมูล และทำการทดลอง ทำให้ผมรู้ว่าไอ้ไฟล์ Json นั้นคือไฟล์ resource ที่ทางโปรแกรม Kactus มันสร้างขึ้นมา นั่นเอง ผมจะอธิบายให้ฟังคร่าวๆว่าเพราะอะไร เช่น ถ้าเรามีไฟล์ Sketch ชื่อว่า Project-A เมื่อเราอัพขึ้น Git มันจะไปสร้างโฟเดอร์ตัวหนึ่งชื่อ Project-A เหมือนชื่อไฟล์ Sketch เราเลย อยู่ที่เดียวกับโฟเดอร์เราวางไฟล์ Sketch ไว้ ข้างในนั้นมันจะมีพวกไฟล์ทั้งหมดคล้ายๆไฟล์ Asset ของไฟล์ Sketch ของเรา (เหมือนเรา Export มันออกมา) นี้เหละคือเหตุผลว่าทำไม เจ้าโปรแกรม Kactus มันเลย Preview และ แตก Branches Merge กันได้ ซึ่งส่วนตัวแล้วผมไม่ชอบเลย เหมือนมันมีไฟล์ที่เป็นไวรัส ติดอยู่ในโฟลเดอร์ แถมยังไปเพิ่มขนาดเนื้อที่ให้เราอีก
2. ช้ามากกกกกกกกกกก โปรแกรมตอนแรกก็ค่อนข้างเร็วเมื่อใช้งาน แต่พอเราสร้างโปรเจกสักตัว ลองใช้งานจริง อัพขึ้นลง มันดันโหลดนานมาก โปรแกรมก็ช้ามาก ซึ่งผมคิดว่าส่วนนึงมันมาจากการโหลดไฟล์ Json ข้างบนอะแหละ ซึ่งผมคิดว่าส่วนนี้จะถูกพัฒนาในอนาคตนะ ต้องรอดูกันต่อไป
สรุป 🤘🏻
มันโอเคในระดับนึงเลย ในเชิงการใช้งาน Git เพื่ออัพเดท Version ทั้งโปรเจก แถมยังฟรีอีก ถ้าใครสามารถทนมันได้ 2 เรื่อง
1. มันช้ามากกกก ซึ่งในอนาคตอาจจะโดนปรัปปรุงให้เร็วขึ้น ต้องรอดูกันต่อไป
2. มันสร้างไฟล์ Asset ที่เป็น PNG JPG JSON ไว้อีกชุด
สองเรื่องนี้ถ้าใครรับได้ ก็ลองใช้งานเลย แนะนำ
อัพเดทข้อมูล Kactus เมื่อ 21/07/60
Abstract
มาถึง Abstract กันบ้าง หลายๆคนยกเจ้านี้เป็นให้เป็นโปรแกรม Git For Sketch ที่ดีที่สุดนะ แต่มันก็ยังไม่สุดสำหรับผมนะ (เรื่องมากจัง 😂) มันยังคงต้องมีอีกหลายข้อที่ต้องอัพเดทพัฒนากันต่อไป โดยรวมแล้วโปรแกรมนี้ก็เพิ่งเปิดตัวได้ไม่นาน โดยรวมแล้วก็เป็นโปรแกรมที่มีหน้าตาใช้งานง่าย ง่ายกว่าตัว sourceTree และ Kactus มาก เพราะถูกออกแบบมาอย่างดี ในระดับที่ไม่ต้องมีความรู้เรื่อง GitLab GitHub มาก่อนก็สามารถใช้งานได้ เพราะเวลาเราอัพไฟล์ขึ้นไป มันไม่ได้อัพขึ้น Git นะสิ Abstract เขามีเซิร์ฟเวอร์เป็นของตัวเอง และนี้ก็เป็นสิ่งที่ผมคิดว่าเป็นข้อเสียที่เป็นจุดบอดที่ทำให้มันสู้ แบบการใช้งานบน Gitlab จริงๆไม่ได้ เดี๋ยวจะมาพูดในข้อดีข้อเสียว่า เป็นยังไง หน้าตาของโปรแกรมก็ประมาณนี้
หน้าตาคร่าวๆก็จะมีให้เรา เลือกเปลี่ยน User ได้ จะเป็น User เราเอง หรือ ขององค์กร ก็สามารถสลับไปมาได้ เมื่อกด New Project ก็จะขึ้นมาเป็น Card แยกตาม Project ที่เราสร้างเลย (ในการสร้าง User สำหรับองค์กรจะต้องเสียเงิน)
ข้อดี 👍🏻
1.โปรแกรมใช้งานง่าย เพราะถูกออกแบบมาให้สำหรับคนที่ไม่เคยใช้ระบบ Git มาก่อน ก็ใช้งานได้
2.โปรแกรมทำงานเร็วไม่โหลดช้า เหมือน Kactus 🙄 (กัดเบาๆ)
3. จุดเด่นเลยข้อนี้ คือมันไม่ได้เปรียบเทียบแค่ Design แบบเก่า กับแบบใหม่ที่อัพเข้าไป เฉยๆ แต่มันสามารถบอกถึง ถ้าเราเปลี่ยน Symbol ใน Sketch 1 ปุ่ม จะมีหน้าไหนที่กระทบบ้าง ปุ่ม Symbol ที่เราเปลี่ยน จะมีอีกกี่หน้าที่เปลี่ยนด้วย แล้วก็แสดงให้เราเห็นด้วย โคตร คูลลลลลลลลลลลลลลลลลล 😎
ข้อเสีย 👎🏻
1. มันไม่ฟรี ฮ่าๆ จริงๆมันก็ไม่ใช่ข้อเสียนะ แต่ราคามันก็ค่อนข้างแพงเอาเรื่อง สำหรับ User Free ก็สามารถใช้งานได้ปกตินะครับ แต่จะใช้งานแบบคนเดียว โดดเดี่ยวเดียวดาย ไม่สามารถดึงใคร มาร่วมงานกับเราได้ ถ้าอยากใช้แบบทีมก็ จ่ายเงิน
2. มันอัพได้แต่ไฟล์ Sketch ! ซึ่งหลายคนบอกว่า แค่นั้นก็พอแล้วไม่ใช่หรอ แต่ถ้าคนที่เคยใช้งาน Git มาก่อนเหมือนผม อาจจะรู้สึกแปลกๆ เพราะ Git มันอัพทุกอย่างขึ้นไปได้ ไฟล์ Resource ต่างๆที่เรามีใน Project อัพขึ้นไปเก็บบน Git ได้หมดเลย เช่นพวก PNG JPG แต่ Abstract อัพได้แต่ไฟล์ Sketch นะจร่ะ ซึ่งผมก็เข้าใจนะว่าเขาต้องการเน้นเรื่อง Version control ของตัวงาน อันนี้ก็อยู่ที่ว่าจะชอบแบบไหน
3. ไฟล์งานที่เราอัพขึ้นไปจะอยู่บนเซิร์ฟเวอร์ของ Abstract เองเลย ไม่ได้ไปอยู่บน Gitlab หรือ Github ฉะนั้น หากเราอยากจะแชร์ไฟล์งานให้ใคร ก็ต้องเชิญเขาเข้าร่วมใช้งาน Abstract แต่ถ้าเป็นระบบ Git อื่นๆ ก็แค่โยนลิงค์ให้ โต๊ม จะดึงไรไปทำก็จัดการเองเลยนะ 😂 โปรแกรมก็ไม่ต้องลง อีกอย่างคือ ถ้ามันไปไม่รอด ประกาศปิด ก็เตรียมดึงงานออกมาให้ไวเลยนะครับ
4. ไฟล์ในเครื่องไม่อัพเดทตามไฟล์บน Abstract เหตุผลเพราะว่าถ้าเราโยนไฟล์อัพขึ้นไปบน Abstract แล้ว ไฟล์ที่เราทำการแก้ไขมันก็จะเป็นไฟล์ที่อยู่ในเซิร์ฟเวอร์ Abstract เลย หลายคนสงสัยคิดในใจว่า ก็ดึงลงมาอัพเดทสิ (Git อะ ใช้เปงป่าาาา) ใช่ครับ!! มันไม่มี Pull ลงมา วิธีเดียวที่อัพเดทตอนนี้คือ Export ไฟล์จากโปรแกรม Abstract ออกมาแล้วทับไฟล์เดิม เจริญพวง 🙄
5. แก้ไขไฟล์ใน Branches Master ไม่ได้ ต้องแตก Branches ทุกครั้งที่แก้ไขไฟล์ หืม…… มันก็ไม่เชิงข้อเสียหรอกนะครับ แต่มันอาจจะกระทบ Process การทำงานของ Designer และตัวทีม อันนี้อยู่ที่คน ว่าจะมองว่ามันเป็นข้อเสียหรือป่าว
สรุป 🤘🏻
Abstract นี้น่าจะใกล้ความจริงกับการใช้งานมากที่สุดแล้ว แต่สำหรับผมมันติดอยู่บางเรื่องจริงๆ
1.เรื่องอัพไฟล์อื่นขึ้นไปไม่ได้
2.การ Pull ลงมาอัพเดทไฟล์ Original เราด้วย
แต่มันคงจะมีการอัพเดทแก้ไขกันต่อไป ต้องเฝ้าติดตาม
(ลดราคาด้วยหน่อยก็จะดีนะครับลูกพี่)
อัพเดทข้อมูล Abstract เมื่อ 27/07/60
Brand Ai
มากันต่อที่ Brand Ai น้อยคนที่จะรู้จักโปรแกรมตัวนี้ ผมก็ได้รู้จักโปรแกรมตัวนี้จากกลุ่ม Sketch User thailand ใครสนใจสามารถไปกดเข้าร่วมกลุ่มได้นะครับ
โดยตัวโปรแกรมจะมีฟังชั่นการสนับสนุนการทำงานด้านการออกแบบ ซึ่งเราสามารถไปปรัปใช้ได้กับหลายแขนง เช่นการทำ Branding หรือจะเป็น Interface Design ก็ได้ โดยทางผู้พัฒนาเขาได้ขายของโดยใช้คำว่า Sharing a Design Library โดยวิธีใช้งานคือเราจะต้องอัพไฟล์ขึ้นไป แยกเป็นส่วนๆ เช่น ปุ่ม, ไอคอน, รูปภาพ, สี, สไตล์ฟอนต์ ขึ้นไปบนโปรแกรม โดยในแต่ละหมวด เราก็สามารถ แบ่งได้อีกนะว่า จะ แยกประเภทอีกมั้ย เช่น ไอคอนหลัก ไอคอนหลังบ้าน เป็นต้น ตัวอย่าง ตามรูปข้างล่าง
(Original อัพตามด้วยนะถ้าแก้ไข😉)
ล่าสุดทางโปรแกรมก็ได้ อัพเดทเพิ่มหมวดเข้ามาเป็นชื่อว่า Artboard ซึ่งเราสามารถอัพเดททั้งหน้า Artboard ของเราเข้าไปได้เลย ก่อนที่จะไปพูดถึงข้อดีข้อเสียโปรแกรม อยากจะอธิบายเพิ่มนิดหน่อยเกี่ยวกับตัว Brand Ai เพราะว่า มันจะทำงานแตกต่างจาก ตัวอื่นไปหน่อย ตรงที่การใช้งานจะไม่ได้เน้นไปทางการอัพเดท เพื่อ Backup หรือ Version Control เท่าไร แต่จะเน้นไปทางการส่งต่องาน และอัพเดทตัวงานไปพร้อมๆกันมากกว่า โดยตัวโปรแกรมก็ไม่ได้มีระบบการ อัพขึ้นแล้ว Commit หรือการแตก Branches เพื่อแยกการทำงานอย่างไร
ข้อดี 👍🏻
1. โปรแกรมออกแบบ UI มาค่อนข้างเข้าใจง่าย ใช้คำว่า ค่อนข้างนะ เพราะจากที่ใช้งาน มันมีหมวดมาให้เลือกเยอะ มันก็ งง นิดหน่อยเวลาเราจะกด ในส่วนนี้คิดว่าอาจจะมีการอัพเดทต่อไปอีกเรื่อยๆ
2. เวลาเราลากวาง Symbol ลงไป หรือโยน Artboard ที่เราอัพไว้ในโปรแกรม ไม่ว่าเราจะทำ Symbol ไว้เยอะแค่ไหน ซ้อนแล้วซ้อนอีก โปรแกรมก็สามารถ เรียกไฟล์มาได้ครบ ทั้งงานและชื่อของ Layer ด้วย
3. หากเราสร้างโปรเจกต์ เราสามารถแยกหมวดข้างในโปรเจกได้อีกขั้น ตามตัวอย่างข้างบนที่ได้เสนอไป ยกตัวอย่างเช่น ถ้าเราสร้าง หมวด Icon สีฟ้า ขึ้นมา จะแบ่งแยกอีกหมวด เป็น Set Icon สี ดำ ขนาน เท่าไรก็ว่ากันไป
ข้อเสีย 👎🏻
1. มันไม่มีการ Commit File เวลาอัพขึ้น ว่ามีใครแก้ไขอะไรไปบ้าง
2. อันนี้ก็ไม่เชิงข้อเสียซะทีเดียว คือมันไม่สามารถอัพไฟล์อื่นๆเข้าไปได้
เหมือนกับ Abstract เลย อัพได้แต่ไฟล์ที่เป็นโปรแกรมออกแบบเช่น PSD Sketch Ai ซึ่ง Git ตัวอื่นอัพไฟล์ทั้งโปรเจกต์ของเราได้
สรุป 🤘🏻
Brand Ai ส่วนตัวผมคิดว่าน่าจะเหมาะกับองค์กรที่เน้นการต่อส่งงานออกแบบ และงานประเภท Branding ถ้าเราเน้น Verstion Control หรือการ Backup ไฟล์ แนะนำลองใช้ตัวอื่นดีกว่าครับ
อัพเดทข้อมูล Brand Ai เมื่อ 31/07/60
จบไปแล้วครับ 😊 กับการเล่าความแตกต่างระหว่างโปรแกรมแต่ละตัวที่จะช่วยเราทำงานสำหรับการ Support Sketch ไฟล์ ต้องบอกว่ามันยังมีรายละเอียดยิบหย่อยอีกหลายเรื่องที่แต่ละโปรแกรมนั้นแตกต่างกัน ผมอาจจะหยิบมาเล่าได้ไม่หมดทุกเม็ดในการเขียนครั้งนี้ ไหนจะมีเรื่องการอัพเดทเวอร์ชั่นของโปรแกรมที่จะพัฒนาไปเรื่อยๆ แต่คิดว่าหลายๆคน คงจะได้ประโยชน์หรือการตัดสินใจในการเลือกใช้งานในระดับนึง เพื่อให้เข้ากับการใช้งานกับตัวเอง หรือ องค์กรที่เราทำงานอยู่ แล้วพบกันใหม่กับการบ่นครั้งต่อไปของผม
สามารถอ่านบทความอื่นๆของผมได้ที่นี่ครับ
https://medium.com/20scoops-cnx/tagged/design
ทิ้งท้าย 💨
หากใครสนใจหาข้อมูลเพิ่มเติม สามารถเข้าไปดูจากลิงค์นี้ได้ครับ ในส่วนแรกเขานำเสนอเกี่ยวกับ Abtract แต่ในส่วนท้ายของ Blog เขาได้นำลิงค์ข้อมูลจากหลายแหล่งที่เกี่ยวกับ Git For Designer มารวมไว้ให้แล้ว
