Skip to content

πŸ–οΈ 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