สอน Excalidraw ฉบับสมบูรณ์: เสกผังงานด้วยประโยคเดียว แล้วแก้ด้วยมือให้เป็นแบบที่คุณต้องการ

ประชุมเก็บความต้องการบ่ายวันพุธ วิศวกรวาดบนไวต์บอร์ดไปได้ครึ่งทาง product manager ก็พูดขึ้นว่า "เดี๋ยวก่อน อย่าเพิ่งวาด เราเปิดไดอะแกรมออนไลน์มาแก้ด้วยกันดีกว่า" มีคนเปิดเครื่องมือทำไดอะแกรมชื่อดังตัวหนึ่งขึ้นมา แล้วเริ่มถามว่า "บัญชีคุณอันไหน เดี๋ยวเพิ่มเข้า workspace ให้" ห้านาทีผ่านไป ไดอะแกรมยังไม่ได้เริ่มวาดเลย

จังหวะแบบนี้แหละที่คุณค่าของ Excalidraw จะเผยออกมา แปะลิงก์เส้นเดียว ทุกคนเข้ามาวาดได้ทันที ไม่ต้องมีบัญชี ไม่ต้องเชิญ ไม่ต้องตั้งค่าสิทธิ์

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

มันคืออะไร: ไวต์บอร์ดที่จงใจวาดให้ดูไม่เนี้ยบ

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

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

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

ทำอะไรได้บ้าง

สามอย่าง: ไวต์บอร์ดลายมือ แปลงข้อความเป็นไดอะแกรม และการทำงานร่วมกันแบบเรียลไทม์

ไวต์บอร์ดลายมือคือพื้นฐาน มีสี่เหลี่ยม วงกลม ลูกศร ข้อความ เส้นอิสระ บวกกับเส้นเชื่อมที่ดูดติดกันเองระหว่างรูปทรง วาดสถาปัตยกรรมระบบ ร่างผังงาน หรือภาพประกอบสำหรับสไลด์ก็เพียงพอ

แปลงข้อความเป็นไดอะแกรมคือฟีเจอร์ AI ของมัน ซึ่งวิธีทำงานคุ้มค่าแก่การเข้าใจมาก (จะเล่าละเอียดในหัวข้อถัดไป)

ส่วนการทำงานร่วมกันก็แค่แปะลิงก์ก็แก้พร้อมกันได้หลายคน เคอร์เซอร์แสดงผลแบบเรียลไทม์ เหมาะกับการคุยกันเฉพาะกิจของทีมที่ทำงานทางไกลมาก

ใช้ยังไง: ห้าขั้นตอน

ขั้นแรก เริ่มวาดเลย เปิด excalidraw.com ไม่ต้องตั้งค่าอะไรทั้งนั้น เลือกรูปทรงจากแถบเครื่องมือด้านซ้าย แล้วลากบนผืนผ้าใบ กด V คือเลือก R คือสี่เหลี่ยม O คือวงกลม A คือลูกศร จำคีย์ลัดพวกนี้ไว้ ความเร็วต่างกันเยอะ

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

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

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

ขั้นที่ห้า ส่งออก ส่งออกเป็น PNG หรือ SVG เพื่อใช้ในสไลด์ หรือบันทึกเป็นไฟล์ .excalidraw เพื่อเก็บความสามารถในการแก้ไข ถ้าจะใส่ในเอกสาร SVG จะไม่แตกเวลาย่อขยาย ควรเลือกตัวนี้ก่อน

เทคนิคขั้นสูง

ใช้ประเภทไดอะแกรมใหม่ของ Mermaid ให้เป็น ในปี 2026 Excalidraw ขยายความสามารถของ Mermaid ตอนนี้สร้างแผนภาพสถานะ (State Diagram) และแผนภาพความสัมพันธ์ระหว่างเอนทิตี (ERD) ได้โดยตรงในตัวแก้ไข เวลาวาดความสัมพันธ์ของฐานข้อมูลหรือ state machine เขียนด้วยไวยากรณ์ Mermaid เร็วกว่าลากด้วยมือสิบเท่า

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

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

ล็อกองค์ประกอบพื้นหลัง เวลาวาดผังสถาปัตยกรรมขนาดใหญ่ ให้ล็อกกรอบชั้นล่างเอาไว้ (คลิกขวาเลือก Lock) เวลาย้ายองค์ประกอบชั้นบนจะได้ไม่เผลอลากโดน

ข้อควรระวัง

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

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

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

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

บทวิจารณ์จาก TheAI Academy

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

การออกแบบฟีเจอร์แปลงข้อความเป็นไดอะแกรมเป็นสิ่งที่ผมชื่นชมเป็นพิเศษ มันไม่ได้แกล้งทำเป็นว่า AI ทำได้จบในทีเดียว แต่เปิดเผยผลผลิตกลางทาง (Mermaid) ให้คุณแก้อย่างตรงไปตรงมา การออกแบบแบบ "AI ทำแปดส่วน คนแก้สองส่วน แถมยังแก้ได้จริง" แบบนี้ ปฏิบัติได้จริงกว่าการสร้างในคลิกเดียวแบบกล่องดำมาก

บทวิจารณ์: Excalidraw ชนะเพราะแรงเสียดทานน้อยจนไม่มีข้ออ้างไม่ใช้ AI ของมันไม่ได้จะมาแทนการวาดของคุณ แต่ช่วยคุณข้ามห้านาทีของการเริ่มจากศูนย์

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

แหล่งข้อมูล

• Excalidraw+ Changelog
• เว็บไซต์ทางการ Excalidraw

เรียบเรียงจากข้อมูลสาธารณะ ฟีเจอร์และแพ็กเกจยึดตามประกาศล่าสุดของทางการเป็นหลัก