CASE FILE // EDA / VLSI / WEB
STICKOUT.
ROLE // CREATOR & LEAD FRONTEND ENGINEERTIMELINE // MAY - JUN 2026STATUS // COMPLETE - PRODUCTION DEPTH

EXECUTIVE SUMMARY
Open-source, browser-based EDA tool for creating, editing, and validating VLSI stick diagrams: a custom 2D math viewport on raw HTML5 Canvas with infinite pan/zoom, a Photoshop-style layer stack, and automated design-rule assistants.
SYSTEM HIGHLIGHTS
- Infinite 2D viewport: screen↔world coordinate transforms, 0.1×–5× zoom, grid snapping at 60fps
- Same-layer wire crossovers auto-bridge with arc loops; right-click overrides register solid junctions
- Custom double-pass canvas renderer for LaTeX-style subscripts (V_DD, V_SS)
- 50-level undo/redo, copy/paste clipboards, auto-save, .stk JSON project files
- High-resolution export: offscreen canvas at 2× mapping the absolute layout bounding box
CORE ARCHITECTURE
- Front-end MVC: React owns the document model (elements, layers, undo/redo, selection)
- CanvasArea routes user input through viewport transforms into world coordinates
- Raw Canvas 2D render functions paint world → screen at up to 60fps
- Hotkeys: V select, W wire, P via, L label, B brush, E eraser, Ctrl+Z/Y history
TELEMETRY SNAPSHOT // GOOGLE SEARCH CONSOLE
ORGANIC SEARCH TRACTION
83 DAYS AUDITSYNCED SEP 18, 2026
- ORGANIC CLICKS
- 102
- From Google search
- IMPRESSIONS
- 399
- Google search appearances
- AVG CTR
- 25.6%
- 102 of 399 impressions
- AVG RANK
- #7
- Page 1 of Google results
SEARCH IMPRESSIONS TRAJECTORY (2026-06-18 → 2026-09-16)
2026-06-18DAILY TRAFFIC SAMPLES2026-09-16
TOP ORGANIC DISCOVERY QUERIES
| Search Keyword | Clicks | Impressions | CTR | Rank |
|---|---|---|---|---|
| 1.“stick diagram generator” | 8 | 30 | 26.7% | #9.8 |
| 2.“stick diagram maker” | 2 | 10 | 20.0% | #11 |
| 3.“engineering block diagram maker” | 0 | 1 | N/A | #27 |
| 4.“how to draw stick diagram” | 0 | 1 | N/A | #11 |
| 5.“lab stick diagram” | 0 | 3 | N/A | #9 |
| 6.“online block diagram maker” | 0 | 1 | N/A | #26 |
| 7.“site:vercel.app” | 0 | 2 | N/A | #52 |
| 8.“stick diagram vlsi” | 0 | 1 | N/A | #9 |
| 9.“stickout” | 0 | 7 | N/A | #13.4 |
| 10.“tool stickout” | 0 | 1 | N/A | #4 |
◆ DATA SOURCE // GOOGLE SEARCH CONSOLE API (SEARCHANALYTICS.QUERY) // AUTOMATICALLY INGESTED AT BUILD