Guida passo passo: creare la prima Adaptive Card in MS Teams

By Mirko Peters · 2026-08-12 · Updated 2026-08-29

Bentornato sul blog! Se ti è mai capitato di sentirti completamente sopraffatto dal continuo trillo degli avvisi di chat, dei messaggi nei canali e degli avvisi automatici, sei sicuramente…

Automatically translated with AI from the original post. Read the English original

Titelbild: Step-by-Step Guide: Building Your First Adaptive Card in MS Teams

Bentornati sul blog! Se vi è mai capitato di sentirvi completamente sopraffatti dal continuo suono delle notifiche di chat, dei messaggi nei canali e degli avvisi automatici, non siete certo soli. Oggi i lavoratori digitali gestiscono una quantità sorprendente di informazioni, spesso ricevendo decine di notifiche ogni singola ora. Questo flusso incessante frammenta la concentrazione, costringe a continui cambi di contesto e lascia una sensazione di esaurimento mentale a fine giornata. Nel nostro podcast, Build Actionable Teams Notifications with Adaptive Cards, abbiamo visto come si possa trasformare completamente il modo di comunicare, abbandonando gli avvisi statici e inutili e sostituendoli con messaggi intelligenti e interattivi.

Oggi approfondiamo questo discorso con un approccio pratico. Questa guida ti accompagnerà nella creazione della tua prima Adaptive Card per Microsoft Teams. Che tu debba semplificare le approvazioni interne, diffondere avvisi critici su incidenti o semplicemente rendere più fluido il lavoro quotidiano del team, padroneggiare le Adaptive Card è una delle competenze con il maggiore ritorno nell'ecosistema Microsoft 365. Entriamo subito nel vivo e vediamo cosa serve per iniziare.

Le basi: perché le notifiche tradizionali non funzionano

Prima di passare alla pratica, è utile capire il problema di fondo che vogliamo risolvere. La maggior parte delle notifiche standard in Microsoft Teams ti informa che è successo qualcosa, ma non ti offre un modo diretto per rispondere. Immagina di ricevere un avviso che richiede la tua approvazione per un nuovo ordine di acquisto. Con una notifica di testo standard, devi leggere l'avviso, aprire un browser, accedere a un'applicazione gestionale separata, andare al record specifico e infine cliccare su «Approva».

Questo percorso in più passaggi spezza la concentrazione e divora minuti preziosi. Moltiplica questa interruzione per sessanta volte all'ora e la produttività svanisce. Le Adaptive Card risolvono il problema portando l'interfaccia dell'applicazione direttamente nella finestra della chat. Permettono di leggere dati, compilare campi di input e cliccare pulsanti di azione senza mai uscire dal client Teams. Per implementare correttamente queste card, però, è necessario conoscere gli strumenti sottostanti e i prerequisiti necessari per farle funzionare.

Prerequisiti e strumenti

Creare Adaptive Card non richiede un background massiccio di sviluppo software, ma è necessario familiarizzare con il toolset di authoring standard fornito da Microsoft. Avere a portata di mano le utility giuste garantisce che il processo di progettazione proceda senza intoppi, dal concept al rilascio.

Risorse essenziali per i progettisti di card

Adaptive Card Designer: un playground visuale basato sul browser, dove puoi trascinare e rilasciare gli elementi, visualizzare in anteprima live i diversi dispositivi e generare istantaneamente lo schema JSON sottostante.
Microsoft Teams UI Kit (Figma): preziosissimo per le linee guida di design, il theming, gli standard di accessibilità e il dimensionamento responsive nelle diverse applicazioni client.
Hub della documentazione ufficiale: la guida di riferimento per verificare le versioni dello schema supportate, le azioni delle card e i vincoli di rendering specifici di Teams.
Modelli di esempio: template JSON pronti all'uso, forniti dalla community open source, che ti danno un vantaggio iniziale su pattern comuni come approvazioni, sondaggi e avvisi con contenuti multimediali.

Una volta predisposto l'ambiente di progettazione, sei pronto a iniziare a comporre il layout visivo e la struttura dei dati della tua card.

Creare un'Adaptive Card

Creare un'Adaptive Card è soprattutto un esercizio di composizione del layout e di struttura JSON. Poiché le Adaptive Card utilizzano uno schema indipendente dalla piattaforma, una singola definizione di card può essere visualizzata in modo nativo su Windows, macOS, iOS, Android e client web.

Usare l'Adaptive Card Designer

Il modo più semplice per creare la prima card è usare lo strumento di progettazione web. Ecco un semplice flusso di lavoro da seguire:

Apri l'Adaptive Card Designer ufficiale nel browser.
Seleziona un modello iniziale, come una notifica di base o un modulo di input, per avere una base solida su cui lavorare.
Trascina e rilascia elementi visivi come TextBlock, FactSet, immagini e ActionSet sulla tela.
Configura proprietà come dimensioni del carattere, spaziatura e titoli dei pulsanti per adattarle allo stile di comunicazione della tua organizzazione.
Imposta la destinazione di anteprima su «Microsoft Teams» per verificare come apparirà la scheda agli utenti finali.
Copia il codice JSON generato automaticamente dal pannello della visualizzazione codice.

Nozioni di base sulla struttura JSON

Ogni scheda adattiva è alimentata, in ultima analisi, da un payload JSON strutturato. Di seguito trovi un esempio semplice, pensato per chi è alle prime armi, di schema JSON di una scheda adattiva che definisce un saluto di base e un pulsante di azione:

{
  "type": "AdaptiveCard",
  "version": "1.4",
  "body": [
    {
      "type": "TextBlock",
      "text": "Welcome to your first adaptive card!",
      "size": "Medium",
      "weight": "Bolder"
    }
  ],
  "actions": [
    {
      "type": "Action.Submit",
      "title": "Acknowledge"
    }
  ]
}

In questo frammento, l'oggetto radice specifica il tipo di scheda e la versione dello schema. L'array body contiene componenti visivi come blocchi di testo, mentre l'array actions definisce i pulsanti interattivi, come Action.Submit o Action.OpenUrl, che permettono agli utenti di avviare flussi di lavoro in background.

Invia schede con bot o Graph API

Una volta che il payload JSON è definitivo e testato nella finestra di progettazione, il passo successivo è recapitare la scheda direttamente agli utenti all'interno di Microsoft Teams. Esistono diverse opzioni solide per il deployment, a seconda della tua architettura tecnica.

Puoi usare Power Automate per integrazioni di flussi di lavoro low-code oppure sfruttare bot personalizzati e Microsoft Graph API per meccanismi di distribuzione avanzati, di livello enterprise. Utilizzare un'applicazione registrata in Azure AD insieme all'API REST di Bot Framework consente di inviare automaticamente schede interattive a utenti specifici o a canali ad alta visibilità.

Ecco un esempio di struttura del payload quando inserisci la tua scheda adattiva in un allegato di messaggio di Bot Framework:

{
  "type": "message",
  "attachments": [
    {
      "contentType": "application/vnd.microsoft.card.adaptive",
      "content": {
        "type": "AdaptiveCard",
        "version": "1.4",
        "body": [
          {
            "type": "TextBlock",
            "text": "New Service Request Pending Review"
          }
        ],
        "actions": [
          {
            "type": "Action.Submit",
            "title": "Approve"
          },
          {
            "type": "Action.Submit",
            "title": "Reject"
          }
        ]
      }
    }
  ]
}

Collegando questo payload a un trigger automatico, come una nuova riga in un elenco SharePoint o un'esecuzione non riuscita di un sistema in Power Automate, trasformi un avviso passivo in un invito attivo a prendere decisioni.

Test e debug delle schede

Il deployment deve sempre essere preceduto da test rigorosi. Poiché client diversi (come l'app desktop di Teams, le app mobile e i client di posta di Outlook) visualizzano le schede adattive tramite configurazioni host differenti, possono comparire di tanto in tanto errori di layout sottili.

Quando esegui il debug delle schede, tieni presenti queste best practice:

Verifica le versioni dello schema: assicurati che la versione della scheda corrisponda alle funzionalità supportate dall'architettura del client attuale di Microsoft Teams.
Controlla la visualizzazione del testo: verifica che l'associazione dei dati variabili venga popolata correttamente e non produca spazi vuoti se un campo dati è vuoto.
Testa su più dispositivi: visualizza in anteprima le schede su formati mobile stretti, per assicurarti che le colonne e i gruppi di pulsanti si dispongano correttamente senza andare a capo in modo sgradevole.
Gestisci le azioni di invio: assicurati che il tuo servizio back-end gestisca correttamente i payload JSON in arrivo, generati dai pulsanti con cui gli utenti interagiscono.

Conclusione

Trasformare la tua esperienza quotidiana con Microsoft Teams significa soprattutto ridurre l'attrito e fare ordine nel rumore digitale. Sostituendo avvisi statici e inutili con schede adattive dinamiche e interattive, dai a te stesso e al tuo team la possibilità di agire con decisione, senza passare continuamente da un'applicazione disconnessa all'altra. Oggi abbiamo esaminato i meccanismi di base per progettare, strutturare e distribuire queste schede, ma questo è solo l'inizio di ciò che puoi ottenere.

Per approfondire le strategie di produttività e capire come gli strumenti moderni possano ridisegnare il tuo spazio di lavoro digitale, ascolta l'episodio del podcast collegato, Build Actionable Teams Notifications with Adaptive Cards. Inizia oggi a sperimentare le tue schede personalizzate, semplifica i tuoi flussi di lavoro e riconquista la tua concentrazione profonda!