เริ่มต้นใช้งาน Google Antigravity

1. บทนำ

ในโค้ดแล็บนี้ คุณจะได้เรียนรู้เกี่ยวกับ Google Antigravity (ต่อไปนี้จะเรียกว่า Antigravity ในเอกสารนี้) ซึ่งเป็นแพลตฟอร์มการพัฒนาด้าน Agentic AI ที่พัฒนา IDE ไปสู่ยุคที่เน้น Agent เป็นอันดับแรก

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

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

สิ่งที่คุณจะได้เรียนรู้

  • การติดตั้งและกำหนดค่า Antigravity
  • สำรวจแนวคิดหลักของ Antigravity เช่น Agent Manager, Editor, Browser และอื่นๆ
  • การปรับแต่ง Antigravity ด้วยกฎและเวิร์กโฟลว์ของคุณเอง รวมถึงข้อควรพิจารณาด้านความปลอดภัย

สิ่งที่คุณต้องมี

ปัจจุบัน Antigravity พร้อมให้บริการในเวอร์ชันตัวอย่างสำหรับบัญชี Gmail ส่วนตัว โดยจะมีโควต้าฟรีสำหรับใช้โมเดลชั้นนำ

คุณต้องติดตั้ง Antigravity ในระบบของคุณ ผลิตภัณฑ์นี้พร้อมให้บริการใน Mac, Windows และ Linux บางรุ่น นอกจากเครื่องของคุณเองแล้ว คุณจะต้องมีสิ่งต่อไปนี้ด้วย

  • เว็บเบราว์เซอร์ Chrome
  • บัญชี Gmail (บัญชี Gmail ส่วนตัว)

Codelab นี้ออกแบบมาสำหรับผู้ใช้และนักพัฒนาซอฟต์แวร์ทุกระดับ (รวมถึงผู้เริ่มต้น)

การรายงานปัญหา

คุณอาจพบปัญหาขณะทำ Codelab และใช้ Antigravity

หากพบปัญหาที่เกี่ยวข้องกับ Codelab (การสะกดผิด คำสั่งที่ไม่ถูกต้อง) โปรดเปิดข้อบกพร่องโดยใช้ปุ่ม Report a mistake ที่มุมล่างซ้ายของ Codelab นี้

b06b582bcd847f6d.png

หากพบข้อบกพร่องหรือต้องการขอฟีเจอร์ที่เกี่ยวข้องกับ Antigravity โปรดรายงานปัญหาภายใน Antigravity คุณทำได้ใน Agent Manager โดยใช้ลิงก์ Provide Feedback ที่มุมซ้ายล่าง

281ac826fb44d427.png

นอกจากนี้ คุณยังไปที่เครื่องมือแก้ไขได้โดยใช้Report Issueลิงก์ใต้ไอคอนโปรไฟล์

e8afd782a8f92129.png

2. การติดตั้ง

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

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

29fada39721093c.png

โปรดคลิก Next ทุกครั้ง ขั้นตอนสำคัญมีดังนี้

  • เลือกขั้นตอนการตั้งค่า: ตัวเลือกนี้จะแสดงตัวเลือกให้คุณนำเข้าจากการตั้งค่า VS Code หรือ Cursor ที่มีอยู่ เราจะเริ่มต้นใหม่
  • เลือกประเภทธีมของเอดิเตอร์: เราจะใช้ธีมมืด แต่คุณเลือกได้ตามต้องการ
  • คุณต้องการใช้สารป้องกันแรงโน้มถ่วงอย่างไร

7ca55560ec377130.png

มาทำความเข้าใจเรื่องนี้อย่างละเอียดมากขึ้นกัน โปรดทราบว่าคุณเปลี่ยนการตั้งค่าได้ทุกเมื่อผ่านการตั้งค่าผู้ใช้ Antigravity (Cmd + ,)

ก่อนที่จะเจาะลึกตัวเลือกต่างๆ มาดูพร็อพเพอร์ตี้บางอย่าง (ซึ่งคุณเห็นทางด้านขวาของกล่องโต้ตอบ) กันก่อน

นโยบายการดำเนินการที่เทอร์มินัล

ซึ่งเป็นการให้สิทธิ์ Agent ในการเรียกใช้คำสั่ง (แอปพลิเคชัน/เครื่องมือ) ในเทอร์มินัลของคุณ

  • ดำเนินการเสมอ: เรียกใช้คำสั่งเทอร์มินัลโดยอัตโนมัติเสมอ (ยกเว้นคำสั่งในรายการปฏิเสธที่กำหนดค่าได้)
  • ขอรับการตรวจสอบ: ขอรับการตรวจสอบและการอนุมัติจากผู้ใช้ก่อนที่จะเรียกใช้คำสั่งในเทอร์มินัล

นโยบายการรีวิว

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

  • ดำเนินการต่อเสมอ: Agent จะไม่ขอรับการตรวจสอบ
  • Agent Decides: Agent จะเป็นผู้กำหนดเวลาที่ควรขอรับการตรวจสอบ
  • ขอรับการตรวจสอบ: Agent จะขอรับการตรวจสอบเสมอ

นโยบายการดำเนินการ JavaScript

เมื่อเปิดใช้แล้ว ตัวแทนจะใช้เครื่องมือเบราว์เซอร์เพื่อเปิด URL อ่านหน้าเว็บ และโต้ตอบกับเนื้อหาเบราว์เซอร์ได้ นโยบายนี้ควบคุมวิธีเรียกใช้ JavaScript ในเบราว์เซอร์

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

ตอนนี้เราได้ทำความเข้าใจนโยบายต่างๆ แล้ว ตัวเลือก 4 รายการทางด้านซ้ายก็คือการตั้งค่าเฉพาะสำหรับนโยบายการดำเนินการ การตรวจสอบ และการดำเนินการ JavaScript ของเทอร์มินัลสำหรับ 3 รายการ และตัวเลือกที่ 4 ที่เราสามารถควบคุมแบบกำหนดเองได้อย่างสมบูรณ์ เรามีตัวเลือก 4 อย่างนี้เพื่อให้คุณเลือกได้ว่าจะให้อำนาจเอเจนต์มากน้อยเพียงใดในการรันคำสั่งในเทอร์มินัลและรับการตรวจสอบอาร์ติแฟกต์ก่อนที่จะดำเนินการต่อกับงาน

โดยมี 4 ตัวเลือกดังนี้

  • โหมดปลอดภัย: โหมดปลอดภัยมีการควบคุมความปลอดภัยที่ดียิ่งขึ้นสำหรับ Agent ซึ่งช่วยให้คุณจำกัดการเข้าถึงทรัพยากรภายนอกและการดำเนินการที่ละเอียดอ่อนได้ เมื่อเปิดใช้โหมดปลอดภัย ระบบจะบังคับใช้มาตรการรักษาความปลอดภัยหลายอย่างเพื่อปกป้องสภาพแวดล้อมของคุณ
  • การพัฒนาที่ขับเคลื่อนด้วยการตรวจสอบ (แนะนํา): Agent จะขอรับการตรวจสอบบ่อยครั้ง
  • การพัฒนาที่ขับเคลื่อนด้วย Agent: Agent จะไม่ขอรับการตรวจสอบ
  • การกำหนดค่าที่กำหนดเอง

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

ถัดไปคือหน้าการตั้งค่ากำหนดค่าเอดิเตอร์ ซึ่งคุณสามารถเลือกค่ากำหนดสำหรับรายการต่อไปนี้ได้

  • การเชื่อมโยงคีย์: กำหนดค่าการเชื่อมโยงคีย์
  • ส่วนขยาย: ติดตั้งส่วนขยายภาษาและส่วนขยายอื่นๆ ที่แนะนำซึ่งเป็นที่นิยม
  • บรรทัดคำสั่ง: ติดตั้งเครื่องมือบรรทัดคำสั่งเพื่อเปิด Antigravity ด้วย agy

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

สุดท้ายคือข้อกำหนดในการใช้งาน คุณสามารถตัดสินใจได้ว่าจะเลือกใช้หรือไม่ แล้วคลิก Next

ซึ่งจะนำคุณไปสู่ช่วงเวลาสำคัญที่ Antigravity รอคอลแลบกับคุณอยู่

3. ผู้จัดการตัวแทน

เราพร้อมที่จะเริ่มต้นแล้ว

Antigravity แยกจากพื้นฐานของ Visual Studio Code (VS Code) แบบโอเพนซอร์ส แต่เปลี่ยนประสบการณ์ของผู้ใช้อย่างสิ้นเชิงเพื่อจัดลำดับความสำคัญของการจัดการเอเจนต์มากกว่าการแก้ไขข้อความ อินเทอร์เฟซจะแยกออกเป็น 2 หน้าต่างหลักที่แตกต่างกัน ได้แก่ Editor และ Agent Manager การแยกความกังวลนี้สะท้อนถึงความแตกต่างระหว่างการมีส่วนร่วมของแต่ละบุคคลและการจัดการด้านวิศวกรรม

Agent Manager: Mission Control

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

d5ae91fc746e1bba.png

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

ในมุมมองนี้ นักพัฒนาแอปจะทำหน้าที่เป็นสถาปนิก โดยจะกำหนดวัตถุประสงค์ระดับสูง ตัวอย่างเช่น

  • ปรับโครงสร้างโมดูลการตรวจสอบสิทธิ์
  • อัปเดตแผนผังทรัพยากร Dependency
  • สร้างชุดทดสอบสำหรับ Billing API

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

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

หากคลิก Next ด้านบน คุณจะมีตัวเลือกในการเปิดพื้นที่ทำงาน

ec72712ea24bf6d5.png

คิดว่า Workspace เหมือนกับที่คุณเคยใช้ใน VS Code แล้วคุณก็จะพร้อมใช้งาน เราจึงเปิดโฟลเดอร์ในเครื่องได้โดยคลิกปุ่ม แล้วเลือกโฟลเดอร์ที่จะเริ่มต้น ในกรณีของฉัน ฉันมีโฟลเดอร์ในโฟลเดอร์บ้านชื่อ my-agy-projects และฉันเลือกโฟลเดอร์นั้น คุณสามารถใช้โฟลเดอร์อื่นได้ โปรดทราบว่าคุณสามารถข้ามขั้นตอนนี้ไปได้เลยหากต้องการ และคุณยังเปิดพื้นที่ทำงานได้ทุกเมื่อในภายหลังด้วย

เมื่อทำขั้นตอนนี้เสร็จแล้ว คุณจะอยู่ในหน้าต่าง Agent Manager ซึ่งแสดงอยู่ด้านล่าง

156224e223eeda36.png

คุณจะเห็นว่าแอปพลิเคชันพร้อมที่จะเริ่มการสนทนาใหม่ในโฟลเดอร์พื้นที่ทำงาน (my-agy-projects) ที่เลือกทันที คุณสามารถใช้ความรู้ที่มีอยู่เกี่ยวกับการทำงานกับแอปพลิเคชัน AI อื่นๆ (Cursor, Gemini CLI) และใช้ @ รวมถึงวิธีอื่นๆ เพื่อรวมบริบทเพิ่มเติมขณะพรอมต์

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

fb0744dc43911365.png

ในทำนองเดียวกัน เราพบว่าเอเจนต์จะอยู่ในโหมด Planning เริ่มต้น แต่เราก็เลือกใช้โหมด Fast ได้เช่นกัน

f403e40ad480efc9.png

มาดูกันว่าเอกสารกล่าวถึงเรื่องนี้ว่าอย่างไร

  • Planning: เอเจนต์สามารถวางแผนก่อนที่จะดำเนินการ ใช้สำหรับการค้นคว้าหาข้อมูลเชิงลึก งานที่ซับซ้อน หรือการทำงานร่วมกัน ในโหมดนี้ Agent จะจัดระเบียบงานเป็นกลุ่มงาน สร้างอาร์ติแฟกต์ และทำตามขั้นตอนอื่นๆ เพื่อค้นคว้าอย่างละเอียด คิดทบทวน และวางแผนงานเพื่อให้ได้คุณภาพสูงสุด คุณจะเห็นเอาต์พุตที่นี่มากขึ้น
  • Fast: Agent จะทำงานโดยตรง ใช้สำหรับงานง่ายๆ ที่ทำได้เร็วขึ้น เช่น การเปลี่ยนชื่อตัวแปร การเริ่มคำสั่ง Bash 2-3 รายการ หรือการทำงานอื่นๆ ที่มีขนาดเล็กกว่าและเฉพาะเจาะจง ซึ่งจะเป็นประโยชน์ในกรณีที่ความเร็วเป็นปัจจัยสำคัญ และงานนั้นง่ายพอที่จะไม่ต้องกังวลเรื่องคุณภาพที่แย่ลง

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

ตอนนี้เรามาใช้เวลาสักครู่กับ Agent Manager (หน้าต่าง) ที่นี่และทำความเข้าใจสิ่งต่างๆ เพื่อให้เห็นภาพที่ชัดเจนเกี่ยวกับองค์ประกอบพื้นฐาน วิธีไปยังส่วนต่างๆ ใน Antigravity และอื่นๆ หน้าต่าง Agent Manager จะปรากฏขึ้นดังนี้

22f6dcf7b3edc583.png

โปรดดูแผนภาพด้านบนพร้อมหมายเลข

  1. Inbox: คิดว่านี่เป็นวิธีติดตามการสนทนาทั้งหมดในที่เดียว เมื่อคุณส่งเอเจนต์ไปทำงานแล้ว งานเหล่านั้นจะปรากฏในกล่องจดหมาย และคุณสามารถคลิกกล่องจดหมายเพื่อดูรายการการสนทนาทั้งหมดที่กำลังดำเนินการอยู่ การแตะการสนทนาใดๆ จะนำคุณไปยังข้อความทั้งหมดที่มีการแลกเปลี่ยน สถานะของงาน สิ่งที่ตัวแทนสร้างขึ้น หรือแม้กระทั่งหากระบบกำลังรอการอนุมัติจากคุณในงาน ซึ่งเป็นวิธีที่ยอดเยี่ยมในการกลับมาทำงานที่ทำค้างไว้ในภายหลัง ฟีเจอร์ที่มีประโยชน์มาก
  2. Start Conversation: คลิกที่นี่เพื่อเริ่มการสนทนาใหม่ ซึ่งจะนำคุณไปยังอินพุตที่มีข้อความ Ask anything โดยตรง
  3. Workspaces: เราได้พูดถึงพื้นที่ทำงานและคุณสามารถทำงานในพื้นที่ทำงานใดก็ได้ที่ต้องการ คุณเพิ่มพื้นที่ทำงานได้ทุกเมื่อและเลือกพื้นที่ทำงานใดก็ได้ขณะเริ่มการสนทนา
  4. Playground: วิธีนี้เป็นวิธีที่ยอดเยี่ยมในการเริ่มการสนทนากับตัวแทนอย่างง่ายดาย จากนั้นหากต้องการเปลี่ยนการสนทนานั้นเป็นพื้นที่ทำงานที่คุณควบคุมไฟล์ได้เข้มงวดมากขึ้น ฯลฯ ให้คิดว่านี่เป็นพื้นที่ทดลอง
  5. Editor View: ตอนนี้เราอยู่ในมุมมองผู้จัดการตัวแทน คุณเปลี่ยนเป็นมุมมองเอดิเตอร์ได้ทุกเมื่อหากต้องการ ซึ่งจะแสดงโฟลเดอร์พื้นที่ทำงานและไฟล์ที่สร้างขึ้น คุณสามารถแก้ไขไฟล์ได้โดยตรง หรือแม้แต่ให้คำแนะนำแบบอินไลน์ คำสั่งในเครื่องมือแก้ไข เพื่อให้ตัวแทนดำเนินการหรือเปลี่ยนแปลงตามคำแนะนำ/วิธีการที่แก้ไขแล้วของคุณ เราจะกล่าวถึงมุมมองเอดิเตอร์อย่างละเอียดในส่วนถัดไป
  6. Browser: สุดท้ายนี้ เรามาถึงหนึ่งในความแตกต่างที่ชัดเจนซึ่งทำให้ Antigravity มีประสิทธิภาพมาก นั่นคือการผสานรวมอย่างใกล้ชิดกับเบราว์เซอร์ Chrome มาเริ่มตั้งค่าเบราว์เซอร์ในส่วนถัดไปกันเลย

4. Antigravity Browser

ตามเอกสารประกอบ เมื่อเอเจนต์ต้องการโต้ตอบกับเบราว์เซอร์ เอเจนต์จะเรียกใช้เอเจนต์ย่อยของเบราว์เซอร์เพื่อจัดการงานที่กำลังทำอยู่ Subagent ของเบราว์เซอร์จะเรียกใช้โมเดลที่เชี่ยวชาญในการทำงานในหน้าที่เปิดภายในเบราว์เซอร์ที่ Antigravity จัดการ ซึ่งแตกต่างจากโมเดลที่คุณเลือกสำหรับ Agent หลัก

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

ซึ่งหมายความว่าเราต้องเปิดตัวและติดตั้งส่วนขยายเบราว์เซอร์ Antigravity มาเริ่มกันเลยด้วยการเริ่มการสนทนาใน Playground และทำตามขั้นตอน

เลือก Playground แล้วมอบหมายงาน go to antigravity.google ต่อไปนี้ให้ Agent ตามที่แสดงด้านล่าง

51a373d3da23db56.png

ส่งงาน คุณจะเห็นเอเจนต์วิเคราะห์งานและตรวจสอบกระบวนการคิดได้ ในที่สุดแล้ว ระบบจะดำเนินการอย่างถูกต้องและแจ้งว่าต้องตั้งค่าเอเจนต์เบราว์เซอร์ตามที่แสดงด้านล่าง คลิก Setup

e7119f40e093afd2.png

ซึ่งจะเปิดเบราว์เซอร์และแสดงข้อความให้ติดตั้งส่วนขยายดังที่แสดงด้านล่าง

82fb87d7d75b4a6c.png

จากนั้นระบบจะนำคุณไปยังส่วนขยาย Chrome ที่คุณติดตั้งได้

f3468f0e5f3bb075.png

เมื่อติดตั้งส่วนขยายเรียบร้อยแล้ว Antigravity Agent จะเริ่มทำงานและระบุว่าคุณต้องอนุญาตสิทธิ์ให้ทำภารกิจ คุณควรเห็นกิจกรรมบางอย่างในหน้าต่างเบราว์เซอร์ที่เปิดอยู่

7f0367e00ac36d5a.png

เปลี่ยนกลับไปที่มุมมอง Agent Manager แล้วคุณควรเห็นสิ่งต่อไปนี้

b9d89e1ebefcfd76.png

ซึ่งเป็นสิ่งที่เราคาดหวังว่าจะเกิดขึ้นเนื่องจากเราขอให้ Agent ไปที่เว็บไซต์ antigravity.google ให้สิทธิ์ดังกล่าว แล้วคุณจะเห็นว่าระบบนำทางไปยังเว็บไซต์อย่างปลอดภัย ดังที่แสดงด้านล่าง

77fcc38b5fb4ca7c.png

5. อาร์ติแฟกต์

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

อาร์ติแฟกต์ช่วยแก้ปัญหา"ช่องว่างด้านความน่าเชื่อถือ" เมื่อตัวแทนกล่าวว่า "ฉันแก้ไขข้อบกพร่องแล้ว" ก่อนหน้านี้นักพัฒนาแอปต้องอ่านโค้ดเพื่อยืนยัน ใน Antigravity เอเจนต์จะสร้างอาร์ติแฟกต์เพื่อพิสูจน์

อาร์ติแฟกต์หลักที่ Antigravity สร้างขึ้นมีดังนี้

  • Task Lists: ก่อนเขียนโค้ด Agent จะสร้างแผนที่มีโครงสร้าง โดยปกติแล้ว คุณไม่จำเป็นต้องแก้ไขแผนนี้ แต่สามารถตรวจสอบและในบางกรณีก็เพิ่มความคิดเห็นเพื่อเปลี่ยนแปลงได้หากจำเป็น
  • Implementation Plan: ใช้เพื่อออกแบบการเปลี่ยนแปลงภายในโค้ดเบสเพื่อทำงานให้สำเร็จ แผนเหล่านี้มีรายละเอียดทางเทคนิคเกี่ยวกับสิ่งที่ต้องแก้ไข และมีไว้เพื่อให้ผู้ใช้ตรวจสอบ เว้นแต่คุณจะตั้งค่านโยบายการตรวจสอบอาร์ติแฟกต์เป็น "ดำเนินการต่อเสมอ"
  • Walkthrough: เอกสารนี้จะสร้างขึ้นเมื่อตัวแทนดำเนินการตามงานเสร็จสมบูรณ์แล้ว โดยเป็นข้อมูลสรุปการเปลี่ยนแปลงและวิธีทดสอบ
  • Code diffs: แม้ว่าจะไม่ใช่สิ่งประดิษฐ์ในทางเทคนิค แต่ Antigravity ยังสร้างความแตกต่างของโค้ดที่คุณสามารถตรวจสอบและแสดงความคิดเห็นได้
  • Screenshots: ตัวแทนจะบันทึกสถานะของ UI ก่อนและหลังการเปลี่ยนแปลง
  • Browser Recordings: สำหรับการโต้ตอบแบบไดนามิก (เช่น "คลิกปุ่มเข้าสู่ระบบ รอวงกลมหมุน ยืนยันว่าแดชบอร์ดโหลดแล้ว") เอเจนต์จะบันทึกวิดีโอเซสชันของตัวเอง นักพัฒนาแอปสามารถดูวิดีโอนี้เพื่อยืนยันว่าข้อกำหนดด้านฟังก์ชันการทำงานเป็นไปตามที่กำหนดโดยไม่ต้องเรียกใช้แอปด้วยตนเอง

ระบบจะสร้างอาร์ติแฟกต์และแสดงในทั้งมุมมองผู้จัดการเอเจนต์และมุมมองเอดิเตอร์

ในมุมมองเครื่องมือแก้ไข คุณสามารถคลิก Artifacts ที่มุมขวาล่างเพื่อทำสิ่งต่อไปนี้

5deff47fe0a93aa1.png

ในมุมมองตัวจัดการเอเจนต์ คุณควรเห็นปุ่มสลับอาร์ติแฟกต์ที่ด้านขวาบนข้าง Review changes หรือหากเปิดอยู่ คุณจะเห็นรายการอาร์ติแฟกต์ที่สร้างขึ้น

5320f447471c43eb.png

คุณควรเห็นมุมมองอาร์ติแฟกต์ดังที่แสดงด้านล่าง ในกรณีนี้ เราได้สั่งให้ตัวแทนไปที่หน้า antigravity.google จึงได้มีการจับภาพหน้าจอและสร้างวิดีโอของหน้าดังกล่าว

19d9738bb3c7c0c9.png

คุณดูความแตกต่างของโค้ดได้ใน Review Changes ในมุมมองเครื่องมือแก้ไข

e1d8fd6e7df4daf3.png

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

6. กลับไปที่กล่องจดหมาย

หากคุณเริ่มการสนทนากับตัวแทนไปแล้ว 2-3 ราย ตอนนี้คุณควรดูInboxในหน้าต่างAgent Manager ซึ่งจะแสดงการสนทนาทั้งหมด คลิกการสนทนาใดก็ได้เพื่อดูประวัติการสนทนานั้น อาร์ติแฟกต์ที่สร้างขึ้น และอื่นๆ ในกรณีของเรา หลังจากที่เราสนทนาครั้งแรก กล่องจดหมายจะแสดงการสนทนาตามที่แสดงด้านล่าง

1a2a1bbdd4464ecf.png

การคลิกการสนทนาดังกล่าวจะแสดงรายละเอียดต่อไปนี้

b7e493765cfb1b1a.png

คุณสามารถสนทนาต่อจากตรงนี้ได้ด้วย

7. ผู้แก้ไข

ตัวแก้ไขยังคงความคุ้นเคยของ VS Code ไว้ เพื่อให้มั่นใจว่านักพัฒนาแอปที่มีประสบการณ์จะยังคงใช้เครื่องมือนี้ได้อย่างถนัดมือ ซึ่งรวมถึง File Explorer มาตรฐาน การไฮไลต์ไวยากรณ์ และระบบนิเวศของส่วนขยาย

คุณคลิกปุ่ม Open Editor ที่ด้านขวาบนใน Agent Manager เพื่อไปที่ Editor ได้

การตั้งค่าและส่วนขยาย

ในการตั้งค่าทั่วไป คุณจะเห็นเอดิเตอร์ เทอร์มินัล และเอเจนต์

7996408528de93e1.png

หากไม่เป็นเช่นนั้น คุณสามารถสลับแผงเทอร์มินัลและแผงตัวแทนได้โดยทำดังนี้

  • หากต้องการเปิด/ปิดแผงเทอร์มินัล ให้ใช้แป้นพิมพ์ลัด Ctrl + `
  • หากต้องการเปิด/ปิดแผงตัวแทน ให้ใช้แป้นพิมพ์ลัด Cmd + L

นอกจากนี้ Antigravity ยังติดตั้งส่วนขยายบางอย่างได้ในระหว่างการตั้งค่า แต่คุณอาจต้องติดตั้งส่วนขยายเพิ่มเติม ทั้งนี้ขึ้นอยู่กับภาษาโปรแกรมที่คุณใช้ ตัวอย่างเช่น สำหรับการพัฒนา Python คุณอาจเลือกติดตั้งส่วนขยายต่อไปนี้

bd33a79837b5a12a.png

ผู้แก้ไข

เติมคำอัตโนมัติ

ขณะที่คุณพิมพ์โค้ดในเครื่องมือแก้ไข ระบบจะเปิดใช้การเติมข้อความอัตโนมัติอัจฉริยะที่คุณสามารถแท็บได้ง่ายๆ ดังนี้

e90825ed7a009350.png

กด Tab เพื่อนำเข้า

คุณจะได้รับคำแนะนำแท็บเพื่อนำเข้าเพื่อเพิ่มการอ้างอิงที่ขาดหายไป

bcab60794caa0aec.png

แตะเพื่อข้าม

คุณจะได้รับคำแนะนำให้กด Tab เพื่อข้ามเพื่อให้เคอร์เซอร์ไปยังตำแหน่งถัดไปในโค้ดตามตรรกะ

8610ae5217be7fe5.png

คำสั่ง

คุณสามารถทริกเกอร์คำสั่งด้วย Cmd + I ในโปรแกรมแก้ไขหรือเทอร์มินัลเพื่อการเติมข้อความแบบอินไลน์โดยใช้ภาษาที่เป็นธรรมชาติ

ในโปรแกรมแก้ไข คุณสามารถขอวิธีคำนวณตัวเลขฟีโบนัชชี แล้วยอมรับหรือปฏิเสธได้โดยทำดังนี้

13a615e515cea100.png

ในเทอร์มินัล คุณจะรับคำแนะนำคำสั่งเทอร์มินัลได้โดยทำดังนี้

5a75e560f998cedc.png

แผงด้านข้างของตัวแทน

คุณสลับแผงด้านข้างของเอเจนต์ได้หลายวิธีจากเครื่องมือแก้ไข

เปิดด้วยตนเอง

คุณสามารถสลับแผงตัวแทนทางด้านขวาด้วยตนเองโดยใช้แป้นพิมพ์ลัด Cmd + L

คุณเริ่มถามคำถามได้โดยใช้ @ เพื่อรวมบริบทเพิ่มเติม เช่น ไฟล์ ไดเรกทอรี เซิร์ฟเวอร์ MCP หรือใช้ / เพื่ออ้างอิงเวิร์กโฟลว์ (พรอมต์ที่บันทึกไว้)

95c5a6d31d771748.png

นอกจากนี้ คุณยังเลือกโหมดการสนทนาได้ 2 โหมด ได้แก่ Fast หรือ Planning ดังนี้

d3d1449f12510e3e.png

Fast เหมาะสำหรับงานที่รวดเร็ว ส่วน Planning เหมาะสำหรับงานที่ซับซ้อนกว่าซึ่งเอเจนต์จะสร้างแผนที่คุณอนุมัติได้

นอกจากนี้ คุณยังเลือกโมเดลอื่นๆ สำหรับการสนทนาได้ด้วย

af709bcc03c1e21e.png

อธิบายและแก้ไข

อีกวิธีในการเรียกใช้ตัวแทนคือการวางเมาส์เหนือปัญหาแล้วเลือก Explain and fix

e45cbe02ed76b9c1.png

ส่งปัญหาไปยังตัวแทน

นอกจากนี้ คุณยังไปที่ส่วน Problems แล้วเลือก Send all to Agent เพื่อให้ตัวแทนลองแก้ไขปัญหาเหล่านั้นได้ด้วย

e4992d14708005d0.png

ส่งเอาต์พุตของเทอร์มินัลไปยัง Agent

คุณยังเลือกส่วนหนึ่งของเอาต์พุตเทอร์มินัลและส่งไปยังเอเจนต์ด้วย Cmd + L ได้ด้วย

c40293bab474c9b1.png

การสลับระหว่างโปรแกรมแก้ไขกับตัวจัดการเอเจนต์

คุณสามารถสลับระหว่างโหมดเอดิเตอร์กับโหมดผู้จัดการเอเจนต์แบบเต็มได้ทุกเมื่อผ่านปุ่ม Open Agent Manager ที่ด้านขวาบนเมื่ออยู่ในโหมดเอดิเตอร์ และกลับมาได้โดยคลิกปุ่ม Open Editor ที่ด้านขวาบนเมื่ออยู่ในโหมดผู้จัดการเอเจนต์

หรือจะใช้แป้นพิมพ์ลัด Cmd + E เพื่อสลับระหว่าง 2 โหมดก็ได้

8. แสดงความคิดเห็น

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

  • แผนการติดตั้งใช้งานและรายการงาน (ก่อนเขียนโค้ด)
  • ส่วนต่างของโค้ด (ขณะที่สร้างโค้ด)
  • คำแนะนำแบบทีละขั้นตอนในการยืนยันผลลัพธ์ (หลังจากเขียนโค้ด)

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

มาลองสร้างแอปพลิเคชันรายการสิ่งที่ต้องทำอย่างง่ายและดูวิธีแสดงความคิดเห็นต่อ Antigravity ไปพร้อมกัน

โหมดการวางแผน

ก่อนอื่น คุณต้องตรวจสอบว่า Antigravity อยู่ในโหมด Planning (แทนที่จะเป็นโหมด Fast) โดยเลือกได้ในการแชทในแผงด้านข้างของตัวแทน ซึ่งจะช่วยให้ Antigravity สร้างแผนการติดตั้งใช้งานและรายการงานก่อนที่จะเริ่มเขียนโค้ด จากนั้นลองใช้พรอมต์ เช่น Create a todo list web app using Python ซึ่งจะช่วยให้ Agent เริ่มวางแผนและสร้างแผนการติดตั้งใช้งานได้

แผนการติดตั้งใช้งาน

แผนการติดตั้งใช้งานคือภาพรวมของสิ่งที่ Antigravity ตั้งใจจะทำ กลุ่มเทคโนโลยีที่จะใช้ และคำอธิบายระดับสูงของการเปลี่ยนแปลงที่เสนอ

Implementation Plan - Python Todo App
Goal
Create a simple, functional, and aesthetically pleasing Todo List web application using Python (Flask).

Tech Stack
Backend: Python with Flask
Frontend: HTML5, CSS3 (Vanilla), Jinja2 templates
...

นอกจากนี้ ยังเป็นที่แรกที่คุณสามารถแสดงความคิดเห็นได้ด้วย ในกรณีของเรา เอเจนต์ต้องการใช้ Flask เป็นเฟรมเวิร์กเว็บ Python เราสามารถเพิ่มความคิดเห็นในแผนการติดตั้งใช้งานเพื่อใช้ FastAPI แทนได้ เมื่อเพิ่มความคิดเห็นแล้ว ให้ส่งความคิดเห็นหรือขอให้ Antigravity Proceed พร้อมแผนการติดตั้งใช้งานที่อัปเดตแล้ว

รายการงาน

หลังจากอัปเดตแผนการติดตั้งใช้งานแล้ว Antigravity จะสร้างรายการงาน นี่คือรายการขั้นตอนที่ชัดเจนซึ่ง Antigravity จะทำตามเพื่อสร้างและยืนยันแอป

Task Plan
 Create requirements.txt
 Create directory structure (static/css, templates)
 Create static/css/style.css
 Create templates/index.html
 Create main.py with FastAPI setup and Database logic
 Verify application

นี่คือส่วนที่ 2 ที่คุณสามารถแสดงความคิดเห็นได้

ตัวอย่างเช่น ในกรณีการใช้งานของเรา คุณสามารถเพิ่มวิธีการยืนยันที่ละเอียดยิ่งขึ้นได้โดยเพิ่มความคิดเห็นต่อไปนี้ Verify application by adding, editing, and deleting a todo item and taking a screenshot.

การเปลี่ยนแปลงโค้ด

ตอนนี้ Antigravity จะสร้างโค้ดบางส่วนในไฟล์ใหม่ คุณAccept allหรือReject allการเปลี่ยนแปลงเหล่านี้ได้ในแผงด้านข้างของแชทกับตัวแทนโดยไม่ต้องดูรายละเอียด

นอกจากนี้ คุณยังคลิก Review changes เพื่อดูรายละเอียดการเปลี่ยนแปลงและแสดงความคิดเห็นโดยละเอียดเกี่ยวกับโค้ดได้ด้วย ตัวอย่างเช่น เราสามารถเพิ่มความคิดเห็นต่อไปนี้ใน main.py: Add basic comments to all methods

วิธีนี้เป็นวิธีที่ยอดเยี่ยมในการทำซ้ำโค้ดด้วย Antigravity

คำแนะนำแบบทีละขั้น

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

คุณยังแสดงความคิดเห็นในภาพหน้าจอหรือการบันทึกเบราว์เซอร์ในคำแนะนำแบบทีละขั้นตอนได้ด้วย เช่น เราสามารถเพิ่มความคิดเห็น Change the blue theme to orange theme แล้วส่ง หลังจากส่งความคิดเห็นแล้ว Antigravity จะทำการเปลี่ยนแปลง ตรวจสอบผลลัพธ์ และอัปเดตคำแนะนำแบบทีละขั้นตอน

เลิกทำการเปลี่ยนแปลง

สุดท้ายนี้ หลังจากแต่ละขั้นตอน หากไม่พอใจกับการเปลี่ยนแปลง คุณจะมีตัวเลือกในการเลิกทำการเปลี่ยนแปลงจากแชท เพียงเลือก ↩️ Undo changes up to this point ในแชท

9. กฎและเวิร์กโฟลว์

Antigravity มีตัวเลือกการปรับแต่ง 2 แบบ ได้แก่ กฎและเวิร์กโฟลว์

ขณะอยู่ในโหมดเอดิเตอร์ ให้คลิก ... ที่มุมขวาบน แล้วเลือก Customizations คุณจะเห็น Rules และ Workflows ดังนี้

ff8babd8d8bcfa83.png

กฎช่วยกำหนดลักษณะการทำงานของเอเจนต์ หลักเกณฑ์เหล่านี้เป็นหลักเกณฑ์ที่คุณระบุเพื่อให้แน่ใจว่าเอเจนต์จะทำตามขณะสร้างโค้ดและทดสอบ เช่น คุณอาจต้องการให้เอเจนต์ทำตามรูปแบบโค้ดที่เฉพาะเจาะจง หรือให้เขียนเอกสารประกอบสำหรับเมธอดเสมอ คุณสามารถเพิ่มข้อมูลเหล่านี้เป็นกฎและตัวแทนจะนำไปพิจารณา

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

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

คุณใช้ทั้งกฎและเวิร์กโฟลว์ได้ทั่วโลกหรือต่อพื้นที่ทำงาน และบันทึกไว้ในตำแหน่งต่อไปนี้

  • กฎส่วนกลาง: ~/.gemini/GEMINI.md
  • เวิร์กโฟลว์ส่วนกลาง: ~/.gemini/antigravity/global_workflows/global-workflow.md
  • กฎของพื้นที่ทำงาน: your-workspace/.agent/rules/
  • เวิร์กโฟลว์ของ Workspace: your-workspace/.agent/workflows/

มาเพิ่มกฎและเวิร์กโฟลว์ในพื้นที่ทำงานกัน

เพิ่มกฎ

ก่อนอื่น มาเพิ่มกฎรูปแบบโค้ดกัน ไปที่ Rules แล้วเลือกปุ่ม +Workspace ตั้งชื่อ เช่น code-style-guide โดยใช้กฎรูปแบบโค้ดต่อไปนี้

* Make sure all the code is styled with PEP 8 style guide
* Make sure all the code is properly commented

ประการที่สอง มาเพิ่มกฎอีกข้อเพื่อให้แน่ใจว่าโค้ดจะสร้างขึ้นในลักษณะโมดูลาร์พร้อมตัวอย่างในcode-generation-guideกฎกัน

* The main method in main.py is the entry point to showcase functionality.
* Do not generate code in the main method. Instead generate distinct functionality in a new file (eg. feature_x.py)
* Then, generate example code to show the new functionality in a new method in main.py (eg. example_feature_x) and simply call that method from the main method.

ระบบจะบันทึกกฎทั้ง 2 ข้อและพร้อมใช้งาน

bfd179dfef6b2355.png

เพิ่มเวิร์กโฟลว์

นอกจากนี้ เรายังกำหนดเวิร์กโฟลว์เพื่อสร้าง Unit Test ได้ด้วย ซึ่งจะช่วยให้เราเรียกใช้การทำ Unit Test ได้เมื่อพอใจกับโค้ดแล้ว (แทนที่จะให้เอเจนต์สร้างการทำ Unit Test ตลอดเวลา)

ไปที่ Workflows แล้วเลือกปุ่ม +Workspace ตั้งชื่อ เช่น generate-unit-tests โดยมีข้อมูลต่อไปนี้

* Generate unit tests for each file and each method
* Make sure the unit tests are named similar to files but with test_ prefix

นอกจากนี้ เวิร์กโฟลว์ก็พร้อมใช้งานแล้วเช่นกัน

d22059258592f0e1.png

ลองเลย

ตอนนี้เรามาดูกฎและเวิร์กโฟลว์ในการใช้งานจริงกัน สร้างไฟล์โครงร่าง main.py ในพื้นที่ทำงาน

def main():
    pass

if __name__ == "__main__":
    main()

ตอนนี้ ให้ไปที่หน้าต่างแชทกับตัวแทนแล้วถามตัวแทนว่า Implement binary search and bubble sort.

หลังจากผ่านไป 1-2 นาที คุณควรจะได้รับไฟล์ 3 ไฟล์ในพื้นที่ทำงาน ได้แก่ main.py, bubble_sort.py, binary_search.py นอกจากนี้ คุณจะเห็นว่ามีการใช้กฎทั้งหมด ไฟล์หลักไม่รกและมีโค้ดตัวอย่าง ฟีเจอร์แต่ละอย่างจะได้รับการติดตั้งใช้งานในไฟล์ของตัวเอง โค้ดทั้งหมดมีเอกสารประกอบและมีรูปแบบที่ดี

from binary_search import binary_search, binary_search_recursive
from bubble_sort import bubble_sort, bubble_sort_descending


def example_binary_search():
    """
    Demonstrate binary search algorithm with various test cases.
    """
    ...

def example_bubble_sort():
    """
    Demonstrate bubble sort algorithm with various test cases.
    """
    ...

def main():
    """
    Main entry point to showcase functionality.
    """
    example_binary_search()
    example_bubble_sort()
    print("\n" + "=" * 60)


if __name__ == "__main__":
    main()

ตอนนี้เราพอใจกับโค้ดแล้ว มาดูกันว่าเราจะทริกเกอร์เวิร์กโฟลว์การทดสอบหน่วยที่สร้างขึ้นได้ไหม

ไปที่แชทแล้วเริ่มพิมพ์ /generate และ Antigravity จะทราบขั้นตอนการทำงานของเราแล้ว

8a3efd9e3be7eb6f.png

เลือก generate-unit-tests แล้วกด Enter หลังจากผ่านไปสักครู่ คุณจะได้รับไฟล์ใหม่ในพื้นที่ทำงาน ได้แก่ test_binary_search.py, test_bubble_sort.py ซึ่งมีการทดสอบจำนวนหนึ่งที่ใช้งานได้แล้ว

11febd7940ef8199.png

เยี่ยมไปเลย

10. ทักษะ

แม้ว่าโมเดลพื้นฐานของ Antigravity (เช่น Gemini) จะเป็นโมเดลอเนกประสงค์ที่มีประสิทธิภาพ แต่ก็ไม่ทราบบริบทของโปรเจ็กต์หรือมาตรฐานของทีมคุณ การโหลดกฎหรือเครื่องมือทุกรายการลงในหน้าต่างบริบทของเอเจนต์จะทำให้เกิด "เครื่องมือบวม" ค่าใช้จ่ายที่สูงขึ้น เวลาในการตอบสนอง และความสับสน

Antigravity Skills แก้ปัญหานี้ผ่านการเปิดเผยข้อมูลแบบค่อยเป็นค่อยไป ทักษะคือแพ็กเกจความรู้เฉพาะทางที่ยังไม่ได้ใช้งานจนกว่าจะจำเป็น ระบบจะโหลดลงในบริบทของเอเจนต์เฉพาะเมื่อคำขอที่เฉพาะเจาะจงของคุณตรงกับคำอธิบายของทักษะ

โครงสร้างและขอบเขต

ทักษะคือแพ็กเกจที่อิงตามไดเรกทอรี คุณกำหนดได้ 2 ขอบเขตตามความต้องการ ดังนี้

  • ขอบเขตส่วนกลาง (~/.gemini/antigravity/skills/): พร้อมใช้งานในทุกโปรเจ็กต์ (เช่น "จัดรูปแบบ JSON", "การตรวจสอบโค้ดทั่วไป")
  • ขอบเขตของ Workspace (<workspace-root>/.agent/skills/): ใช้ได้เฉพาะภายในโปรเจ็กต์ที่เฉพาะเจาะจง (เช่น "Deploy to this app's staging", "Generate boilerplate for this specific framework") .

โครงสร้างของทักษะ

ไดเรกทอรีทักษะทั่วไปจะมีลักษณะดังนี้

my-skill/
├── SKILL.md    #(Required) metadata & instructions.
├── scripts/    # (Optional) Python or Bash scripts for execution.
├── references/ # (Optional) text, documentation, or templates.
└── assets/     # (Optional) Images or logos.

มาเพิ่มทักษะกันเลย

ทักษะการตรวจสอบโค้ด

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

ก่อนอื่น ให้สร้างไดเรกทอรีที่จะมีทักษะส่วนกลางนี้

mkdir -p ~/.gemini/antigravity/skills/code-review

สร้างไฟล์ SKILL.md ในไดเรกทอรีข้างต้นโดยมีเนื้อหาดังที่แสดงด้านล่าง

---
name: code-review
description: Reviews code changes for bugs, style issues, and best practices. Use when reviewing PRs or checking code quality.
---

# Code Review Skill

When reviewing code, follow these steps:

## Review checklist

1. **Correctness**: Does the code do what it's supposed to?
2. **Edge cases**: Are error conditions handled?
3. **Style**: Does it follow project conventions?
4. **Performance**: Are there obvious inefficiencies?

## How to provide feedback

- Be specific about what needs to change
- Explain why, not just what
- Suggest alternatives when possible

โปรดสังเกตว่าไฟล์ SKILL.md ด้านบนมีข้อมูลเมตา (ชื่อและคำอธิบาย) ที่ด้านบนสุด แล้วจึงมีวิธีการ เมื่อโหลดเอเจนต์ ระบบจะอ่านเฉพาะข้อมูลเมตาของทักษะที่คุณกำหนดค่าไว้ และจะโหลดวิธีการสำหรับทักษะก็ต่อเมื่อจำเป็นเท่านั้น

ลองเลย

สร้างไฟล์ชื่อ demo_bad_code.py โดยมีเนื้อหาดังที่แสดงด้านล่าง

import time

def get_user_data(users, id):
   # Find user by ID
   for u in users:
       if u['id'] == id:
            return u
   return None

def process_payments(items):
   total = 0
   for i in items:
       # Calculate tax
       tax = i['price'] * 0.1
       total = total + i['price'] + tax
       time.sleep(0.1) # Simulate slow network call
  
   return total

def run_batch():
   users = [{'id': 1, 'name': 'Alice'}, {'id': 2, 'name': 'Bob'}]
   items = [{'price': 10}, {'price': 20}, {'price': 100}]
  
   u = get_user_data(users, 3)
   print("User found: " + u['name']) # Will crash if None
  
   print("Total: " + str(process_payments(items)))

if __name__ == "__main__":
   run_batch()

ถามตัวแทน: review the @demo_bad_code.py file เอเจนต์ควรรู้จักทักษะ code-review โหลดรายละเอียด แล้วดำเนินการตามคำสั่งที่ระบุไว้ในไฟล์ code-review/SKILL.md

ตัวอย่างเอาต์พุตแสดงอยู่ด้านล่าง

d90a989f4555e2fc.png

ทักษะเทมเพลตส่วนหัวของโค้ด

บางครั้งทักษะจำเป็นต้องใช้ข้อความแบบคงที่จำนวนมาก (เช่น ส่วนหัวของใบอนุญาต) การใส่ข้อความนี้ลงในพรอมต์โดยตรงเป็นการสิ้นเปลือง แต่เราจะใส่ไว้ในโฟลเดอร์ resources/ และสั่งให้ตัวแทนอ่านเมื่อจำเป็นเท่านั้น

ก่อนอื่น ให้สร้างไดเรกทอรีที่จะมีทักษะพื้นที่ทำงานนี้

mkdir -p .agent/skills/license-header-adder/resources

สร้าง .agent/skills/license-header-adder/resources/HEADER.txt ด้วยข้อความใบอนุญาต

/*
 * Copyright (c) 2026 YOUR_COMPANY_NAME LLC.
 * All rights reserved.
 * This code is proprietary and confidential.
 */

สร้างไฟล์ .agent/skills/license-header-adder/SKILL.md ที่มีเนื้อหาตามที่แสดงด้านล่าง

---
name: license-header-adder
description: Adds the standard corporate license header to new source files.
---

# License Header Adder

This skill ensures that all new source files have the correct copyright header.

## Instructions
1. **Read the Template**: Read the content of `resources/HEADER.txt`.
2. **Apply to File**: When creating a new file, prepend this exact content.
3. **Adapt Syntax**: 
   - For C-style languages (Java, TS), keep the `/* */` block.
   - For Python/Shell, convert to `#` comments.

ลองเลย

ถามตัวแทนเกี่ยวกับข้อมูลต่อไปนี้ Create a new Python script named data_processor.py that prints 'Hello World'.

Agent จะอ่านเทมเพลต แปลงความคิดเห็นสไตล์ C เป็นสไตล์ Python และเพิ่มความคิดเห็นเหล่านั้นไว้ที่ด้านหน้าของไฟล์ใหม่โดยอัตโนมัติ

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

11. การรักษาความปลอดภัยของ Agent

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

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

เมื่อกำหนดค่า Antigravity เป็นครั้งแรกหรือผ่านเมนูการตั้งค่า คุณต้องเลือกTerminal Command Auto Executionนโยบาย การตั้งค่านี้กำหนดความเป็นอิสระของเอเจนต์เกี่ยวกับคำสั่งเชลล์

คุณดูการตั้งค่าปัจจุบันสำหรับฟีเจอร์นี้ได้โดยไปที่ Antigravity — Settings แล้วเลือก Advanced Settings คุณควรเห็นส่วน Terminal สำหรับการตั้งค่า Agent โปรดจำตารางนี้ไว้ในกรณีที่คุณต้องการเปลี่ยนการตั้งค่านี้เป็นอย่างอื่น

โหมดนโยบาย

คำอธิบาย

ปิด

เอเจนต์จะไม่เรียกใช้คำสั่งเทอร์มินัลโดยอัตโนมัติ เว้นแต่จะได้รับอนุญาตอย่างชัดเจน

อัตโนมัติ

เอเจนต์จะตัดสินใจว่าจะดำเนินการหรือไม่ตามโมเดลความปลอดภัยภายใน โดยจะขอสิทธิ์สำหรับคำสั่งที่มีความเสี่ยง

Turbo

Agent จะเรียกใช้คำสั่งโดยอัตโนมัติเสมอ เว้นแต่จะมีการปฏิเสธอย่างชัดแจ้ง

การกำหนดค่ารายการที่อนุญาต

รายการที่อนุญาตใช้กับนโยบายปิดเป็นหลัก ซึ่งแสดงถึงโมเดลความปลอดภัยเชิงบวก หมายความว่าทุกอย่างจะถูกห้ามเว้นแต่จะได้รับอนุญาตอย่างชัดแจ้ง ซึ่งเป็นการกำหนดค่าที่ปลอดภัยที่สุด

การกำหนดค่าทีละขั้นตอน

  1. ตั้งค่าการเรียกใช้คำสั่งเทอร์มินัลอัตโนมัติเป็นปิด
  2. เพิ่มคำสั่งต่อไปนี้ในคำสั่งเทอร์มินัลในรายการที่อนุญาตโดยคลิกปุ่มเพิ่มข้างคำสั่ง ls -al คุณยังเพิ่มคำสั่งเทอร์มินัลอื่นๆ ได้ด้วยหากต้องการ

การทดสอบรายการที่อนุญาต

  • ถามตัวแทน: List the files in this directory
  • Agent จะทำงานโดยอัตโนมัติls
  • ถามตัวแทน: Delete the <some file>
  • เอเจนต์จะพยายาม rm <filepath> แต่ Antigravity จะบล็อกและบังคับให้ผู้ใช้รีวิวเนื่องจาก rm ไม่อยู่ในรายการที่อนุญาต Antigravity ควรขอสิทธิ์จากคุณก่อนที่จะเรียกใช้คำสั่ง

การกำหนดค่ารายการปฏิเสธ

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

การกำหนดค่าทีละขั้นตอน

  1. ตั้งค่าการดำเนินการคำสั่งเทอร์มินัลอัตโนมัติเป็นเทอร์โบ
  2. เพิ่มคำสั่งต่อไปนี้ในคำสั่งเทอร์มินัลในรายการที่ไม่อนุญาตโดยคลิกปุ่มเพิ่มข้างคำสั่ง
  3. rm
  4. sudo
  5. curl
  6. wget

การทดสอบรายการปฏิเสธ

  • ถามตัวแทน: Check the version of python
  • Agent จะทำงานโดยอัตโนมัติpython --version
  • ถามตัวแทน: Download www.google.com home page
  • ตัวแทนพยายามcurl Antigravity จะตรวจหา curl ในรายการที่ไม่อนุญาตและบล็อกการดำเนินการ พร้อมแจ้งให้คุณอนุมัติด้วยตนเอง

การรักษาความปลอดภัยของเบราว์เซอร์

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

คุณสามารถใช้รายการที่อนุญาตของ URL ของเบราว์เซอร์สำหรับตัวแทนเบราว์เซอร์เพื่อช่วยป้องกันปัญหานี้ได้

คุณดูการตั้งค่าปัจจุบันสำหรับฟีเจอร์นี้ได้โดยไปที่ Antigravity — Settings แล้วไปที่ Advanced Settings คุณควรเห็นส่วนรายการที่อนุญาตของ URL ของเบราว์เซอร์สำหรับการตั้งค่าเบราว์เซอร์ดังที่แสดงด้านล่าง

5ed231150122ecc5.png

คลิก "เปิดไฟล์รายการที่อนุญาต" แล้วไฟล์จะเปิดขึ้นในโฟลเดอร์ HOME/.gemini/antigravity/browserAllowlist.txt. คุณตรวจสอบได้ว่ามีการป้อนเฉพาะโดเมนที่เชื่อถือได้ที่นี่

12. บทสรุปและขั้นตอนถัดไป

ยินดีด้วย ตอนนี้คุณได้ติดตั้ง Antigravity กำหนดค่าสภาพแวดล้อม และเรียนรู้วิธีควบคุมเอเจนต์เรียบร้อยแล้ว

ขั้นตอนถัดไป หากต้องการดูการทำงานของ Antigravity ในการสร้างแอปพลิเคชันในโลกแห่งความเป็นจริง คุณสามารถดู Codelab ต่อไปนี้

เอกสารอ้างอิง