ποΈ Annotation Tools Used
Visuals are key to simplifying user journeys and enhancing comprehension. I regularly use a variety of annotation tools to create clean, consistent, and informative screenshots and visuals for user guides, API docs, and help centers.
πΌοΈ Screenpresso
A powerful screen capture and annotation tool ideal for technical documentation. I use it to capture specific UI components and quickly annotate them with arrows, text, highlights, and numbered steps.
- High-resolution image support
- Quick editor with annotation presets
- Video and scrolling capture support
π§· Annotely
A modern, lightweight screenshot and annotation tool. Ideal for fast turnaround, especially for product teams working in rapid cycles.
- Clean interface with intuitive markup tools
- Drag-and-drop sharing
- Great for agile documentation workflows
π MacBook Markup Tool (Preview / Screenshot App)
For macOS users, the built-in Preview and Screenshot tools provide fast and native annotation options.
- Built-in shapes, arrows, text, and signature
- Instant markups for screenshots
- No third-party installation needed
πΈ Snagit
An industry-standard tool for technical writers. I use it to create polished visuals with consistent branding and advanced annotations.
- Multiple callout styles and templates
- Blur, magnify, step markers, and image effects
- Easily export as images, GIFs, or videos
βοΈ Lightshot
Simple and quick, Lightshot is ideal for capturing regions of the screen and instantly marking them up.
- Lightweight and easy to use
- Fast region selection and instant capture
- Quick sharing options
ποΈ Greenshot
A lightweight, open-source screenshot and annotation tool commonly used for quick documentation tasks.
- Easy region, window, and full-screen capture
- Built-in annotation tools (text, arrows, highlights)
- Quick export to multiple formats
ποΈ Markup Hero
A browser-based annotation tool designed for speed and collaboration.
- Cloud-based image storage
- Clean annotation tools with commenting support
- Shareable links for quick feedback
πΌοΈ CloudApp
A screen capture and annotation tool optimized for fast sharing and team communication.
- Screenshot and screen recording support
- Instant link-based sharing
- Simple annotation tools for quick explanations
π Figma (Annotations & Frames)
Used to annotate UI designs and user flows directly within design files.
- Precise UI callouts and annotations
- Version-controlled design references
- Ideal for UX and developer handoff documentation
π Mermaid
A text-based diagramming tool used to create diagrams directly within documentation. Ideal for documenting workflows, system architecture, and processes alongside Markdown content.
- Diagrams-as-code using simple syntax
- Easy to maintain and version-control
- Integrates well with Markdown-based docs
πΊοΈ Lucidchart
A visual diagramming tool used to create system architecture diagrams, API flows, and user journey maps. Useful for clearly communicating complex concepts to technical and non-technical audiences.
- Drag-and-drop diagram creation
- Supports collaboration and comments
- Exportable visuals for documentation use
π§© Draw.io (diagrams.net)
A browser-based diagramming tool used for creating flowcharts, architecture diagrams, and process maps. Widely used for quick visuals that integrate easily into documentation.
Free and web-based
Supports multiple diagram types
Easy export for docs and wikis
π§ Miro
A collaborative whiteboard tool used for visual brainstorming and process documentation. Helpful for capturing workflows, system flows, and early-stage concepts.
Real-time collaboration
Sticky notes, diagrams, and flow tools
Useful for workshops and discovery docs
βοΈ Excalidraw
A lightweight, sketch-style diagramming tool ideal for simple and informal visuals. Great for explaining concepts quickly without heavy design overhead.
Hand-drawn style diagrams
Easy to use and distraction-free
Good for conceptual and explainer visuals
π¨ Canva (Annotations & Visual Guides)
Useful for creating polished instructional visuals and annotated walkthroughs.
- Pre-built layouts and templates
- Easy-to-use annotation elements
- Helpful for onboarding and user-facing guides