П.ВИН
Tool

Draw — Tool из портфолио Паши Вина

Бесконечная доска для команды с AI-ассистентом, который понимает голосом и текстом — рисует фигуры, стикеры, стрелки и фреймы прямо на холсте. Закрытый whiteboard под одним паролем с автосохранением, историей версий и шарингом.

01. КатегорияTool
02. РольFull-stack, Product
03. Датаапр 2026

Что это?

Бесконечная доска для команды с AI-ассистентом, который понимает голосом и текстом — рисует фигуры, стикеры, стрелки и фреймы прямо на холсте. Закрытый whiteboard под одним паролем с автосохранением, историей версий и шарингом.

Какую задачу решает?

Было: брейншторм в Miro + ручное рисование схем. Стало: AI сам строит диаграммы по описанию, команда работает на одном холсте без лицензий.

Как реализовано?

Реализовано на стеке: Next.js, React, tldraw, Supabase. tldraw как движок canvas + LLM с tool-calling, который создаёт элементы напрямую через editor API.

Next.jsReacttldrawSupabaseTypeScriptTailwindNext.jsReacttldrawSupabaseTypeScriptTailwindNext.jsReacttldrawSupabaseTypeScriptTailwindNext.jsReacttldrawSupabaseTypeScriptTailwind
Командный брейншторм застревает на ручном рисовании — пока соберёшь схему, мысль уже ушла. Цель — холст, где AI понимает описание и сам ставит фигуры, стрелки и фреймы, а команда работает над одним состоянием без подписок и потерь.

Вызов

Доски без AI

Существующие whiteboard-сервисы не понимают намерение — пользователь сам двигает каждую фигуру и рисует каждую стрелку.

  • — Miro/FigJam стоят денег за каждое место в команде
  • — Чтобы набросать схему — нужно вручную ставить десятки фигур
  • — Версионности и истории по сути нет — потерял состояние, начинай заново

Решение

Холст с агентом

tldraw как движок canvas + LLM с tool-calling, который создаёт элементы напрямую через editor API.

  • + AI-агент с 4 раундами tool-calls: create_shape, create_arrow, create_frame, create_sticky_note
  • + Автосохранение snapshot в Supabase с debounce 1.5 сек — состояние не теряется
  • + Single-password доступ через HMAC cookie + share-ссылки на view/edit

Архитектура & Стек

Mindmap

[ Mindmap Процессов / v2.0 ]
NODE.01

Canvas

Бесконечный холст
tldraw 3.x · React 19 · TypeScript

NODE.02

AI-агент

Tool-calling на холст
LLM Router · OpenAI SDK · Zod

NODE.03

Snapshots

Состояние и история
Supabase · jsonb · cron

NODE.04

Доступ

Пароль и шаринг
HMAC · Web Crypto · share-tokens

COREEngine

Смоделировано 100 предпринимателями

Бизнес Импакт

0

лицензий за место

10x

быстрее наброски схем

1.5с

автосохранение холста

Открыть проект
Следующий кейс

Likedog →