farooq.dev
Back to projects

Project 01

Productivity / Vector Graphics & Diagramming

ExcelDraw

A high-performance infinite canvas web drawing and sketching application built with React, TypeScript, Konva.js, Firebase, and Google Drive integration. Features real-time vector shapes, freehand drawing, sticky notes, text, cloud sync, and multi-format exports.

ReactTypeScriptKonva.jsReact-KonvaFirebaseGoogle Drive APITailwind CSSVite
ExcelDraw

My Role

Lead Architect & Engineer – Designed and developed the interactive Konva canvas engine, state management pipeline, property inspector, Google Drive/Firebase integrations, and responsive UI components.

Key Features

  • Infinite canvas workspace with smooth zoom and pan controls
  • Rich vector shape tools (rectangles, circles, diamonds, triangles, stars, arrows, freehand pencil, sticky notes, text)
  • Real-time property inspector for stroke color, fill, stroke width, opacity, and text properties
  • Full Undo / Redo history state management
  • Firebase Authentication and Cloud Firestore drawing synchronization
  • Google Drive API integration for cloud storage and direct file export/sync
  • Multi-format export engine supporting PNG, SVG, and JSON drawing files
  • Clean Excalidraw-inspired glassmorphism UI with responsive toolbar and properties palette

Category

Productivity / Vector Graphics & Diagramming