Adaptive kort til design af agenter

Adaptive kort er en effektiv måde at forme, hvordan agenter præsenterer oplysninger og interagerer med brugerne. I stedet for kun at være afhængig af almindelig tekst kan agenter svare med strukturerede, interaktive kort, der viser relevant indhold, indsamler input og driver handling – alt sammen i samtalens flow.

Kort kan vises på to måder:

• Enkeltstående: Kortet er hele agentens svar, fuldt selvstændigt med alt, hvad brugeren behøver for at forstå og handle.
• Parret med en meddelelse: Kortet følger teksten før eller efter den, hvor meddelelsen indeholder kontekst, og kortet håndterer struktur, interaktion eller handling.

Baseret på et JSON-baseret format Adaptive kort gengives som oprindelig brugergrænseflade, der automatisk tilpasses deres værtsmiljø – herunder lys og mørk tilstand, skærmstørrelse og Microsoft 365 overflader som Teams, Outlook og Copilot Chat.

Som designer er kort, hvor dine beslutninger har den mest synlige indvirkning på agentoplevelsen. Afsnittene nedenfor dækker kortanatomi, designprincipper og de ressourcer, du skal bruge for at komme i gang med at bygge.

Hvorfor Adaptive kort betydning for agentdesign

Når en agent reagerer, kan almindelig tekst kun gå indtil videre. Adaptive kort give agenterne en rigere og mere kompetent tilstedeværelse i samtalen – en, der føles bevidst, struktureret og designet i stedet for blot genereret.

Kort er som designer et primært værktøj til at forme, hvordan en agent præsenterer sig selv og interagerer med brugerne.

Veldesignede kort:

• Giv agenter en rigere stemme. I stedet for at returnere en væg med tekst kan kort give agenter mulighed for at vise indhold på en måde, der svarer til kompleksiteten af oplysningerne – diagrammer til data, billeder til kontekst, strukturerede layout til svar med flere dele. Kortet former, hvor nyttig og pålidelig agenten føler sig.
• Reducer samtalegnidning. I stedet for at stille opfølgende spørgsmål én ad gangen kan agenter bruge input, rullemenuer og valgsæt til at indsamle alt, hvad de har brug for, på et enkelt trin – så interaktionen er effektiv og fokuseret.
• Express brand og personlighed. Kort er der, hvor en agents visuelle identitet bor. Typografi, ikonografi, layoutrytme og handlingsmærkaters tone bidrager alle til, om agenten føles som en poleret, pålidelig assistent eller en eftertanke.
• Giv designere en plads ved bordet. I agentoplevelser adskilles design og logik af natur – agenten styrer dataene og beslutningerne, men du styrer layoutet, hierarkiet og interaktionsmønstrene. Denne adskillelse er en mulighed. Et veldesignet kort kan få selv et simpelt agentsvar til at virke gennemtænkt og målrettet.
• Skabe ensartethed på tværs af overflader. Kort gengives på tværs af Teams, Outlook, Microsoft 365 Copilot Chat og andre værter ved hjælp af et delt visuelt sprog – så agenten føler sig sammenhængende og genkendelig, uanset hvor brugerne støder på det.

Kortanatomi

Adaptive kort kan tilpasses i høj grad, men de fleste agentkort deler et sæt almindelige komponenter. Hvis du forstår disse elementer, kan du træffe tilsigtede beslutninger om struktur, hierarki og interaktion.

Et par principper, du skal være opmærksom på:

• Begynd med de vigtigste oplysninger. Kort skal lette indsigt og fuldførelse af opgaver hurtigt; de skal sende brugerne til et opgavemodul eller det fulde program for mere komplekse interaktioner.
• Opret et visuelt hierarki. Brug skriftstørrelse, farve og placering, så de vigtigste oplysninger er fremtrædende og let at scanne.
• Tillad gradvis offentliggørelse. Kundeemne med det mest relevante indhold, og lad brugerne afdække mere efter behov. overvej at afkorte tekst med "Vis flere/Vis færre" indstillinger eller sektioner, der kan skjules.
• Bevar vigtige handlinger. Prioriter handlinger, der direkte bidrager til fuldførelse af opgaver – f.eks. Send til inputformularer, Godkend/Afvis for arbejdsprocesser eller Få vist detaljer for oversigtskort. Responsivt design. Kort skal være designet til at tilpasse sig på tværs af alle skærmstørrelser og -kontekster. Den Adaptive kort struktur understøtter fire dynamiske pausepunkter – Wide, Standard, Narrow og Very Narrow – så du kan skræddersy layout, så de passer effektivt til forskellige kontekster og kortdimensioner. Hvis du vil have vejledning i design på tværs af pausepunkter, skal du gå til Dynamisk layout.

Hvis du vil have et dybere indblik i anatomi, bedste fremgangsmåder, ikoner og illustrationer, skal du gå til Design bedste fremgangsmåder på webstedet Adaptive kort.

Eksempler

I følgende eksempler kan du se de mange forskellige oplevelser, du kan oprette med Adaptive kort i agentscenarier, fra enkle opgavelister til omfattende godkendelsesarbejdsprocesser og datavisualiseringer. Hvert eksempel repræsenterer et forskelligt layoutmønster og use case.

Leder du efter et udgangspunkt for dine egne designs? Det Microsoft Teams UI Kit og Microsoft Teams lager med adaptive korteksempler indeholder en række skabeloner og komponenter, der kan bygges ud fra.

Begynd at udvikle

Afsnittet om anatomi ovenfor giver dig en mental model af, hvordan kort er struktureret. Når du er klar til at gå mere i dybden – udforske layoutmønstre, komponenter, typografier og reelle eksempler – skal du bruge disse ressourcer:

• Adaptive kort Designer, et browserbaseret værktøj til prototyper og test af kortlayout i realtid uden at skrive JSON manuelt.

  Designeren indeholder startkortskabeloner. Den Adaptive kort hjemmeside indeholder også skabeloner. Brug dem som inspiration eller praktiske udgangspunkter for dine egne designs. Hver skabelon indeholder README-instruktioner i lageret Microsoft Teams eksempler på adaptive kort, hvis du vil arbejde direkte med JSON.

  Bemærkning

  Angiv målversionen for at teste i forhold til den skemaversion, der understøttes af destinationsværten.

• Microsoft Teams UI Kit (Figma Community). Teams UI Kit indeholder to dedikerede Adaptive kort sider:

  • Adaptive kort: Oversigt, bedste praksis, startkort, inspiration og anatomi.
  • Card Design Toolkit: Et komplet designsystem til oprettelse af Adaptive kort i Teams. Modulære, temaorienterede komponenter, der dækker alt fra enkle meddelelser til komplekse dynamiske oplevelser – herunder alle elementer, input, typografier, farver og typografi.

• Adaptive kort websted, den autoritative reference til alt, hvad der involverer Adaptive kort. De vigtigste destinationer for designere er:

  • Design bedste praksis: Layoutideer, visuelt hierarki, og hvad du skal tænke over, når du strukturerer et kort.
  • Elementreference: Alle elementer og inputtyper med eksempler og vejledning.

Skema- og værtskompatibilitet

Understøttelsen af Adaptive kort-skemaet varierer fra vært til vært. Design og test i forhold til skemaversionen, der understøttes af destinationsværten. Kort, der bruger ikke-understøttede skemaelementer, kan mislykkes uovervåget eller gengives forkert i produktionen.

Hvis du vil teste mod en bestemt skemaversion, skal du angive Target-versionen i Adaptive kort Designer før du afslutter dit kortlayout.

Relateret indhold

• Designværktøj til Adaptive kort. Browserbaseret værktøj til prototyper og test af kortlayout.
• Microsoft Teams eksempler på adaptive kort. Starterskabeloner til Teams og Copilot oplevelser.
• Microsoft Teams brugergrænsefladepakke. Sider for Adaptive kort og Card Design Toolkit.
• Adaptive kort bedste praksis for design. Layoutideer, visuelt hierarki og vejledning til kortdesign.
• Dynamisk layout. Design på tværs af pausepunkter.
• Brug af Adaptive kort i Copilot Studio. Skemaunderstøttelse, brug af spørg og meddelelsesnode samt oprettelsesressourcer.