Draw it is a real-time collaborative canvas application developed using Flutter for the frontend and Node.js + Express with WebSocket for backend synchronization. The app allows multiple users to draw simultaneously on a shared board, demonstrating expertise in both cross-platform UI development and real-time network communication.
🚀 Key Objective: Enable seamless, real-time collaboration on a shared drawing board using a performant, event-driven architecture.
🧱 Tech Stack:
Flutter (Dart): Cross-platform mobile frontend with gesture handling and custom rendering
Node.js + Express.js: Backend server with WebSocket support for persistent bi-directional communication
WebSocket (ws): For real-time synchronization of strokes across users
CustomPainter: Efficient frame-by-frame drawing on canvas
Permission Handler & RepaintBoundary: Save drawings as images on device
🖌️ Core Features:
✍️ Shared Real-Time Drawing: All participants see each other's strokes instantly using WebSocket broadcast.
📡 Stateless WebSocket Server: Lightweight Node.js server maintains active socket connections and relays stroke events with low latency.
🎨 Canvas Engine: Touch gestures are converted into drawable vector paths and rendered using Flutter's CustomPainter.
📁 Export Canvas: Users can save their artwork as an image
🔧 Modular Architecture: Separate layers for drawing logic, server events, and platform integration.
Aktualisiert am
29.05.2025
Kunst & Design
Datensicherheit
arrow_forward
Was die Sicherheit angeht, solltest du als Erstes verstehen, wie Entwickler deine Daten erheben und weitergeben. Die Datenschutz- und Sicherheitspraktiken können je nach deiner Verwendung, deiner Region und deinem Alter variieren. Diese Informationen wurden vom Entwickler zur Verfügung gestellt und können jederzeit von ihm geändert werden.
Keine Daten werden mit Drittunternehmen oder -organisationen geteilt