Sketch:
намалюйте це, і агент зрозуміє, що ви маєте на увазі
Sketch: це полотно для малювання, вбудоване прямо в композитор AI агента. Відкрийте чисте полотно, щоб намалювати макет або діаграму, або відкрийте скріншот, щоб анотувати його. Обведіть помилку, намалюйте стрілку, виділіть область, додайте примітку. Малюнок прикріплюється до вашого повідомлення і надсилається вашому AI агенту з кодування.
Картинка варта тисячі слів, і це особливо актуально для AI агента. Замість того, щоб писати 'кнопка у верхньому правому куті модального вікна занадто близько до краю', ви обводите її. Ескіз розташовується поруч із вашим запитом, агент отримує візуальний зворотний зв'язок за один раз, і ви ніколи не залишаєте термінал.
Sketch в дії: відкрийте полотно з композитора, обведіть візуальну помилку на скріншоті, прикріпіть малюнок, надішліть його агенту.
Ось проблема, яку вирішує Sketch. Ви кодуєте з AI агентом, і щось виглядає неправильно на екрані. Карта переповнюється, кнопка розташована на кілька пікселів неправильно, розрив на одному рядку зламаний. Щоб агент виправив це, вам потрібно описати візуальну проблему словами. 'Друга карта в середньому стовпці, та, що з аватаром, її відступ занадто тісний справа.' Ви пишете три речення, агент здогадується, виправляє неправильний елемент, ви пишете ще три.
Sketch усуває здогадки. Ви робите скріншот, відкриваєте його в полотні Sketch, малюєте червоне коло навколо зламаної карти, додаєте стрілку і слова 'занадто тісно тут', і прикріплюєте це до вашого повідомлення. Агент більше не інтерпретує абзац. Він дивиться на малюнок. Візуальний зворотний зв'язок є однозначним, тому що він візуальний.
Sketch працює і в інший бік. Почніть з чистого полотна і намалюйте те, що ви хочете, перш ніж агент це побудує: грубий макет екрана, каркас макета, швидка діаграма потоку. Намальований від руки ескіз краще орієнтує агента, ніж стіна тексту. Ви малюєте прототип, агент кодує його.
Полотно Sketch відкрите з композитора: анотуйте скріншот, малюйте фігури та стрілки, потім прикріпіть малюнок до повідомлення, яке відправляється вашому агенту.
Чому Sketch належить до вашого робочого процесу агента
Точність. Коло на скріншоті вказує на один точний елемент. Речення вказує на здогадку. Коли ви малюєте проблему, агент виправляє те, що ви насправді мали на увазі, а не те, що поруч з цим. Більше ніяких 'ні, інша кнопка, та, що під нею'.
Швидкість. Намалювати прямокутник навколо області займає три секунди. Описати ту ж область словами займає три речення, і речення все ще неоднозначні. Sketch перетворює анотування візуальної помилки з рутини в рефлекс.
Вираз. Деякі ідеї: це форми, а не речення. Макет, потік, екран. З Sketch ви малюєте макет або діаграму безпосередньо, від руки або за допомогою фігур і стрілок, і передаєте малюнок агенту як специфікацію.
Потік. Sketch живе всередині композитора. Ви не відкриваєте окремий додаток для малювання, не експортуєте файл, не перетягуєте нічого. Малюнок і ваш письмовий запит подорожують разом в одному повідомленні, тому агент отримує повний контекст одразу.
Як працює Sketch, від початку до кінця
Від кнопки Sketch в композиторі до малюнка, прикріпленого до повідомлення агента.
Відкрийте Sketch з композитора
Кожен композитор агента має кнопку Sketch. Натисніть її, і відкриється полотно для малювання на весь екран, готове до використання, з активним інструментом прямокутника, щоб ви могли одразу обрамити речі.
Малюйте на чистому полотні або анотуйте зображення
Почніть з чистого полотна, щоб намалювати макет, каркас або діаграму. Або відкрийте існуюче зображення: перетягніть скріншот у композитор, потім натисніть олівець на його мініатюрі (або Анотувати в попередньому перегляді файлу), щоб малювати поверх нього.
Малюйте, обводьте, стрілка, виділяйте, вводьте текст
Полотно надає вам можливість малювати від руки, прямокутники, еліпси, стрілки, лінії та текст. Обведіть зламаний елемент, вкажіть на нього стрілкою, виділіть зону, напишіть коротку примітку поруч. Все, що робить візуальний зворотний зв'язок очевидним.
Прикріпіть малюнок до вашого повідомлення
Натисніть Прикріпити до повідомлення. Полотно експортується як PNG і додається як мініатюра до композитора, точно як файл, що був перетягнутий. Коли ви анотуєте існуюче зображення, анотована версія замінює оригінальну мініатюру, тому агент ніколи не отримує обидві.
Надішліть це агенту
Введіть ваш запит як зазвичай і надішліть. PNG прикріплюється до повідомлення через той самий канал, що й будь-який інший файл. Малюнок і ваш текст доходять до агента разом, за один раз.
Агент читає малюнок
Ваш AI агент з кодування отримує ескіз як вкладення зображення. Поки його модель підтримує введення зображень, він бачить саме те, що ви обвели, вказали стрілкою та виділили, і діє на основі візуального зворотного зв'язку замість розбору опису.
Два способи використання Sketch
Почніть з нуля або малюйте поверх того, що вже є.
Порожнє полотно: ескіз макету
Відкрийте порожнє полотно і намалюйте те, що ви хочете, щоб агент створив. Грубий макет екрана, каркас макета, прототип компонента, діаграма потоку даних. Малювання від руки, коробки, стрілки та текстові мітки. Намальований від руки ескіз є специфікацією, яку агент може виконати без написання вами жодного абзацу опису інтерфейсу.
Анотація: малюйте на скріншоті
Завантажте скріншот або будь-яке зображення на полотно і позначте його. Обведіть неправильно вирівняний елемент, намалюйте стрілку на переповнення, виділіть неправильний колір, напишіть 'виправити це' поруч з помилкою. Полотно Sketch відкривається з вашим зображенням як фоновий шар, ви малюєте поверх, і анотований скріншот відразу йде до агента як візуальний зворотний зв'язок.
Що таке Sketch насправді
Sketch - це повноцінне полотно для малювання, вбудоване в настільний додаток AgentsRoom, яке відкривається з композитора будь-якого AI агента. Це не переглядач скріншотів з маркером зверху. Ви отримуєте справжні інструменти для малювання: ручка для малювання від руки, прямокутники, еліпси, стрілки, лінії та текст, той самий набір інструментів, який ви очікуєте від справжньої поверхні для ескізів.
Полотно працює в двох режимах. Порожній режим надає вам порожню поверхню для макетів, каркасів і діаграм. Режим анотації завантажує існуюче зображення як фон і дозволяє малювати поверх нього. Ви переходите в режим анотації з мініатюри будь-якого зображення, вже прикріпленого до композитора, або з кнопки Анотація в попередньому перегляді файлу.
Коли ви прикріплюєте малюнок, Sketch експортує полотно в PNG на білому фоні, щоб кожен штрих залишався читабельним, потім поміщає файл у лоток вкладень композитора. Звідти малюнок слідує звичайним шляхом: він йде разом з вашим запитом і відправляється агенту як зображення. Sketch не додає новий механізм відправки, він підключається до вже існуючого.
Все залишається на вашій машині. Ескізи зберігаються локально на диску і не відправляються у ваш репозиторій або на будь-який сторонній сервіс. Вони є тимчасовими за задумом: малюнок є контекстом для одного повідомлення, а не файлом, який ви повинні керувати. Sketch є локальним, приватним і незалежним від постачальника: він працює з будь-яким агентом, чия модель приймає зображення, тому налаштування Claude Code і Codex отримують однаковий потік малюнок-агент.
Що люди малюють за допомогою Sketch
Три шаблони, які перетворюють малюнок на найшвидший спосіб спілкування з агентом.
Повідомте про візуальну помилку
Зробіть скріншот зламаного інтерфейсу, обведіть елемент, вкажіть стрілкою на переповнення, виділіть неправильний інтервал. Агент бачить візуальну помилку замість того, щоб розшифровувати ваш опис. Найшвидший спосіб повідомити про регресію інтерфейсу AI агенту.
Намалюйте макет або каркас
Намалюйте екран перед тим, як агент його створить. Грубий каркас, ескіз макета, низькоякісний макет компонента. Передайте малюнок агенту як завдання і дозвольте йому перетворити ваш ескіз на код.
Намалюйте діаграму або потік
Деякі пояснення є діаграмами. Потік даних, машина станів, структура сторінки, як два компоненти взаємодіють. Намалюйте це за допомогою коробок і стрілок і надішліть діаграму агенту як контекст.
Описувати словами проти малювання
Той самий візуальний зворотний зв'язок, той самий агент. Один шлях повільний і неоднозначний, інший - це ескіз.
Без Sketch
- : Ви описуєте візуальну проблему словами і сподіваєтеся, що агент уявляє те саме.
- : Ви пишете три речення, щоб вказати на один елемент, і це все ще неоднозначно.
- : Щоб намалювати макет, ви відкриваєте окремий додаток, експортуєте файл, а потім перетягуєте його в композитор.
- : Перемикання контексту порушує ваш потік і розмову з агентом.
- : Агент виправляє неправильний елемент, ви пояснюєте знову, цикл затягується.
З Sketch
- : Ви обводите елемент на скріншоті, і зворотний зв'язок є однозначним.
- : Малюнок замінює три речення опису за три секунди.
- : Полотно знаходиться в композиторі: жодних окремих додатків, жодного експорту, жодного перетягування.
- : Ви ніколи не залишаєте термінал і не перериваєте нитку з агентом.
- : Агент бачить саме те, що ви мали на увазі, і виправляє це з першого разу.
Sketch - це найкоротший шлях між візуальною проблемою та AI агентом, який її розуміє.
FAQ
Що таке Sketch в AgentsRoom?
Sketch - це полотно для малювання, вбудоване в композитор AI агентів. Ви відкриваєте його з композитора, малюєте ескіз на порожньому полотні або анотуєте існуючий скріншот, і малюнок експортується як PNG і прикріплюється до повідомлення, яке ви надсилаєте своєму AI агенту з кодування. Це перетворює візуальний зворотний зв'язок у те, що ви малюєте, замість того, щоб описувати.
Як я можу надіслати малюнок AI агенту?
Натисніть кнопку Sketch у композиторі агента, намалюйте на полотні, потім натисніть Прикріпити до повідомлення. Малюнок стає мініатюрою PNG у композиторі. Напишіть свій запит і надішліть: ескіз прикріплюється до повідомлення і доходить до агента разом з вашим текстом.
Чи можу я анотувати скріншот?
Так. Перетягніть скріншот у композитор, потім натисніть олівець на його мініатюрі або відкрийте попередній перегляд файлу і натисніть Анотувати. Полотно Sketch відкривається з вашим скріншотом як фоновий шар, щоб ви могли малювати поверх нього: обвести баг, додати стрілку, виділити область, написати примітку. Анотований скріншот замінює оригінал, коли ви його прикріплюєте.
Що я можу намалювати за допомогою Sketch?
Полотно надає можливість вільного малювання, прямокутників, еліпсів, стрілок, ліній і тексту. Ви можете намалювати макет, створити каркас, скласти діаграму або позначити скріншот колами, стрілками та виділеннями. Інструмент прямокутника активний за замовчуванням, щоб ви могли обрамити елемент в момент відкриття полотна.
Чи бачить AI агент мій ескіз?
Малюнок прикріплюється до вашого повідомлення як зображення PNG. Поки модель агента підтримує введення зображень, вона бачить ескіз і діє відповідно. Claude та моделі класу GPT-4, які живлять Claude Code та Codex, читають зображення, тому агент отримує ваш візуальний зворотний зв'язок безпосередньо.
Які агенти та провайдери працюють з Sketch?
Sketch прикріплює стандартне зображення PNG, тому він не залежить від провайдера. Будь-який агент, чия модель приймає введення зображень, працює: Claude Code, Codex та інші CLI, які підтримує AgentsRoom. Немає специфічного налаштування для провайдера.
Чи потрібен мені окремий додаток для малювання або дошка?
Ні. Це і є суть Sketch. Полотно для малювання знаходиться всередині композера. Ви не відкриваєте Excalidraw, Figma або інструмент для анотацій скріншотів в іншому вікні, ви не експортуєте файл, ви не перетягуєте його назад. Sketch зберігає весь цикл малювання та відправки в терміналі.
Де зберігаються мої ескізи? Вони приватні?
Ескізи зберігаються локально на вашій власній машині. Вони не додаються до вашого git-репозиторію і не завантажуються на жоден сторонній сервіс. Вони тимчасові: ескіз є контекстом для одного повідомлення, і старі ескізи автоматично очищаються.
Чи можу я повторно редагувати або повторно анотувати ескіз?
Так. Будь-яке зображення в композері, включаючи скріншот, який ви вже анотували, можна знову відкрити в полотні Sketch, щоб знову на ньому малювати. Коли ви додаєте нову версію, вона замінює попередню мініатюру, тому агент ніколи не отримує одне і те ж зображення двічі.
Чому малювати баг замість того, щоб описувати його?
Тому що опис: це припущення, а малюнок: ні. Коли ви пишете 'верхня права кнопка не вирівняна', агенту доводиться відтворювати екран у своїй голові. Коли ви обводите кнопку на скріншоті, немає нічого, що потрібно відтворювати. Картинка варта тисячі слів, а для візуального зворотного зв'язку AI-агенту вона також варта кількох марних ходів.
Добре поєднується з
Автоматизація браузера
Ваш QA-агент керує реальним браузером і захоплює скріншоти. Sketch: це спосіб анотувати один із цих скріншотів і відправити позначений зворотний зв'язок назад.
Чернетка
Блокнот для підказок і нотаток всередині AgentsRoom. Чернетка обробляє слова, Sketch обробляє малювання: обидва живлять один і той же композер агента.
Огляд кодування Vibe
Спостерігайте за кожним файлом, який агент змінює в режимі реального часу. Коли зміна виглядає неправильно на екрані, Sketch: це найшвидший спосіб вказати на це.
Figma для AI-агентів
Внесіть дизайн Figma в робочий процес агента. Sketch: це грубіший, швидший родич: намальований від руки макет прямо в композері, коли вам не потрібен повний файл дизайну.
Перестаньте описувати баг. Намалюйте його.
Завантажте AgentsRoom і використовуйте Sketch: полотно для малювання в композері агента, щоб створювати макети та анотувати скріншоти, а потім відправляти малюнок вашому AI-кодувальному агенту, не виходячи з терміналу.
Додаток-компаньйон: контролюйте своїх агентів на ходу
Використовуйте свого: Claude, Codex, Antigravity CLI або іншого AI-провайдера.
Надсилайте баги та запити прямо у свій публічний беклог.
Погляд на AgentsRoom в дії.