Sketch:
vẽ ra, và agent hiểu ngay ý bạn
Sketch là một khung vẽ được tích hợp thẳng vào ô soạn của AI agent. Mở một khung trắng để phác một mockup hay một sơ đồ, hoặc mở một ảnh chụp màn hình để chú thích lên đó. Khoanh tròn chỗ lỗi, vẽ một mũi tên, làm nổi vùng cần chú ý, thêm một ghi chú. Bản vẽ được đính vào tin nhắn và gửi tới AI coding agent của bạn.
Một bức tranh đáng giá ngàn lời, và điều đó càng đúng gấp đôi với một AI agent. Thay vì viết 'nút ở góc trên bên phải của modal quá sát mép', bạn khoanh tròn nó. Bản vẽ nằm ngay cạnh câu lệnh, agent nhận phản hồi trực quan trong một lần, và bạn không hề rời khỏi terminal.
Sketch trong thực tế: mở khung vẽ từ ô soạn, khoanh tròn lỗi trực quan trên một ảnh chụp màn hình, đính bản vẽ, gửi nó tới agent.
Đây là vấn đề mà Sketch giải quyết. Bạn đang vibe coding với một AI agent và có gì đó trông sai trên màn hình. Một thẻ tràn ra, một nút lệch vài pixel, khoảng cách ở một hàng bị vỡ. Để agent sửa nó, bạn phải mô tả vấn đề trực quan bằng lời. 'Thẻ thứ hai ở cột giữa, cái có avatar ấy, phần đệm của nó quá sát bên phải.' Bạn viết ba câu, agent đoán, nó sửa nhầm phần tử, bạn viết thêm ba câu nữa.
Sketch loại bỏ việc đoán mò. Bạn chụp một ảnh màn hình, mở nó trong khung vẽ Sketch, vẽ một vòng tròn đỏ quanh thẻ bị vỡ, thêm một mũi tên và dòng chữ 'quá sát chỗ này', rồi đính nó vào tin nhắn. Agent không còn phải diễn giải một đoạn văn nữa. Nó nhìn vào bản vẽ. Phản hồi trực quan không còn mơ hồ vì nó là trực quan.
Sketch cũng hoạt động theo chiều ngược lại. Bắt đầu từ một khung trắng và vẽ ra điều bạn muốn trước khi agent dựng nó: một mockup sơ bộ của một màn hình, một wireframe của một bố cục, một sơ đồ nhanh của một luồng. Một bản phác vẽ tay định hướng agent tốt hơn cả một bức tường chữ. Bạn vẽ nguyên mẫu, agent code nó.
Khung vẽ Sketch mở từ ô soạn: chú thích một ảnh chụp màn hình, vẽ các hình và mũi tên, rồi đính bản vẽ vào tin nhắn gửi tới agent của bạn.
Vì sao Sketch thuộc về quy trình làm việc với agent của bạn
Độ chính xác. Một vòng tròn trên ảnh chụp chỉ vào đúng một phần tử. Một câu chữ chỉ vào một phỏng đoán. Khi bạn vẽ vấn đề ra, agent sửa đúng thứ bạn thực sự muốn, không phải thứ nằm bên cạnh. Không còn cảnh 'không, cái nút kia, cái bên dưới ấy'.
Tốc độ. Vẽ một hình chữ nhật quanh một vùng mất ba giây. Mô tả cùng vùng đó bằng lời mất ba câu, mà những câu đó vẫn còn mơ hồ. Sketch biến việc chú thích một lỗi trực quan từ một việc vặt thành một phản xạ.
Biểu đạt. Có những ý tưởng là hình khối, không phải câu chữ. Một bố cục, một luồng, một màn hình. Với Sketch bạn vẽ thẳng mockup hay sơ đồ, bằng tay hoặc bằng hình và mũi tên, rồi trao bản vẽ cho agent làm bản đặc tả.
Mạch làm việc. Sketch sống bên trong ô soạn. Bạn không mở một ứng dụng vẽ riêng, không xuất một file, không kéo bất cứ thứ gì đi đâu. Bản vẽ và câu lệnh bằng văn bản của bạn đi cùng nhau trong cùng một tin nhắn, nên agent nhận đầy đủ ngữ cảnh một lúc.
Sketch hoạt động từ đầu đến cuối ra sao
Từ nút Sketch trong ô soạn đến một bản vẽ đính vào tin nhắn của agent.
Mở Sketch từ ô soạn
Mọi ô soạn của agent đều có một nút Sketch. Bấm vào nó và một khung vẽ toàn màn hình mở ra, sẵn sàng dùng, với công cụ hình chữ nhật đã được kích hoạt sẵn để bạn khoanh ngay được mọi thứ.
Vẽ trên khung trắng, hoặc chú thích một hình ảnh
Bắt đầu từ một khung trắng để phác một mockup, một wireframe hay một sơ đồ. Hoặc mở một hình ảnh có sẵn: thả một ảnh chụp màn hình vào ô soạn, rồi bấm vào cây bút chì trên ảnh thu nhỏ của nó (hoặc Annotate trong phần xem trước file) để vẽ lên trên nó.
Phác, khoanh tròn, mũi tên, làm nổi, gõ chữ
Khung vẽ cho bạn vẽ tay tự do, hình chữ nhật, hình elip, mũi tên, đường thẳng và chữ. Khoanh tròn một phần tử bị vỡ, chĩa một mũi tên vào nó, làm nổi một vùng, viết một ghi chú ngắn cạnh nó. Bất cứ gì khiến phản hồi trực quan trở nên rõ ràng.
Đính bản vẽ vào tin nhắn
Bấm Attach to message. Khung vẽ được xuất thành một file PNG và thêm vào ô soạn dưới dạng ảnh thu nhỏ, hệt như một file được thả vào. Khi bạn chú thích một hình ảnh có sẵn, bản đã chú thích thay thế ảnh thu nhỏ gốc, nên agent không bao giờ nhận cả hai.
Gửi nó tới agent
Gõ câu lệnh của bạn như thường lệ rồi gửi. File PNG được đính vào tin nhắn qua cùng một đường ống như mọi file khác. Bản vẽ và phần văn bản của bạn tới agent cùng nhau, trong một lượt.
Agent đọc bản vẽ
AI coding agent của bạn nhận bản phác dưới dạng một hình ảnh đính kèm. Miễn là mô hình của nó hỗ trợ đầu vào hình ảnh, nó nhìn thấy đúng những gì bạn đã khoanh tròn, chĩa mũi tên và làm nổi, rồi hành động dựa trên phản hồi trực quan thay vì phân tích một mô tả.
Hai cách dùng Sketch
Bắt đầu từ con số không, hoặc vẽ lên trên thứ đã có sẵn.
Khung trắng: phác một mockup
Mở một khung trống và vẽ ra điều bạn muốn agent dựng. Một mockup sơ bộ của một màn hình, một wireframe của một bố cục, một nguyên mẫu của một thành phần, một sơ đồ của một luồng dữ liệu. Nét vẽ tay tự do, hộp, mũi tên và nhãn chữ. Một bản phác vẽ tay là một bản đặc tả mà agent có thể theo, mà bạn không phải viết lấy một đoạn mô tả giao diện nào.
Chú thích: vẽ lên một ảnh chụp màn hình
Nạp một ảnh chụp màn hình hoặc bất kỳ hình ảnh nào vào khung vẽ và đánh dấu lên nó. Khoanh tròn phần tử lệch hàng, vẽ một mũi tên vào chỗ tràn, làm nổi màu sai, viết 'sửa cái này' cạnh chỗ lỗi. Khung vẽ Sketch mở ra với hình ảnh của bạn làm lớp nền, bạn vẽ lên trên, và ảnh chụp đã chú thích đi thẳng tới agent làm phản hồi trực quan.
Sketch thực chất là gì
Sketch là một khung vẽ đầy đủ được nhúng trong ứng dụng desktop AgentsRoom, mở từ ô soạn của bất kỳ AI agent nào. Nó không phải một trình xem ảnh chụp gắn thêm một cây bút dạ ở trên. Bạn có các công cụ vẽ thật: bút vẽ tay tự do, hình chữ nhật, hình elip, mũi tên, đường thẳng và chữ, đúng bộ công cụ bạn mong đợi từ một bề mặt phác thảo đàng hoàng.
Khung vẽ chạy ở hai chế độ. Chế độ khung trắng cho bạn một bề mặt trống để vẽ mockup, wireframe và sơ đồ. Chế độ chú thích nạp một hình ảnh có sẵn làm nền và cho bạn vẽ lên trên nó. Bạn vào được chế độ chú thích từ ảnh thu nhỏ của bất kỳ hình ảnh nào đã đính vào ô soạn, hoặc từ nút Annotate trong phần xem trước file.
Khi bạn đính bản vẽ, Sketch xuất khung vẽ ra một file PNG trên nền trắng để mọi nét vẽ vẫn dễ đọc, rồi thả file vào khay đính kèm của ô soạn. Từ đó bản vẽ đi theo đường thông thường: nó đi kèm câu lệnh của bạn và được gửi tới agent dưới dạng một hình ảnh. Sketch không thêm một cơ chế gửi mới nào, nó cắm vào cơ chế vốn đã có sẵn.
Mọi thứ ở lại trên máy của bạn. Các bản phác được lưu cục bộ trên ổ đĩa và không được commit vào repo của bạn hay đẩy lên bất kỳ dịch vụ bên thứ ba nào. Theo thiết kế, chúng chỉ là tạm thời: một bản vẽ là ngữ cảnh cho một tin nhắn, không phải một file bạn phải quản lý. Sketch là cục bộ, riêng tư, và không phụ thuộc nhà cung cấp: nó hoạt động với bất kỳ agent nào có mô hình chấp nhận một hình ảnh, nên các thiết lập Claude Code và Codex đều có cùng luồng vẽ-tới-agent.
Người ta vẽ gì với Sketch
Ba kiểu biến một bản vẽ thành cách nhanh nhất để nói chuyện với một agent.
Báo một lỗi trực quan
Chụp giao diện bị vỡ, khoanh tròn phần tử, chĩa mũi tên vào chỗ tràn, làm nổi khoảng cách sai. Agent nhìn thấy lỗi trực quan thay vì giải mã mô tả của bạn về nó. Cách nhanh nhất để báo một lỗi giao diện hồi quy cho một AI agent.
Phác một mockup hay wireframe
Vẽ màn hình trước khi agent dựng nó. Một wireframe sơ bộ, một bản phác bố cục, một mockup độ chi tiết thấp của một thành phần. Trao bản vẽ cho agent làm bản tóm tắt và để nó biến bản phác của bạn thành code.
Vẽ một sơ đồ hay luồng
Có những lời giải thích là sơ đồ. Một luồng dữ liệu, một máy trạng thái, cấu trúc của một trang, cách hai thành phần nói chuyện với nhau. Phác nó bằng hộp và mũi tên rồi gửi sơ đồ tới agent làm ngữ cảnh.
Mô tả bằng lời so với vẽ ra
Cùng một phản hồi trực quan, cùng một agent. Một lối đi chậm và mơ hồ, lối kia là một bản phác.
Không có Sketch
- : Bạn mô tả vấn đề trực quan bằng lời và hy vọng agent hình dung ra đúng thứ đó.
- : Bạn viết ba câu để chỉ vào một phần tử, mà nó vẫn còn mơ hồ.
- : Để vẽ một mockup bạn mở một ứng dụng riêng, xuất một file, rồi kéo nó vào ô soạn.
- : Việc chuyển ngữ cảnh làm đứt mạch và cắt ngang cuộc trò chuyện với agent.
- : Agent sửa nhầm phần tử, bạn giải thích lại, vòng lặp kéo dài lê thê.
Có Sketch
- : Bạn khoanh tròn phần tử trên một ảnh chụp và phản hồi không còn mơ hồ.
- : Một bản vẽ thay cho ba câu mô tả, trong ba giây.
- : Khung vẽ nằm trong ô soạn: không cần ứng dụng riêng, không xuất file, không kéo thả.
- : Bạn không bao giờ rời terminal và không bao giờ làm đứt mạch với agent.
- : Agent nhìn thấy đúng ý bạn và sửa nó ngay từ lần đầu.
Sketch là con đường ngắn nhất giữa một vấn đề trực quan và một AI agent hiểu được nó.
FAQ
Sketch trong AgentsRoom là gì?
Sketch là một khung vẽ tích hợp trong ô soạn của AI agent. Bạn mở nó từ ô soạn, vẽ một bản phác trên khung trắng hoặc chú thích một ảnh chụp màn hình có sẵn, và bản vẽ được xuất thành một file PNG rồi đính vào tin nhắn bạn gửi tới AI coding agent của mình. Nó biến phản hồi trực quan thành thứ bạn vẽ ra thay vì thứ bạn mô tả.
Làm sao để gửi một bản vẽ tới một AI agent?
Bấm nút Sketch trong ô soạn của agent, vẽ lên khung, rồi bấm Attach to message. Bản vẽ thành một ảnh thu nhỏ PNG trong ô soạn. Viết câu lệnh của bạn rồi gửi: bản phác được đính vào tin nhắn và tới agent cùng với phần văn bản của bạn.
Tôi có thể chú thích một ảnh chụp màn hình không?
Có. Thả một ảnh chụp màn hình vào ô soạn, rồi bấm vào cây bút chì trên ảnh thu nhỏ của nó, hoặc mở phần xem trước file và bấm Annotate. Khung vẽ Sketch mở ra với ảnh chụp của bạn làm lớp nền để bạn vẽ lên trên: khoanh tròn một lỗi, thêm một mũi tên, làm nổi một vùng, viết một ghi chú. Ảnh chụp đã chú thích thay thế bản gốc khi bạn đính nó.
Tôi có thể vẽ gì với Sketch?
Khung vẽ cho bạn vẽ tay tự do, hình chữ nhật, hình elip, mũi tên, đường thẳng và chữ. Bạn có thể phác một mockup, vẽ một wireframe, dựng một sơ đồ, hoặc đánh dấu một ảnh chụp màn hình bằng vòng tròn, mũi tên và phần làm nổi. Công cụ hình chữ nhật được kích hoạt mặc định để bạn có thể khoanh một phần tử ngay khoảnh khắc khung vẽ mở ra.
AI agent có thực sự nhìn thấy bản phác của tôi không?
Bản vẽ được đính vào tin nhắn của bạn dưới dạng một hình ảnh PNG. Miễn là mô hình của agent hỗ trợ đầu vào hình ảnh, nó nhìn thấy bản phác và hành động dựa trên đó. Claude và các mô hình lớp GPT-4 cấp nguồn cho Claude Code và Codex đều đọc được hình ảnh, nên agent nhận được phản hồi trực quan của bạn một cách trực tiếp.
Những agent và nhà cung cấp nào hoạt động với Sketch?
Sketch đính một hình ảnh PNG tiêu chuẩn, nên nó không phụ thuộc nhà cung cấp. Bất kỳ agent nào có mô hình chấp nhận đầu vào hình ảnh đều hoạt động: Claude Code, Codex và các CLI khác mà AgentsRoom hỗ trợ. Không có thiết lập riêng cho từng nhà cung cấp.
Tôi có cần một ứng dụng vẽ hay bảng trắng riêng không?
Không. Đó chính là điểm cốt lõi của Sketch. Khung vẽ nằm bên trong ô soạn. Bạn không mở Excalidraw, Figma hay một trình chú thích ảnh chụp ở một cửa sổ khác, bạn không xuất một file, bạn không kéo nó trở lại vào. Sketch giữ toàn bộ vòng vẽ-và-gửi trong terminal.
Các bản phác của tôi được lưu ở đâu? Chúng có riêng tư không?
Các bản phác được lưu cục bộ trên chính máy của bạn. Chúng không được commit vào repo git của bạn và không được tải lên bất kỳ dịch vụ bên thứ ba nào. Chúng chỉ là tạm thời: một bản phác là ngữ cảnh cho một tin nhắn, và các bản phác cũ được dọn dẹp tự động.
Tôi có thể chỉnh hoặc chú thích lại một bản phác không?
Có. Bất kỳ hình ảnh nào trong ô soạn, kể cả một ảnh chụp màn hình bạn đã chú thích, đều có thể mở lại trong khung vẽ Sketch để vẽ lên nó lần nữa. Khi bạn đính bản mới, nó thay thế ảnh thu nhỏ trước đó nên agent không bao giờ nhận cùng một hình ảnh hai lần.
Vì sao nên vẽ một lỗi thay vì mô tả nó?
Vì mô tả là một phỏng đoán còn một bản vẽ thì không. Khi bạn viết 'nút góc trên bên phải bị lệch', agent phải dựng lại màn hình trong đầu nó. Khi bạn khoanh tròn nút trên một ảnh chụp, không còn gì phải dựng lại. Một bức tranh đáng giá ngàn lời, và với phản hồi trực quan tới một AI agent thì nó còn đáng giá vài lượt bị lãng phí.
Kết hợp tốt với
Browser Automation
Agent QA của bạn điều khiển một trình duyệt thật và chụp ảnh màn hình. Sketch là cách bạn chú thích một trong những ảnh chụp đó và gửi phản hồi đã đánh dấu trở lại.
Scratchpad
Một sổ tay cho câu lệnh và ghi chú bên trong AgentsRoom. Scratchpad lo phần chữ, Sketch lo phần vẽ: cả hai cùng nuôi một ô soạn của agent.
Vibe Coding Review
Theo dõi mọi file mà agent thay đổi theo thời gian thực. Khi một thay đổi trông sai trên màn hình, Sketch là cách nhanh nhất để chỉ vào nó.
Figma to AI Agents
Đưa một thiết kế Figma vào quy trình làm việc với agent. Sketch là người anh em thô hơn, nhanh hơn: một mockup vẽ tay ngay trong ô soạn khi bạn không cần một file thiết kế đầy đủ.
Ngừng mô tả lỗi. Vẽ nó ra.
Tải AgentsRoom và dùng Sketch: một khung vẽ trong ô soạn của agent để phác mockup và chú thích ảnh chụp màn hình, rồi gửi bản vẽ tới AI coding agent của bạn mà không bao giờ phải rời khỏi terminal.
Ứng dụng đồng hành: theo dõi agent khi đi đường
Sử dụng Claude, Codex, Antigravity CLI hoặc nhà cung cấp AI khác.
Gửi lỗi và yêu cầu thẳng vào backlog công khai của bạn.
Một cái nhìn về AgentsRoom đang hoạt động.