Draw it — это приложение для совместной работы в режиме реального времени, разработанное с использованием Flutter для фронтенда и Node.js + Express с WebSocket для синхронизации бэкенда. Приложение позволяет нескольким пользователям одновременно рисовать на общей доске, демонстрируя опыт как в разработке кроссплатформенного пользовательского интерфейса, так и в сетевой коммуникации в режиме реального времени.
🚀 Основная цель:
Включить бесперебойную совместную работу в режиме реального времени на общей доске для рисования с использованием производительной архитектуры, управляемой событиями.
🧱 Технический стек:
Flutter (Dart): кроссплатформенный мобильный интерфейс с обработкой жестов и пользовательским рендерингом
Node.js + Express.js: внутренний сервер с поддержкой WebSocket для постоянной двунаправленной связи
WebSocket (ws): для синхронизации штрихов между пользователями в реальном времени
CustomPainter: эффективное покадровое рисование на холсте
Permission Handler & RepaintBoundary: сохранение рисунков в виде изображений на устройстве
🖌️ Основные функции:
✍️ Совместное рисование в реальном времени: все участники мгновенно видят штрихи друг друга с помощью трансляции WebSocket.
📡 Сервер WebSocket без сохранения состояния: облегченный сервер Node.js поддерживает активные соединения сокетов и передает события штрихов с низкой задержкой.
🎨 Движок Canvas: жесты касания преобразуются в векторные контуры, которые можно рисовать, и визуализируются с помощью CustomPainter Flutter.
📁 Экспорт холста: пользователи могут сохранять свои работы как изображения
🔧 Модульная архитектура: отдельные слои для логики рисования, событий сервера и интеграции платформы.
Последнее обновление
29 мая 2025 г.