A while ago, I shared a basic proof-of-concept for annotating images in Glide using WebView and AI components. It worked for light use cases but lacked structure and scalability.
Earlier post
Now, I’m introducing a full-featured image annotation app built entirely with Google Apps Script. Designed to embed seamlessly into Glide via WebView, it provides a robust system to collect, review, and annotate image (and single-page PDF) submissions—powered by Google Drive.
Key Features
Tech Stack
View components
Google Apps Script – Backend logic & automation | |
HTML5 Canvas – Native drawing layer for annotation | |
Fabric.js – Drawing & annotation canvas | |
Tailwind CSS – Responsive design | |
Google Drive – Centralized storage |
Authentication & Workflow
- Session-based authentication – Uses
userID
anduserName
, with role-based access (Admin
,Reviewer
,Uploader
). - User whitelist – Access is validated against the
"Registered Users"
sheet. - Real-time sync – Collaborators are notified when edits are saved.
- Multilanguage support – Built-in translator for UI and content.
Annotation Tools
- Freehand drawing, shapes (lines, arrows, rectangles, circles).
- Text labels, magnifier, color/size adjustments.
- Dark mode, export (download/print), and sharing.
File Management
- Supports images and single-page PDFs (auto-converted to images).
- Organized Drive folders:
- Uploads
- Annotations
- Final exports
- User photos
Admin Controls
- Toggle features via app or connected Google Sheet.
- Set deadlines with date pickers.
- Roles: Admin (full access), Reviewer (annotate/view), Uploader (own files).
Use Cases
How Glide community can leverage this tool:
- Field Surveyors: Mark issues directly on-site photos for inspections or audits
- Education: Grade image-based assignments with direct markup
- Healthcare: Discuss medical scans with precise annotation tools
- Business: Streamline design approvals from stakeholders
Preview
Submission Manager
A clean role-based submission interface with full CRUD support.
Accordion Table
Expandable accordion with integrated image preview. Currently optimizing layout flow and transition performance.
Admin Panel
Centralized control for deadlines and user permissions
Annotation Canvas
Real-time markup tools with draggable toolbar
Feature Control Panel
Toggle annotation features per project requirements
Try It Out
Embed in Glide via WebView, or open directly:
Scrawlify Live Demo
Summary
A no-host-required annotation solution for Glide, combining:
Clean UI
Role-based collaboration
Native Drive integration
Real-time sync
Still collecting feedback for WebView performance—feel free to test and share thoughts!