How We Built a Contactless Digital Signature App inside the Browser (No Servers, 100% Private)

#webdev #ai #computervision #javascript

Traditional digital signature platforms have two major issues: privacy and cost.

To sign a document, you have to upload sensitive agreements to a third-party server. And as a developer, running server-side document rendering and signatures can lead to heavy API bills and database management overhead.

At Ananta Labs, we wanted to see if we could build a completely secure, contactless alternative that runs entirely on the client side using browser-native AI.

Here is how we built AirSign.

The Architecture: 100% Client-Side

Instead of hosting heavy machine learning models on a GPU server, we compiled our hand-tracking models to run locally inside the user's browser.

Gesture Capture: We utilized MediaPipe's hand-landmarker models compiled into WebAssembly. This allows the browser to track 21 3D hand coordinates in real-time at 30 FPS using a standard webcam.
Contactless Canvas: Using WebGL, we map the index finger coordinate to a HTML5 canvas. We implemented a custom interpolation algorithm to smooth out hand jitter and render a fluid, realistic signature line.
Local PDF Stamp: Once the user finishes drawing their signature in the air, we generate the final document. The signature coordinate vector is parsed and stamped onto the PDF using a client-side library.

Why this is the Future of AI Integration

By moving the computation from the server to the client:

Absolute Privacy: 0 video frames, coordinate points, or document bytes are transmitted to any database.
Zero Server Overhead: The hosting cost for this app is exactly $0 since it runs on the user's CPU/GPU.
Instant Load Times: Zero network latency during signature interpolation.