UStackUStack
Snapmark for VS Code icon

Snapmark for VS Code

Annota screenshot in VS Code prima di incollarli nelle chat AI: sfoca dati sensibili, aggiungi passaggi numerati e comprimi automaticamente immagini grandi.

Snapmark for VS Code

Cos'è Snapmark for VS Code?

Snapmark for VS Code è un'estensione per VS Code progettata per aiutarti ad annotare screenshot prima di incollarli negli strumenti di chat AI. Il flusso di lavoro principale è focalizzato: copi uno screenshot, lo annoti nell'estensione e poi incolli l'immagine annotata in qualsiasi chat AI che accetta immagini incollate.

Secondo la descrizione dell'estensione, Snapmark mantiene intatta la finestra dell'agente lavorando tramite il tuo clipboard. Questo ti permette di sfocare regioni sensibili, aggiungere callout con passaggi numerati per flussi UI e ridimensionare screenshot grandi a una dimensione più adatta al modello prima di condividerli in chat.

Funzionalità Principali

  • Flusso di lavoro basato su clipboard: Snapmark risiede nel tuo clipboard—copia uno screenshot, poi usa la scorciatoia dell'estensione per aprire l'annotatore e preparare l'immagine per l'incolla.
  • Sfoca regioni sensibili: Supporta lo sfocamento di aree dello screenshot in modo che valori come chiavi API, token e PII siano nascosti prima che l'immagine sia incollata in una chat AI.
  • Callout con passaggi numerati: Puoi aggiungere marcatori ordinati (es. 1, 2, 3) per descrivere un flusso UI in sequenza, riducendo il vai e vieni quando si spiegano schermi multi-passo.
  • Compressione automatica alla copia: Gli screenshot Retina vengono ridimensionati sul lato lungo a 1920px quando copiati, per impedire ai modelli di visione di elaborare pixel inutili.
  • Incolla in “qualsiasi cosa che accetta immagini incollate”: L'estensione è presentata come tool-agnostica—utilizzabile con chat AI che accettano immagini incollate (elenca esempi come Claude Code, GitHub Copilot Chat e Cursor).
  • Nessuna telemetria / open source (come dichiarato): La pagina afferma che il progetto è gratuito, open source e senza telemetria.

Come Usare Snapmark for VS Code

  1. Installa l'estensione: Installa Snapmark dal VS Code Marketplace (o usa il link GitHub mostrato sulla pagina).
  2. Copia uno screenshot: Usa lo strumento screenshot del tuo OS (esempi elencati includono macOS Ctrl+Shift+⌘4, Windows Win+Shift+S o qualsiasi snipper Linux).
  3. Apri l'annotatore: Dopo la copia, Snapmark rileva l'immagine nel clipboard e attiva il pulsante sulla status bar. Premi ⌘⇧A (o Ctrl+Shift+A) per aprire l'annotatore.
  4. Annota e prepara l'immagine: Usa gli strumenti disponibili per sfocare aree sensibili e aggiungere callout con passaggi numerati come necessario. L'estensione applica anche il ridimensionamento descritto alla copia.
  5. Incolla in una chat AI: Usa l'azione “Copy” dell'estensione e incolla l'immagine annotata in una chat AI che accetta immagini incollate (esempi elencati sulla pagina includono Claude Code, Copilot Chat e Cursor).

Casi d'Uso

  • Oscura credenziali prima di condividere UI: Quando documenti uno schermo di un'applicazione che include chiavi API, token o dati personali, sfoca prima quelle regioni in modo che lo screenshot incollato non esponga informazioni sensibili.
  • Spiega interfacce multi-passo: Per un flusso come “configura impostazioni → invia → conferma risultati”, aggiungi marcatori numerati (1, 2, 3) per indicare al modello quali aree dello schermo corrispondono a ciascun passo.
  • Prepara screenshot per modelli di visione senza costo extra di pixel: Se copi uno screenshot ad alta risoluzione (es. Retina), affidati al ridimensionamento automatico di Snapmark per ridurre la dimensione dell'immagine in modo che il modello elabori un lato lungo di 1920px invece di screenshot estremamente grandi.
  • Usa più strumenti di chat AI con lo stesso flusso: Passa tra diversi client di chat AI (la pagina elenca Claude Code, Copilot, Cursor e altri) senza cambiare il tuo processo di annotazione screenshot—incolla l'immagine annotata ovunque sia accettata.

FAQ

Snapmark si integra con agenti AI specifici?

Snapmark è descritto come funzionante con “qualsiasi altra cosa che accetta immagini incollate”. La pagina elenca esempi come Claude Code, GitHub Copilot e Cursor, ma il requisito chiave è che il client di chat AI accetti immagini incollate.

Cosa succede allo screenshot durante l'annotazione?

La pagina afferma che Snapmark vive nel tuo clipboard e non tocca nessuna finestra dell'agente. Annoti l'immagine del clipboard in VS Code e poi incolli l'immagine annotata nella chat AI.

Posso nascondere informazioni sensibili come chiavi API e PII?

Sì. Snapmark include una funzionalità di sfocamento pensata per regioni sensibili, con la pagina che menziona esplicitamente chiavi API, token e PII.

Snapmark ridimensiona screenshot grandi?

Sì. La pagina afferma che gli screenshot Retina vengono ridimensionati a 1920px sul lato lungo quando copiati.

Alternative

  • Strumenti di modifica manuale screenshot: Usa un editor di immagini (o gli strumenti di annotazione del sistema operativo) per sfocare ed etichettare gli screenshot prima di incollarli. È più flessibile per la modifica, ma richiede di passare ad altri strumenti e non offre lo stesso flusso clipboard-to-annotator all'interno di VS Code.
  • Strumenti dedicati per annotazione UI/passi: Gli strumenti che aiutano a marcare screenshot per la documentazione possono servire uno scopo simile, ma potrebbero non essere ottimizzati per il flusso clipboard-first e il passaggio “incolla nella chat AI”.
  • Altre utility VS Code per immagini/clipboard: Alternative nel campo degli strumenti per sviluppatori potrebbero offrire gestione del clipboard o manipolazione di immagini, ma potrebbero non includere lo stesso flusso integrato di sfocatura e passaggi numerati descritto per Snapmark.
  • Affidarsi solo alla gestione immagini del client chat AI: Se la tua chat AI accetta screenshot incollati direttamente, puoi saltare l'annotazione. Questo potrebbe essere meno affidabile per oscurare contenuti sensibili e per guidare i modelli attraverso flussi UI multi-passo.