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

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

Floorplan เป็นปลั๊กอินโอเพนซอร์สที่เปิดให้ใช้ฟรีภายใต้สัญญาอนุญาต MIT พัฒนาโดย Hayden Smith ที่ใช้ชื่อ haydenschmitty บน GitHub ตัวปลั๊กอินออกแบบมาให้ใช้กับเครื่องมือ AI ช่วยเขียนโค้ดอย่าง Claude Code และ Codex ซึ่งรันผ่านบัญชี Claude และ ChatGPT ตามลำดับ

จุดเด่นสำคัญคือ เครื่องมือนี้ใช้โควตาจากแพ็กเกจ Claude หรือ ChatGPT ที่เราจ่ายรายเดือนอยู่แล้วได้เลย ไม่ต้องไปขอ API key หรือรหัสเชื่อมต่อบริการเพิ่ม ตอนนี้โปรเจกต์ได้ดาวบน GitHub ไปแล้ว 4.1k ดาว

แผนที่ของ Floorplan เขียนให้เจ้าของแอปอ่านเข้าใจง่าย

ตัวอย่างที่เห็นภาพชัดเจนคือ Brewline ร้านกาแฟจำลองที่ผู้พัฒนาทำไว้ทดสอบ ร้านนี้มีระบบขายกาแฟแบบสมาชิก และแยกโค้ดออกเป็น 4 repository หรือคลังเก็บโค้ดของแต่ละส่วน ที่เรียกสั้นๆ ว่า repo

เมื่อเปิดแผนที่ หน้าแรกจะแสดงภาพรวมของทั้งระบบ ฝั่งซ้ายคือส่วนที่คนใช้งานจริง ได้แก่ Online shop สำหรับลูกค้า และ Staff app สำหรับพนักงาน ตรงกลางคือ Main server ที่ทั้งสองแอปเชื่อมต่ออยู่ ส่วนฝั่งขวาคือบริการภายนอกที่เซิร์ฟเวอร์เรียกใช้ต่อ

ชื่อบนกล่องอ่านแล้วรู้ทันทีว่าส่วนนั้นทำหน้าที่อะไรให้ธุรกิจ เพราะโดยค่าเริ่มต้น Floorplan จะสั่งให้ AI อธิบายด้วยภาษาธรรมดาที่เจ้าของแอปเข้าใจ ไม่ใช่ศัพท์ของโปรแกรมเมอร์ ในขั้นตอนสร้างแผนที่ หากชื่อหรือคำอธิบายส่วนไหนเผลอใช้ศัพท์เฉพาะ เช่น "API client", "UI kit" หรือชื่อเฟรมเวิร์ก ระบบจะเตือนให้ AI กลับไปเขียนใหม่ให้เป็นภาษาธรรมดา

แต่ถ้าผู้อ่านเป็นนักพัฒนา ก็สามารถพิมพ์สั่ง Rewrite the floorplan for developers เพื่อให้แผนที่เปลี่ยนมาใช้ภาษาเชิงเทคนิคได้ และหากชื่อที่ AI ตั้งไม่ตรงกับคำที่ทีมเรียกกันจริง ก็สั่งเปลี่ยนได้ทันที เช่น rename 'Main server' to 'Shop API' โดยชื่อที่แก้ไขนี้จะยังคงอยู่ และไม่เปลี่ยนกลับเมื่ออัปเดตแผนที่ในครั้งต่อไป

ใครอยากลองเล่น แผนที่ของ Brewline เปิดให้ลองใช้จริงผ่านเบราว์เซอร์ที่ เดโมของ Floorplan โดยไม่ต้องติดตั้งอะไรลงเครื่อง

แผนที่ที่พิมพ์ถามตอบได้ ไม่ใช่แค่ภาพนิ่ง

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

ฟีเจอร์ที่ช่วยตอบคำถามเรื่องการทำงานของระบบได้ตรงจุดที่สุด คือช่อง "Ask the map" ด้านล่างหน้าจอ ที่พิมพ์ถามเป็นภาษาอังกฤษธรรมดาได้เลย เช่น

• What happens when someone places an order? – ตอนมีคนสั่งซื้อสินค้า ระบบทำอะไรบ้าง
• If I change the users table, what breaks? – ถ้าแก้ไขตารางข้อมูลผู้ใช้ จะมีส่วนไหนพังบ้าง
• Which files handle login? – มีไฟล์ไหนบ้างที่ดูแลเรื่องการล็อกอิน

ถ้าคลิกเลือกกล่องใดกล่องหนึ่งไว้ก่อนพิมพ์ถาม คำถามก็จะจำกัดวงอยู่เฉพาะส่วนนั้น

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

นอกจากแผนผังหลักแล้ว ยังมีเครื่องมืออื่นๆ ให้ใช้อีก ได้แก่:

• Health check: ตรวจความปลอดภัยเบื้องต้น เช่น มีรหัสผ่าน API key หรือกุญแจรหัสลับอย่าง Private key ฝังค้างอยู่ในโค้ดหรือไม่ และมีไฟล์ .env ที่เก็บค่าความลับของแอปเผลอบันทึกรวมไปกับโค้ดหรือเปล่า ระบบจะบันทึกไว้เฉพาะชื่อไฟล์ บรรทัด ประเภทปัญหา และคำใบ้ที่ปิดค่าจริงไว้บางส่วนเท่านั้น ไม่บันทึกค่าความลับจริงลงไป
• Recent work: ดูว่ารอบล่าสุด AI เข้าไปแก้โค้ดตรงไหนบ้าง กล่องที่มีการแก้ไขจะเปลี่ยนเป็นสีเขียว พร้อมสรุปว่าเราสั่งอะไรไปและแก้ไปเพื่ออะไร แนวคิดนี้ใกล้เคียงกับ Whiteboard ที่ให้ AI วาดแผนภาพอธิบายงานของตัวเอง
• Guided flow: พาไล่การทำงานของแต่ละฟังก์ชันทีละขั้นตอน เช่น ในเดโมมี Flow แสดงขั้นตอนการส่งของขวัญสมาชิกกาแฟ ถ้าอยากดู Flow อื่นเพิ่ม ก็สั่งด้วยประโยคธรรมดาได้ เช่น Add a flow showing how a new user signs up
• รองรับมือถือและแท็บเล็ต: เปิดดูบนหน้าจอขนาดเล็กได้สะดวก ใช้นิ้วเลื่อนหรือจีบนิ้วเพื่อซูมเข้าออกได้ทันที
• Export: ส่งออกแผนที่เป็นไฟล์ HTML ไฟล์เดียว เพื่อส่งต่อให้คนอื่นเปิดดูได้ง่าย ผลจาก Health check และ Recent work จะติดไปด้วยก็ต่อเมื่อเราติ๊กเลือกไว้เท่านั้น ส่วนที่อยู่โฟลเดอร์ในเครื่อง ลิงก์ repo และซอร์สโค้ด จะไม่หลุดติดไปด้วยอย่างแน่นอน

ยังไม่มีโค้ดก็วาดจาก PRD ได้

แม้โปรเจกต์จะยังไม่ได้เริ่มเขียนโค้ดเลยสักบรรทัด เราก็สามารถส่งเอกสารสรุปความต้องการของแอปอย่าง PRD, สเปก หรือคำอธิบายการทำงานให้ระบบ แล้วพิมพ์สั่งว่า Here's my PRD. Make me a floorplan of what we'd need to build.

สิ่งที่ได้คือแผนผังหน้าตาเหมือนกัน แต่เส้นขอบของแต่ละกล่องจะเป็นเส้นประ เพื่อบอกว่านี่คือโครงสร้างที่อยู่ในแผนงาน ขณะที่ฟีเจอร์ Health check จะเปลี่ยนไปทำหน้าที่รีวิวว่าแผนนี้ยังมีจุดไหนตกหล่นไปบ้าง พร้อมมีปุ่ม "Build this" เตรียมไว้ให้สั่ง AI สร้างโค้ดในแต่ละส่วนต่อได้ทันที นอกจากนี้เรายังปรับแต่งแผนงานเพิ่มได้ เช่น สั่ง also plan out refunds และเมื่อเราเริ่มลงมือเขียนโค้ดจริง แผนผังชุดนี้ก็จะค่อยๆ อัปเดตกลายเป็นแผนที่ของแอปจริงต่อไป โดยสามารถอ่านรายละเอียดเพิ่มเติมได้ในหน้า Getting started ของโปรเจกต์

ติดตั้ง Floorplan ใน Claude Code หรือ Codex

สิ่งที่ต้องเตรียมก่อนติดตั้งมีเพียง 2 อย่าง คือ Node.js เวอร์ชัน 18 ขึ้นไป ซึ่งเป็นโปรแกรมสำหรับรันโค้ด กับ Claude Code หรือ Codex ตัวใดตัวหนึ่ง ผู้พัฒนาบอกไว้ในคลิปสาธิตว่าการติดตั้งใช้เพียง 2 คำสั่ง และเสร็จในเวลาประมาณ 30 วินาที

Claude Code: สั่งผ่านแท็บ Code ในแอปเดสก์ท็อป หรือพิมพ์ผ่าน CLI ในหน้าต่างคำสั่งอย่าง Terminal ก็ได้:

claude plugin marketplace add haydenschmitty/floorplan
claude plugin install floorplan@floorplan

เมื่อติดตั้งเสร็จ ให้เปิดห้องแชตใหม่ ทั้งนี้แม้คุณจะใช้แอปเดสก์ท็อปเป็นหลัก ก็แนะนำให้ลง Claude Code แบบ CLI ไว้ด้วย เพราะหากข้ามขั้นตอนนี้ แผนที่จะยังเปิดดูได้ปกติ แต่ช่อง Ask the map จะเปิดอ่านโค้ดจริงไม่ได้ ทำให้ต้องสลับไปถามผ่านแอป Claude ซึ่งจะตอบได้เฉพาะข้อมูลที่อยู่บนแผนที่เท่านั้น

Codex: ติดตั้งได้ 2 วิธี วิธีแรกทำในแอป Codex ได้ทันทีโดยไม่ต้องเปิด Terminal:

1. เปิดไปที่หน้า Plugins แล้วกดเลือก Add a marketplace
2. ใส่ haydenschmitty/floorplan ลงในช่อง Source แล้วกด Add marketplace
3. ค้นหา Floorplan แล้วกดปุ่ม + เพื่อติดตั้ง

วิธีที่สองคือติดตั้งผ่าน Terminal ด้วย 2 บรรทัดนี้:

codex plugin marketplace add haydenschmitty/floorplan
codex plugin add floorplan@floorplan

จากนั้นเปิดห้องแชตใหม่ แล้วพิมพ์ขอให้สร้าง floorplan หรือพิมพ์คำสั่ง $floorplan ได้ทันที ส่วนแอปเดสก์ท็อปของ Codex รองรับช่อง Ask the map พร้อมใช้อยู่แล้ว

เมื่อติดตั้งเรียบร้อย ขั้นตอนการใช้งานจริงจะมีเพียง 4 ขั้นตอน:

1. เปิดโฟลเดอร์โปรเจกต์ใน Claude Code หรือ Codex ถ้าโค้ดหน้าบ้านและหลังบ้านแยกกันคนละ repo ให้เปิดโฟลเดอร์หลักที่ครอบทั้งสองส่วนไว้
2. พิมพ์คำสั่ง Make me a floorplan of this app.
3. รอให้แผนที่เปิดขึ้นบนเบราว์เซอร์อัตโนมัติ แล้วระบบจะเริ่มด้วยการพาชมวิธีใช้งานสั้นๆ
4. หลังจากพัฒนาแอปต่อไปสักระยะ ให้พิมพ์ Update the floorplan. ระบบจะกลับไปสแกนเฉพาะส่วนที่มีการเปลี่ยนแปลง และอัปเดตงานล่าสุดเข้าไปในการ์ด Recent work

ไฟล์ทั้งหมดจะบันทึกไว้ในโฟลเดอร์ floorplan/ ของโปรเจกต์ โดยตัวแผนที่หลักคือไฟล์ floorplan/index.html ซึ่งเปิดดูบนเบราว์เซอร์ผ่านเซิร์ฟเวอร์ขนาดเล็กบนเครื่องของเรา สำหรับโปรเจกต์ขนาดเล็ก แผนที่แรกจะใช้เวลาประมวลผลเพียงไม่กี่นาที แต่หากเป็นโปรเจกต์ขนาดใหญ่จะใช้เวลานานขึ้น เพราะระบบต้องสร้างคำอธิบายให้ครบทุกไฟล์และ Endpoint ซึ่งเป็นจุดที่เซิร์ฟเวอร์เปิดรับส่งข้อมูลทั้งหมด

งานไหนให้สคริปต์ทำ งานไหนให้ AI คิด

การให้ AI มานั่งอ่านโค้ดทั้งระบบอาจฟังดูเปลืองโควตาแพ็กเกจ แต่ Floorplan ไม่ได้โยนทุกอย่างให้ AI ทำ เพราะระบบแบ่งงานออกเป็น 2 ฝั่งชัดเจน:

ฝั่งแรกคือสคริปต์ Node.js ทั่วไป: ซึ่งไม่ต้องติดตั้งแพ็กเกจเสริมเพิ่ม และไม่กินหน่วยนับคำอย่าง Token ของ AI เลย โดยสคริปต์ส่วนนี้จะคอยจัดการงานประมวลผลตามขั้นตอนทั้งหมด ได้แก่:

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

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

สิ่งที่สคริปต์เตรียมไว้ส่งต่อให้ AI คือ "เอกสารสรุปย่อ" ของแต่ละส่วน เอกสารนี้จะระบุว่าแต่ละไฟล์ประกาศฟังก์ชันอะไรไว้บ้าง เรียกใช้อะไร และมีใครเรียกใช้บ้าง พร้อมยกโค้ดของทุก Endpoint และโค้ดของไฟล์สั้นๆ มาทั้งไฟล์ โดยยาวไม่เกิน 120 บรรทัดต่อชุด นอกจากนี้ สคริปต์จะช่วยปิดบังข้อความที่ดูเหมือนรหัสลับออกไปก่อน และจะไม่ยกเนื้อหาของไฟล์ .env มาใส่ในเอกสารสรุปเลย

รอบแรกจะใช้โควตาแพ็กเกจ Claude หรือ ChatGPT ตามปกติ ถ้าใช้บน Claude Code กับโปรเจกต์ขนาดใหญ่ ระบบจะแบ่งเอกสารสรุปให้ Agent หรือผู้ช่วยย่อยหลายตัวช่วยกันประมวลผลไปพร้อมๆ กัน

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

นอกจากนี้ การตรวจไฟล์ผ่านระบบ Git ยังมีข้อดีอีกอย่าง คือ Floorplan จะข้ามไฟล์และโฟลเดอร์ทั้งหมดที่ระบุไว้ใน .gitignore ไปโดยอัตโนมัติ

ข้อมูลและโค้ดของเราส่งไปที่ไหนบ้าง

เรื่องความปลอดภัยของโค้ด ต้องแยกมองเป็น 2 ส่วน คือส่วนที่ Floorplan จัดการเอง กับส่วนที่ AI ทำ ส่วนของ Floorplan รันอยู่บนเครื่องของเราทั้งหมด ส่วนฝั่ง AI จะอ่านและประมวลผลโค้ดตามปกติของ Claude Code หรือ Codex ผ่านบัญชีของเราเอง

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

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

ภายในโปรเจกต์ ระบบจะเขียนไฟล์ลงเฉพาะในโฟลเดอร์ floorplan/ ของตัวเองเท่านั้น จะไม่แตะต้องซอร์สโค้ด ไม่แก้ไข .gitignore หรือ CLAUDE.md ซึ่งเป็นไฟล์คำสั่งของโปรเจกต์ และจะไม่มีไฟล์ใดๆ หลุดเข้าไปในประวัติของ Git เพราะโฟลเดอร์ดังกล่าวตั้งค่าให้ Git ละเว้นไว้อยู่แล้ว

สำหรับผู้ใช้ Claude Code จะมีจุดที่ต้องเลือกยืนยันเองหนึ่งจุด คือระบบจะขอเพิ่มข้อความสั้นๆ ลงใน CLAUDE.local.md ที่เป็นไฟล์โน้ตส่วนตัวสำหรับให้ Claude Code อ่านบริบทของโปรเจกต์ เพื่อให้การเปิดห้องแชตในครั้งถัดไปรับรู้ว่ามีแผนที่นี้อยู่ ซึ่งไฟล์นี้กำหนดให้ Git มองข้ามเฉพาะบนเครื่องเราอยู่แล้ว จึงไม่หลุดเข้าไปในประวัติของ Git แต่ถ้าเราเลือกปฏิเสธ ในโปรเจกต์ก็จะมีเพียงโฟลเดอร์ floorplan/ เหมือนกับฝั่ง Codex

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

เซิร์ฟเวอร์ของแผนที่จะปิดตัวเองอัตโนมัติเมื่อผ่านไป 2 ชั่วโมงหลังเราปิดแท็บเบราว์เซอร์แท็บสุดท้าย ถ้าอยากปิดทันที ก็พิมพ์คำสั่ง node floorplan/serve.mjs --stop ได้เลย

ข้อจำกัดที่ควรรู้ก่อนเชื่อข้อมูลบนแผนที่

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

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

ภาษาที่รองรับการทำงานได้อย่างเต็มรูปแบบ ได้แก่ TypeScript, JavaScript (ครอบคลุมทั้ง Vue, Svelte และ Astro), Python, Go, Rust, Java, Kotlin และ Scala ส่วนภาษาอื่นๆ จะรองรับในระดับพื้นฐาน สำหรับฝั่งเซิร์ฟเวอร์ ระบบตรวจจับ Endpoint ของเฟรมเวิร์กอย่าง Express, Next.js, FastAPI, Django และ Spring ได้

เปิดแผนที่ดูให้ชัดก่อนสั่ง AI ทำงานใหญ่

จังหวะที่ควรเปิดแผนที่มากที่สุด คือก่อนจะสั่งให้ AI ลงมือแก้ไขหรือพัฒนาฟีเจอร์ใหญ่

เริ่มจากการเปิดแผนที่ขึ้นมาดูโมดูลที่เกี่ยวข้อง แล้วพิมพ์ถามใน Ask the map ว่าหากเราแก้โค้ดตรงนี้ จะส่งผลกระทบต่อส่วนไหนบ้าง เมื่อเห็นภาพรวมชัดเจนแล้ว ค่อยสั่งงาน AI โดยระบุชื่อโมดูลตามที่ปรากฏอยู่บนแผนที่ แทนการใช้คำกว้างๆ เช่น "ระบบจ่ายเงิน" เมื่องานเสร็จสิ้น ให้พิมพ์ Update the floorplan. แล้วเปิดแท็บ Recent work เพื่อตรวจเช็กดูว่า AI แก้ไขไฟล์ส่วนไหนไปบ้าง ซึ่งช่วยให้ตรวจสอบความถูกต้องเทียบกับสิ่งที่เราตั้งใจไว้ได้อย่างรวดเร็ว

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

ที่มา:

• โปรเจกต์ Floorplan บน GitHub
• คลิป Floorplan Installation + Walkthrough จากช่อง haydenschmitty