Sketch with Friends

Create a room, invite your friends, and start drawing!

Overview

Sketch with Friends is a multiplayer drawing game inspired by Skribbl.io and Pictionary, with quality-of-life improvements and additional gameplay features. Players take turns drawing words while others guess, earning points based on speed and accuracy.

Use your artistic skills to create a masterpiece!

Key Features

• Custom Game Rooms - Create private rooms with adjustable settings for word difficulty, round count, drawing time, and unique gameplay modes
• Global Matchmaking - Join public games with players from around the world
• Complete Drawing Toolkit - Intuitive color selection, brush sizes, bucket fill, and eraser tools
• Dynamic Scoring System - Earn points for quick guesses and creating easily recognizable drawings
• Full Mobile Responsiveness - Play seamlessly across all devices and browsers

The podium of shame (or glory)

Technical Implementation

Frontend

• React + Vite - Built with a modern React stack using Redux Toolkit for state management and React Router for navigation
• Animation-Rich UI - Used Motion to create engaging spatial animations that represent game progress
• Canvas API - Custom drawing implementation with color selection, brush sizes, and fill tools optimized for mobile and desktop interfaces

Backend

• Go Concurrency Model - Leveraged goroutines and channels to handle multiple game rooms and players simultaneously with minimal resource overhead
• Context-Based Cancellation - Implemented hierarchical context propagation to ensure clean shutdown of player connections when rooms close
• Command/Event Architecture - Designed a bidirectional event system that mirrors frontend Redux actions for consistent state management
• Phase Isolation - Implemented game state machines where each phase (lobby, drawing, guessing, results) operates with encapsulated state access