Panoramica delle schede adattive

Annotazioni

Si stanno creando scenari Copilot, Teams o Outlook basati su schede adattive? Visita l'Hub della documentazione delle Adaptive Card, il nuovo sportello unico per tutte le tue esigenze di Adaptive Card! Include tutte le risorse che si stanno cercando, inclusa la documentazione completa per molte nuove funzionalità, ad esempio layout reattivo, icona, badge, sequenza, grafici e molto altro ancora.

Le schede adattive sono un formato di scambio di schede aperto che consente agli sviluppatori di scambiare il contenuto dell'interfaccia utente in modo comune e coerente.

Un modo completamente nuovo per offrire l'interfaccia utente: le schede adattive sono frammenti indipendenti dalla piattaforma dell'interfaccia utente, creati in JSON, che le app e i servizi possono scambiare apertamente. Quando viene recapitato a un'app specifica, il codice JSON viene trasformato in un'interfaccia utente nativa che si adatta automaticamente all'ambiente circostante. Consente di progettare e integrare l'interfaccia utente leggera per tutte le principali piattaforme e framework.

Le schede adattive sono disponibili per:

• Android
• iOS
• JavaScript
• ASP.NET
• .NET WPF
• Windows
• ReactNative

Raggiungi gli utenti dove si trovano

La vita digitale moderna è frenetica. Gli utenti passano costantemente tra dispositivi, app e servizi per svolgere il proprio lavoro. Le schede adattive consentono di aumentare l'engagement e l'efficienza inserendo il contenuto interattivo direttamente nelle app che usano ogni giorno.

Integrare nelle app esistenti:

• Schede adattive di Teams: come hub digitale per molti lavoratori moderni, Teams offre più punti di estendibilità per l'integrazione delle app. Un agente di conversazione basato su schede adattive può semplificare notevolmente i flussi di lavoro aziendali nel sito Web o tramite altri canali.
• Messaggi attuabili di Outlook: la posta elettronica è stata a lungo la linfa vitale per un lavoratore dell'informazione e ora è possibile distribuire contenuti attuabili direttamente nella posta in arrivo.
• Sequenza temporale di Windows: aiutare gli utenti a riprendere le attività in qualsiasi dispositivo.

Apri le app per l'estensibilità

C'è un ecosistema di sviluppatori che vogliono integrarsi con le tue app, ma come puoi farlo in modo sicuro e senza che i loro contenuti si sporgono come un pollice? Le schede adattive sono sempre native e si fondono perfettamente nell'interfaccia utente circostante e funzionano su ogni piattaforma principale.

Installare gli SDK per il rendering >

• Prestazioni native: le schede adattive generano l'interfaccia utente nativa su qualsiasi piattaforma.
• Si adatta all'interfaccia utente circostante: le schede si adattano automaticamente all'interfaccia utente circostante.
• Completamente estendibile: lo schema è aperto in modo da poter aggiungere il proprio elemento.
• Dinamico e interattivo: l'interattività è espressa in modo dichiarativo per ridurre il rischio di inserimento di codice personalizzato

Progettare schede ovunque

Non è necessario inviare gli utenti a questo sito Web per progettare schede. Proprio come le schede adattive si fondono nell'ambiente circostante, così anche il Designer delle Schede Adattive. L'SDK include un'API di configurazione completa che consente di integrare in modo approfondito i flussi di lavoro delle schede nella toolchain esistente.

Installare il Designer SDK >

Creare, condividere e individuare modelli riutilizzabili

Cosa accade se fosse possibile visualizzare immediatamente qualsiasi tipo di dati? Potrebbe trattarsi di dati dell'app, dati dell'organizzazione o dati dal Web. Con la creazione di modelli di schede adattive è possibile separare i dati dal layout della scheda e, se abbinato a un nuovo servizio modello, diventa possibile un nuovo ecosistema di scambio di carte.

Creare modelli di schede riutilizzabili >

• Integrazione avanzata della finestra di progettazione: i dati di esempio consentono di visualizzare in anteprima il modello senza uscire dalla finestra di progettazione.
• Semplificare i flussi di lavoro di sviluppo: creare il modello nella finestra di progettazione, usarlo senza i servizi e incollarlo nuovamente nella finestra di progettazione per apportare modifiche.
• Individuare e condividere modelli usando un servizio REST: il servizio modello trova un modello per i dati e lo popola anche automaticamente.
• Vogliamo ascoltarti: non abbiamo ancora una data di rilascio per questa anteprima, ma stiamo aspettando di imparare da te.

Come funzionano

Gli autori di schede descrivono il contenuto come un semplice oggetto JSON. Il rendering del contenuto può quindi essere eseguito in modo nativo all'interno di un'applicazione host, adattandolo automaticamente all'aspetto dell'host.

Ad esempio, Contoso Bot può creare una scheda adattiva tramite Bot Framework e, quando viene recapitata a Skype, avrà un aspetto simile a una scheda Skype. Quando lo stesso payload viene inviato a Microsoft Teams, avrà un aspetto simile a Microsoft Teams. Man mano che più app host iniziano a supportare le schede adattive, lo stesso payload verrà abilitato automaticamente all'interno di queste applicazioni, risultando ancora completamente nativo nell'app.

Gli utenti vincono perché tutto si sente familiare. Le app host vincono perché controllano l'esperienza utente. E gli autori di carte vincono perché il loro contenuto diventa più ampio senza alcun lavoro aggiuntivo.

Obiettivi

Gli obiettivi per le schede adattive sono:

• Portabile : per qualsiasi app, dispositivo e framework dell'interfaccia utente
• Open - Le librerie e lo schema sono open source e condivisi
• Basso costo - Facile da definire, facile da usare
• Espressivo - Mirato alla lunga coda di contenuto che gli sviluppatori vogliono produrre
• Puramente dichiarativo : non è necessario o consentito alcun codice
• Stile automatico - In conformità alle linee guida per l'esperienza utente e il marchio dell'applicazione host

Per gli autori di schede

Le schede adattive sono ideali per gli autori di schede:

• Uno schema : si ottiene un singolo formato, riducendo al minimo il costo della creazione di una scheda e ottimizzando il numero di posizioni che può essere usato.
• Espressione più completa: il contenuto può essere più allineato a quello che vuoi dire perché hai una tavolozza più ricca con cui disegnare.
• Ampia copertura : il contenuto funzionerà in un set più ampio di applicazioni senza dover apprendere nuovi schemi.
• Controlli di input: la scheda può includere controlli di input per raccogliere informazioni dall'utente che sta visualizzando la scheda.
• Strumenti migliori : un ecosistema di schede aperte significa strumenti migliori condivisi da tutti.

Per i responsabili dell'esperienza

Se sei uno sviluppatore di app che vuole sfruttare un ecosistema di contenuti di terze parti, ti piaceranno le schede adattive perché:

• Esperienza utente coerente : si garantisce un'esperienza coerente per gli utenti, perché si è proprietari dello stile della scheda di cui è stato eseguito il rendering.
• Prestazioni native - Si ottengono prestazioni native poiché viene mirato direttamente il framework dell'interfaccia utente.
• Sicuro : il contenuto viene distribuito in payload sicuri, quindi non è necessario aprire il framework dell'interfaccia utente per il markup non elaborato e lo scripting.
• Facile da implementare - Si ottengono le librerie di scaffale per integrarsi facilmente in qualsiasi piattaforma supportata
• Documentazione gratuita : è possibile risparmiare tempo perché non è necessario inventare, implementare e documentare uno schema proprietario.
• Strumenti condivisi : è possibile risparmiare tempo perché non è necessario creare strumenti personalizzati.

Principi di base della progettazione

Le schede adattive sono guidate da un set di principi guida utili per tenere traccia della progettazione.

Preferenza semantica rispetto a pixel-perfect

Abbiamo dato priorità, il più possibile, ai valori semantici e ai concetti piuttosto che a un layout perfettamente corrispondente ai pixel. Esempi di espressione semantica vengono visualizzati in colori, dimensioni e in elementi come FactSet e ImageSet. Questi consentono all'applicazione host di prendere decisioni migliori sull'aspetto effettivo.

Gli autori delle schede sono proprietari del contenuto, mentre l'applicazione host detiene l'aspetto e il design.

Gli autori delle schede possiedono ciò che vogliono dire, ma l'applicazione che la visualizza è proprietaria dell'aspetto e della sensazione della scheda nel contesto dell'applicazione.

Mantieni semplice, ma espressivo

Vogliamo che le schede adattive siano espressive e per utilizzo generico, ma non vogliamo creare un framework dell'interfaccia utente. L'obiettivo è creare un livello intermedio che sia "sufficientemente espressivo" nello stesso modo in cui Markdown è sufficientemente espressivo per i documenti.

Concentrandosi su come mantenerlo semplice ed espressivo, Markdown ha creato una descrizione semplice e coerente del contenuto del documento. Allo stesso modo, riteniamo che le schede adattive possano creare un semplice mezzo espressivo per descrivere il contenuto della scheda.

Quando in dubbio, lasciarlo fuori

È più facile aggiungere più tardi di quanto sia vivere con un errore. Se ci siamo trovati a discutere se dovremmo aggiungere qualcosa o no, abbiamo scelto di lasciarlo fuori. È sempre più facile aggiungere una proprietà che vivere con un legacy che non avremmo dovuto supportare.