As we continue with the Microsoft Teams Announcements from Ignite 2022, we can see from Microsoft Teams Announcements Part 1 the many new features affecting, which I term loosely, physical spaces. The reason why I term it this way is that we saw how new features and enhancements affected Meetings, Rooms and Devices, Microsoft Places, and the new offering of Microsoft Teams Premium. This article focuses on the new features and enhancements surrounding audio connections.
The very heart of Microsoft Teams is Chat and Collaboration, which are seeing many new features and enhancements, including:
New features, enhancements, and additions surrounding the Phone and Contact Centre provide Microsoft Teams another method of communication for collaboration and these include:
Collaboration in Microsoft Teams is being further enhanced with Collaborative Apps, including:
And finally, Microsoft Teams for Frontline Workers is seeing many new features and rollouts including:
With the many new corporate and industry collaborations, features, enhancements, and premium offerings, Microsoft Teams strives purposefully forward with the goals of inclusivity, flexibility, and collaborative teamwork. Acknowledging the hybrid work environment and external customer bases, data and content are kept secure with sensitivity labels, watermarking, and automatic notifications when content is flagged as sensitive. Managing time, organizing daily tasks, and knowing when one is on shift is made easier for frontline workers with the updated Viva Connections Dashboard. Overall, Microsoft Teams is evolving to not only support Teams members with collaboration, but it is also providing the tools to be organized, secure, and efficient with daily, weekly, and monthly tasks.
If you thought Microsoft Teams has been an amazing app for team collaboration, then hang onto your seat because the announcements at Ignite 2022 for Microsoft Teams will blow your socks off! There are many new and exciting features coming with upgrades to many current ones that were announced for Meetings, Microsoft Teams Premium, Rooms and Devices, Microsoft Places, Chat and Collaboration, Phone and Contact Centre, Collaborative Apps, and Frontline Workers.
One of the most exciting new features for Microsoft Teams are mesh avatars. What are they? To enhance connection in our hybrid work environment, supporting collaboration in a virtual world, and making it feel like it is in person, mesh avatars provide users a metaverse experience with the ability to attend Microsoft Teams meetings without turning on the camera. Sound exciting? It definitely is! And, we will go into more detail in our article Microsoft Teams Mesh Avatars.
Mesh avatars are only one of the many features focused on the Meetings aspect of Microsoft Teams. Other enhancements and new features for Microsoft Teams meetings include:
A new SKU add-on is Microsoft Teams Premium, and greater detail is provided in our article Microsoft Ignite 2022 Microsoft Teams: Teams Premium, which provides better and enhanced meetings through:
To enhance the feeling of togetherness and provide lifelike engagement for remote participants, Microsoft Teams announced new devices and features related to Room and Devices. These include:
With the majority of corporations implementing a hybrid work environment, the use of space within a building and how it is used requires effective, productive, and intuitive planning. With Microsoft Places, coordinating who is in-room or remote, or both become more easily organized. Microsoft Places provides the technology and tools to maximize time, whether it is meeting colleagues in person by knowing when they will be on-site, booking a common space to work, or improving conference room usage. With Microsoft Places, maximizing space utilization, occupancy, and fluidity is simplified and provides managers with insights to help optimize the usage of these spaces.
So far, in this article, we have seen the many new features and upgrades to features in Microsoft Teams that surround how and where Teams members interact, whether remotely or in person. From Meetings, Rooms and Devices, and Microsoft Places, along with the new Microsoft Teams Premium, we proceed to Chat and Collaboration, Phone and Contact Centre, Collaborative Apps, and Frontline Workers in our next installment, Microsoft Teams Announcements Part 2.
This year at Microsoft Ignite 2022, Microsoft announced its offering of a new SKU add-on for Microsoft Teams that rolls all the add-ons and costly multiple-point products into one package. The Microsoft Teams Premium package provides a better way to meet in our various work environments. Teams Premium redefines how meetings are organized and conducted, how meetings are presented with specialized devices, where teams members can meet whether in-person, virtual, or in a hybrid environment, how team members can chat and collaborate, how team members can easily access the contact information through the contact center while using a Teams mobile phone, how collaboration is improved with collaborative apps, and how frontline workers benefit from F-SKUs.
Microsoft Teams Premium: Meetings
Meeting Guides
With Meeting Guides, organizers can easily create, schedule, and track meetings with preset options, thereby saving time by negating the need to drill down through menus of options to customize for each meeting. Examples of preset meeting options, which can be customized and itemized by IT, include brainstorming meetings, client calls, and help desk calls. With preset meeting guides, leaders and managers have confidence that company policies and best practices are being followed.
Custom Meeting Branding
Company branding has now reached across and is available in Teams Premium. Customized branding includes company logos and colours that can be infused into the Teams lobby and the background of the meeting. These custom backgrounds are managed by IT at the organizational level, ensuring that corporate branding policies are adhered to. Custom scenes can be created for the Together mode with Teams Premium.
Advanced Meeting Protection
For presenters and attendees in meetings, it is not unusual to share content and knowledge, but many times the content, data, and knowledge may contain business-sensitive information which should not be freely shared during the conversation or screen-shared. With Teams Premium, there are new meeting options to help secure the data and screen grabs with watermarks as well as the capability to limit who can record the meeting.
For customers who require the most advanced security requirements, Microsoft Purview Information Protection sensitivity labels will automatically apply to relevant meeting options. By choosing the sensitivity label, protection is automatically applied across M365. Existing labels can be edited by compliance admins in the Security and Compliance Centre to enforce the meeting options that need to be applied to sensitivity labels when they are used for a meeting.
Intelligent Recap
With limited hours in a day, attending every meeting we are invited to is next to impossible. What do we do then? With Teams Premium, we can focus on what matters with AI-powered meetings. With the power of AI, intelligent recap acts like a virtual assistant who has attended the meetings on your behalf and will suggest relevant action items. With AI-generated tasks that are suggested during and after the meeting, action items will not be missed.
After a meeting, Intelligent Recap will automatically generate chapters for you to navigate with ease through recordings and help you understand the meeting content that was discussed. These automatically generated chapters will include insights (personalized timeline markers) such as when you left a meeting early, when your name was mentioned, or when there was a screen share.
Searching through transcripts is much more fluid and easier with AI assistance as speakers from the transcript are suggested, and these names are based on who you work most closely with.
Live Translation for Captions
In Microsoft Teams, captioning is available for meetings conducted in English, but with Teams Premium, not only are English captions available, but live translation captioning driven by AI overcomes the language barrier. With the ability to translate 40 spoken languages, live translation for captions provides your audience with immediate translation from English to their native language so they can participate and engage in real-time with other team members.
Advanced Virtual Appointments
Advanced Virtual Appointments in Teams Premium provides you the ability to manage the end-to-end experience for your customer’s appointment. Geared towards business-to-customer (B2C) engagement, Advanced Virtual Appointments help organizations drive operational excellence by providing a customized customer experience with:
Microsoft Teams Premium: Advanced Webinars
Microsoft Teams Premium: Advanced Webinars
Taking the basic webinar functionalities in Microsoft Teams to a new level, Advanced Webinars will entice, engage, and communicate with your internal and external audience of up to 1,000 attendees.
With Teams Premium, the capabilities of Microsoft Teams are elevated to a level of collaboration, communication, workflow, and streamlined process that have not been dreamt of before. Teams Premium brings many new ways to collaborate, share knowledge, and engage the audience in a world of virtual, in-person, internal, and external team members.
At this year’s Ignite 2022, Microsoft announced an exciting new feature to Microsoft Teams, launching it fully into the metaverse world. Microsoft Teams Mesh Avatar will provide team members the ability to join team meetings as their avatars without turning on their cameras, create multiple versions of their avatars that reflect the different types of meetings they are attending, and express themselves with ease through a wide range of gestures and reactions.
Create Your Mesh Avatar
Microsoft Teams Mesh Avatars can be accessed and created in two different ways. These two ways are from:
This is how simple and quick a Mesh Avatar can be created. Once created, the Mesh Avatar can be customized as one or several versions of the user.
Customizing Your Mesh Avatar
With the hybrid work environment, and the projection of generations to come working in a metaverse, inclusivity and social connection are requirements to encourage, develop, build, and sustain community, collaboration, and team relationships.
Customizing a Mesh Avatar is just as simple as creating one. Simply choose “Customize” from within the Mesh Avatar builder to begin the process. With hundreds of options to choose from under the categories of Figure, Hair, Makeup, and Wardrobe as indicated on the tabs, a team member can customize their avatar to represent themselves while reflecting their personality and personal statements.
Joining a Teams Meeting as Your Mesh Avatar
Sometimes, we just don’t want to turn the camera on when we join a Teams meeting. Currently, we can upload a selfie or it remains as a blank outline of a portrait but either way, both are static versions of ourselves.
Now, with Mesh Avatar, team members can join a meeting without having to turn on their cameras by attending as their Mesh Avatar. To join a Teams meeting with your Mesh Avatar from within a meeting:
The Mesh Avatar that you have chosen will now appear in the meeting with the chosen avatar background without you having to turn on your camera.
React with Your Mesh Avatar
Just like you would react as if you were in person during a Teams Meeting, your Mesh Avatar can engage with team members through reactions, displaying a mood, and changing the camera angle to provide a different perspective. Microsoft Teams meetings can be fun, engaging, and personal with Mesh Avatars.
Another step towards working in a hybrid metaverse that engages team members, customizable Microsoft Teams Mesh Avatars provide team members the opportunity to present themselves sans camera while reflecting their personalities, uniqueness, attitudes, and individualities. Engaging, collaborating, discussing, and problem-solving in the metaverse world has never been more futuristic, entertaining, and convivial than it is with Teams Mesh Avatar.
In 2020, Microsoft announced Microsoft Teams Rooms to the MS Teams platform to support corporations and users adapting to the hybrid environment that was and continues to be, affected by the global pandemic. Microsoft Teams Rooms was developed to close the difference in the gap between onsite and remote staff meetings in a virtual space. Two years later, the work environment has morphed, demanding sophisticated, realistic, integrated, and interactive capabilities for meeting in the combined spaces of face-to-face and virtual. Microsoft Teams has kept the pace, but more importantly, focused and elevated these experiences for users in combination with ease of use and management. Understanding that users are both onsite and remote, Microsoft has met this challenge through an innovative approach by rethinking and designing Microsoft Teams Rooms. Unlike previous licensing, Teams Rooms licensing is based on the number of devices rather than users. Changing from the previous licensing format, the new Microsoft Teams Rooms licensing offers two forms – the Basic and the Pro. Notably, there are some major differences in the offerings between the plans.
What is a Microsoft Teams Room?
Microsoft Teams Room is a virtual space for staff to meet regardless of their location at the time of the meeting. Microsoft Teams Room facilitates attendees to meet virtually, even if they are on-site in their own office or a board room, offsite in their home or cottage, or a combination of both on-site and off-site. This hybrid meeting environment has challenges, including creating an environment whereby attendees interact as if face-to-face, ease of use, realism, and on-the-fly meetings. Microsoft Teams Rooms eliminates the barriers that exist between places, people, and spaces. It is a splace (space and place) for attendees and participants to inclusively meet, engage, create, collaborate, and be together regardless of their physical location.
What is Microsoft Teams Room Basic Plan?
Previously, Microsoft Teams Room was available in the Basic and Premium Plans. With the introduction of Pro, the former Premium plan is no longer available.
Microsoft Teams Room Basic is just that. The Basic plan will provide small businesses the ability to create hybrid meeting spaces through scheduling, sharing wireless content, and joining meetings. However, if your small business requires assistance in managing core and hybrid meeting features, then the Pro plan is the one that will meet these needs.
Teams Room Basic is included with all certified Teams Rooms devices at no extra charge if purchased before September 1, 2022. For licensing, 25 Basic licenses, or rooms, can be applied by the customer to their tenant.
What is Microsoft Teams Room Pro Plan?
The new Teams Room Pro Plan focuses on ease of usability, security, flexibility, inclusivity, and management while providing a simplified purchasing process for customers. Teams Room Pro offers one license that includes the existing Teams Room features, innovative advancements in hybrid meeting experiences, and the Teams Rooms managed service platform.
Some features are currently available in Teams Room Pro while others will be rolled out in the future. These features include:
Microsoft Teams Rooms Pro: Teams Rooms Managed Services, IT Service Management (ITSM) Integration
In the previous Teams Rooms Premium plan, Microsoft provided a paid service for 24/7 monitoring and management of the room operating system and software with the permission to perform remote action to address any issues or deficiencies. With the new Teams Rooms Pro plan, Microsoft will no longer provide this paid service but instead will enlist partner remediation. Beginning October 1, 2022, all incidences will remediate automatically or route to either the designated management partner of the customer or the customer’s IT department, negating the need for Microsoft engineers to be the intermediary.
Preparing for the Transition to Microsoft Teams Rooms Basic and Pro
The deadlines for the transitions are coming up quickly, and as administrators, these deadlines are outlined in Microsoft’s documentation under “Important” notes.
One detail to be noted is that “legacy licenses” will not automatically transition to the new licenses. When a legacy or older license expires, an organization will have to switch to Basic or Pro, which can be done through the Microsoft 365 Admin Centre Portal. Alternately, licensing for the Teams Rooms Pro plan can be purchased from sales channel partners of Microsoft.
An important detail regarding user licenses used with Teams Rooms devices, as noted in Microsoft’s documentation, will no longer be supported effective July 1, 2023. User licenses will need to be replaced by a Teams Rooms Basic or Teams Rooms Pro license as Teams Rooms licensing is based on the number of rooms, not the number of users. It was also made clear that meeting devices that have a user license will be blocked from signing in until a Teams Rooms license is assigned.
Once again, Microsoft has focused on the Microsoft Teams collaborating app with changes and enhancements that continue to support interactive, real-time, engaging, and collaborative meetings in Microsoft Teams Rooms. Whether it is the Basic or Pro license, organizations will be able to schedule, join, and share content with the Basic license to fully immersed, innovative, collaborative participation with high-definition audio, visual enhancements, multi-user whiteboarding, side-chat bubbles, and live reactions with the Pro license. Whichever plan is implemented, Microsoft Teams Rooms continue to provide an excellent solution as a key method of hosting and delivering meetings regardless of participant location. Seamless and easy to use, Microsoft Teams Rooms transcends barriers and brings together participants who are onsite, remote, or a combination of both into one space as if they are face-to-face for real-time collaboration.
In a continuation of my earlier article, Adaptive Cards with Microsoft Teams with Examples, we continue with the details of how to create these Adaptive Cards authored with JSON templates. The templates can be used as-is, edited to suit your organization’s needs, or used as a launching point to customize your templates.
Samples and Templates of Adaptive Cards for Microsoft Teams
This is exciting as these select samples and templates are created and offered for Microsoft Teams to show what you can create. These can be copied, edited, and tweaked to create any possible scenario. There are limitless scenarios to design and create.
In this series, Adaptive Cards with Microsoft Teams – JSON Templates Part 8, includes templates for Flight Itinerary, Flight Update, and Flight Status.
Flight Itinerary
Data JSON: { "Segments": [ { "Id": 1, "OriginStation": 11235, "DestinationStation": 13554, "DepartureDateTime": "2017-05-30T19:25:00Z", "ArrivalDateTime": "2017-05-30T20:55:00Z", "Carrier": 881, "OperatingCarrier": 881, "Duration": 90, "FlightNumber": "1463", "JourneyMode": "Flight", "Directionality": "Outbound" }, { "Id": 2, "OriginStation": 13554, "DestinationStation": 11235, "DepartureDateTime": "2017-06-02T19:25:00Z", "ArrivalDateTime": "2017-06-02T20:55:00Z", "Carrier": 881, "OperatingCarrier": 881, "Duration": 90, "FlightNumber": "1463", "JourneyMode": "Flight", "Directionality": "Inbound" } ], "BookingOptions": [ { "BookingItems": [ { "AgentID": 4499211, "Status": "Current", "Price": 4032.54, "Deeplink": "https://partners.api.skyscanner.net/apiservices/deeplink/v2?_cje=jzj5DawL5[...]", "SegmentIds": [ 1, 2 ] } ] } ], "Places": [ { "Id": 13554, "ParentId": 4698, "Code": "SFO", "Type": "Airport", "Name": "San Francisco" }, { "Id": 13558, "ParentId": 5796, "Code": "AMS", "Type": "Airport", "Name": "Amsterdam" } ], "Carriers": [ { "Id": 881, "Code": "BA", "Name": "British Airways", "ImageUrl": "https://s1.apideeplink.com/images/airlines/BA.png" } ], "Query": { "Country": "GB", "Currency": "GBP", "Locale": "en-gb", "Adults": 3, "Children": 0, "Infants": 0, "OriginPlace": "2343", "DestinationPlace": "13554", "OutboundDate": "2017-05-30", "InboundDate": "2017-06-02", "LocationSchema": "Default", "CabinClass": "Economy", "GroupPricing": false } } Template JSON: { "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "version": "1.0", "type": "AdaptiveCard", "speak": "Your flight is confirmed for you and 3 other passengers from San Francisco to Amsterdam on Friday, October 10 8:30 AM", "body": [ { "type": "TextBlock", "text": "Passengers", "weight": "Bolder", "wrap": true }, { "type": "TextBlock", "text": "Sarah Hum", "separator": true, "wrap": true }, { "type": "TextBlock", "text": "Jeremy Goldberg", "spacing": "None", "wrap": true }, { "type": "TextBlock", "text": "Evan Litvak", "spacing": "None", "wrap": true }, { "type": "TextBlock", "text": "2 Stops", "weight": "Bolder", "spacing": "Medium", "wrap": true }, { "type": "TextBlock", "text": "{{DATE(${string(Segments[0].DepartureDateTime)}, SHORT)}} {{TIME(${string(Segments[0].DepartureDateTime)})}}", "weight": "Bolder", "spacing": "None", "wrap": true }, { "type": "ColumnSet", "separator": true, "columns": [ { "type": "Column", "width": 1, "items": [ { "type": "TextBlock", "$when": "${Segments[0].OriginStation == 11235}", "text": "${Places[0].Name}", "isSubtle": true, "wrap": true }, { "type": "TextBlock", "$when": "${Segments[0].OriginStation == 13554}", "text": "${Places[1].Name}", "isSubtle": true, "wrap": true } ] }, { "type": "Column", "width": 1, "items": [ { "type": "TextBlock", "$when": "${Segments[0].DestinationStation == 11235}", "text": "${Places[0].Name}", "horizontalAlignment": "Right", "isSubtle": true, "wrap": true }, { "type": "TextBlock", "$when": "${Segments[0].DestinationStation == 13554}", "text": "${Places[1].Name}", "horizontalAlignment": "Right", "isSubtle": true, "wrap": true } ] } ] }, { "type": "ColumnSet", "spacing": "none", "columns": [ { "type": "Column", "width": 1, "items": [ { "type": "TextBlock", "size": "ExtraLarge", "color": "Accent", "$when": "${Segments[0].OriginStation == 11235}", "text": "${Places[0].Code}", "spacing": "None", "wrap": true }, { "type": "TextBlock", "size": "ExtraLarge", "color": "Accent", "$when": "${Segments[0].OriginStation == 13554}", "text": "${Places[1].Code}", "spacing": "None", "wrap": true } ] }, { "type": "Column", "width": "auto", "items": [ { "type": "Image", "url": "https://adaptivecards.io/content/airplane.png", "size": "Small", "spacing": "None" } ] }, { "type": "Column", "width": 1, "items": [ { "type": "TextBlock", "size": "ExtraLarge", "color": "Accent", "$when": "${Segments[0].DestinationStation == 11235}", "text": "${Places[0].Code}", "horizontalAlignment": "Right", "spacing": "None", "wrap": true }, { "type": "TextBlock", "size": "ExtraLarge", "color": "Accent", "$when": "${Segments[0].DestinationStation == 13554}", "text": "${Places[1].Code}", "horizontalAlignment": "Right", "spacing": "None", "wrap": true } ] } ] }, { "type": "TextBlock", "text": "Non-Stop", "weight": "Bolder", "spacing": "Medium", "wrap": true }, { "type": "TextBlock", "text": "{{DATE(${string(Segments[1].ArrivalDateTime)}, SHORT)}} {{TIME(${string(Segments[1].ArrivalDateTime)})}}", "weight": "Bolder", "spacing": "None", "wrap": true }, { "type": "ColumnSet", "separator": true, "columns": [ { "type": "Column", "width": 1, "items": [ { "type": "TextBlock", "$when": "${Segments[1].OriginStation == 11235}", "text": "${Places[0].Name}", "isSubtle": true, "wrap": true }, { "type": "TextBlock", "$when": "${Segments[1].OriginStation == 13554}", "text": "${Places[1].Name}", "isSubtle": true, "wrap": true } ] }, { "type": "Column", "width": 1, "items": [ { "type": "TextBlock", "$when": "${Segments[1].DestinationStation == 11235}", "text": "${Places[0].Name}", "horizontalAlignment": "Right", "isSubtle": true, "wrap": true }, { "type": "TextBlock", "$when": "${Segments[1].DestinationStation == 13554}", "text": "${Places[1].Name}", "horizontalAlignment": "Right", "isSubtle": true, "wrap": true } ] } ] }, { "type": "ColumnSet", "spacing": "none", "columns": [ { "type": "Column", "width": 1, "items": [ { "type": "TextBlock", "size": "ExtraLarge", "color": "Accent", "$when": "${Segments[1].OriginStation == 11235}", "text": "${Places[0].Code}", "spacing": "None", "wrap": true }, { "type": "TextBlock", "size": "ExtraLarge", "color": "Accent", "$when": "${Segments[1].OriginStation == 13554}", "text": "${Places[1].Code}", "spacing": "None", "wrap": true } ] }, { "type": "Column", "width": "auto", "items": [ { "type": "Image", "url": "https://adaptivecards.io/content/airplane.png", "size": "Small", "spacing": "None" } ] }, { "type": "Column", "width": 1, "items": [ { "type": "TextBlock", "size": "ExtraLarge", "color": "Accent", "$when": "${Segments[1].DestinationStation == 11235}", "text": "${Places[0].Code}", "horizontalAlignment": "Right", "spacing": "None", "wrap": true }, { "type": "TextBlock", "size": "ExtraLarge", "color": "Accent", "$when": "${Segments[1].DestinationStation == 13554}", "text": "${Places[1].Code}", "horizontalAlignment": "Right", "spacing": "None", "wrap": true } ] } ] }, { "type": "ColumnSet", "spacing": "Medium", "columns": [ { "type": "Column", "width": 1, "items": [ { "type": "TextBlock", "text": "Total", "size": "Medium", "isSubtle": true, "wrap": true } ] }, { "type": "Column", "width": 1, "items": [ { "type": "TextBlock", "horizontalAlignment": "Right", "text": "$${formatNumber(BookingOptions[0].BookingItems[0].Price, 2)}", "size": "Medium", "weight": "Bolder", "wrap": true } ] } ] } ] }
Flight Update
{ "@context": "http://schema.org", "@type": "FlightReservation", "reservationId": "RXJ34P", "reservationStatus": "http://schema.org/ReservationConfirmed", "passengerPriorityStatus": "Fast Track", "passengerSequenceNumber": "ABC123", "securityScreening": "TSA PreCheck", "underName": { "@type": "Person", "name": "Sarah Hum" }, "reservationFor": { "@type": "Flight", "flightNumber": "KL605", "provider": { "@type": "Airline", "name": "KLM", "iataCode": "KL", "boardingPolicy": "http://schema.org/ZoneBoardingPolicy" }, "seller": { "@type": "Airline", "name": "KLM", "iataCode": "KL" }, "departureAirport": { "@type": "Airport", "name": "Amsterdam Airport", "iataCode": "AMS" }, "departureTime": "2017-03-04T09:20:00-01:00", "arrivalAirport": { "@type": "Airport", "name": "San Francisco Airport", "iataCode": "SFO" }, "arrivalTime": "2017-03-05T08:20:00+04:00" } } Template JSON: { "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "type": "AdaptiveCard", "version": "1.0", "speak": "Flight KL0605 to San Fransisco has been delayed.It will not leave until 10:10 AM.", "body": [ { "type": "ColumnSet", "columns": [ { "type": "Column", "width": "auto", "items": [ { "type": "Image", "size": "Small", "url": "https://adaptivecards.io/content/airplane.png" } ] }, { "type": "Column", "width": "stretch", "items": [ { "type": "TextBlock", "text": "Flight Status", "horizontalAlignment": "Right", "isSubtle": true, "wrap": true }, { "type": "TextBlock", "text": "DELAYED", "horizontalAlignment": "Right", "spacing": "None", "size": "Large", "color": "Attention", "wrap": true } ] } ] }, { "type": "ColumnSet", "separator": true, "spacing": "Medium", "columns": [ { "type": "Column", "width": "stretch", "items": [ { "type": "TextBlock", "text": "Passengers", "isSubtle": true, "weight": "Bolder", "wrap": true }, { "type": "TextBlock", "text": "${underName.name}", "spacing": "Small", "wrap": true }, { "type": "TextBlock", "text": "Jeremy Goldberg", "spacing": "Small", "wrap": true }, { "type": "TextBlock", "text": "Evan Litvak", "spacing": "Small", "wrap": true } ] }, { "type": "Column", "width": "auto", "items": [ { "type": "TextBlock", "text": "Seat", "horizontalAlignment": "Right", "isSubtle": true, "weight": "Bolder", "wrap": true }, { "type": "TextBlock", "text": "14A", "horizontalAlignment": "Right", "spacing": "Small", "wrap": true }, { "type": "TextBlock", "text": "14B", "horizontalAlignment": "Right", "spacing": "Small", "wrap": true }, { "type": "TextBlock", "text": "14C", "horizontalAlignment": "Right", "spacing": "Small", "wrap": true } ] } ] }, { "type": "ColumnSet", "spacing": "Medium", "separator": true, "columns": [ { "type": "Column", "width": 1, "items": [ { "type": "TextBlock", "text": "Flight", "isSubtle": true, "weight": "Bolder", "wrap": true }, { "type": "TextBlock", "text": "${reservationFor.flightNumber}", "spacing": "Small", "wrap": true } ] }, { "type": "Column", "width": 1, "items": [ { "type": "TextBlock", "text": "Departs", "isSubtle": true, "horizontalAlignment": "Center", "weight": "Bolder", "wrap": true }, { "type": "TextBlock", "text": "{{TIME(${string(reservationFor.departureTime)})}}", "color": "Attention", "weight": "Bolder", "horizontalAlignment": "Center", "spacing": "Small", "wrap": true } ] }, { "type": "Column", "width": 1, "items": [ { "type": "TextBlock", "text": "Arrives", "isSubtle": true, "horizontalAlignment": "Right", "weight": "Bolder", "wrap": true }, { "type": "TextBlock", "text": "{{TIME(${string(reservationFor.arrivalTime)})}}", "color": "Attention", "horizontalAlignment": "Right", "weight": "Bolder", "spacing": "Small", "wrap": true } ] } ] }, { "type": "ColumnSet", "spacing": "Medium", "separator": true, "columns": [ { "type": "Column", "width": 1, "items": [ { "type": "TextBlock", "text": "${reservationFor.departureAirport.name}", "isSubtle": true, "wrap": true }, { "type": "TextBlock", "text": "${reservationFor.departureAirport.iataCode}", "size": "ExtraLarge", "color": "Accent", "spacing": "None", "wrap": true } ] }, { "type": "Column", "width": "auto", "items": [ { "type": "TextBlock", "text": " ", "wrap": true }, { "type": "Image", "url": "https://adaptivecards.io/content/airplane.png", "size": "Small" } ] }, { "type": "Column", "width": 1, "items": [ { "type": "TextBlock", "text": "${reservationFor.arrivalAirport.name}", "isSubtle": true, "horizontalAlignment": "Right", "wrap": true }, { "type": "TextBlock", "text": "${reservationFor.arrivalAirport.iataCode}", "horizontalAlignment": "Right", "size": "ExtraLarge", "color": "Accent", "spacing": "None", "wrap": true } ] } ] } ] }
Flight Details
Data JSON: { "@context": "http://schema.org", "@type": "FlightReservation", "reservationId": "RXJ34P", "reservationStatus": "http://schema.org/ReservationConfirmed", "passengerPriorityStatus": "Fast Track", "passengerSequenceNumber": "ABC123", "securityScreening": "TSA PreCheck", "underName": { "@type": "Person", "name": "Eva Green" }, "reservationFor": { "@type": "Flight", "flightNumber": "UA110", "provider": { "@type": "Airline", "name": "Continental", "iataCode": "CO", "boardingPolicy": "http://schema.org/ZoneBoardingPolicy" }, "seller": { "@type": "Airline", "name": "United", "iataCode": "UA" }, "departureAirport": { "@type": "Airport", "name": "San Francisco Airport", "city": "San Francisco", "iataCode": "SFO" }, "departureTime": "2017-03-04T20:15:00-08:00", "arrivalAirport": { "@type": "Airport", "name": "John F. Kennedy International Airport", "city": "New York", "iataCode": "JFK" }, "arrivalTime": "2017-03-05T06:30:00-05:00" } } Template JSON: { "type": "AdaptiveCard", "body": [ { "type": "ColumnSet", "columns": [ { "type": "Column", "items": [ { "type": "Container", "backgroundImage": "https://messagecardplayground.azurewebsites.net/assets/TxP_Background.png", "items": [ { "type": "Image", "horizontalAlignment": "center", "url": "https://messagecardplayground.azurewebsites.net/assets/TxP_Flight.png", "altText": "Departing airplane" } ], "bleed": true }, { "type": "Container", "spacing": "none", "style": "emphasis", "items": [ { "type": "TextBlock", "size": "extraLarge", "weight": "lighter", "color": "Accent", "text": "Flight to ${reservationFor.arrivalAirport.iataCode}", "wrap": true }, { "type": "TextBlock", "spacing": "small", "text": "${reservationFor.provider.name} Air Lines flight ${reservationFor.flightNumber} ", "wrap": true }, { "type": "TextBlock", "spacing": "none", "text": "Confirmation code: ${reservationId}", "wrap": true }, { "type": "TextBlock", "spacing": "none", "text": "4 hours 15 minutes", "wrap": true } ], "bleed": true, "height": "stretch" } ], "width": 45, "height": "stretch" }, { "type": "Column", "items": [ { "type": "Container", "height": "stretch", "items": [ { "type": "ColumnSet", "columns": [ { "type": "Column", "items": [ { "type": "TextBlock", "size": "extraLarge", "weight": "lighter", "text": "${reservationFor.departureAirport.iataCode}", "wrap": true } ], "width": "auto" }, { "type": "Column", "verticalContentAlignment": "center", "items": [ { "type": "Image", "url": "https://messagecardplayground.azurewebsites.net/assets/graydot2x2.png", "width": "10000px", "height": "2px" } ], "width": "stretch" }, { "type": "Column", "spacing": "small", "verticalContentAlignment": "center", "items": [ { "type": "Image", "url": "https://messagecardplayground.azurewebsites.net/assets/smallairplane.png", "height": "16px" } ], "width": "auto" }, { "type": "Column", "items": [ { "type": "TextBlock", "horizontalAlignment": "right", "size": "extraLarge", "weight": "lighter", "text": "${reservationFor.arrivalAirport.iataCode}", "wrap": true } ], "width": "auto" } ] }, { "type": "ColumnSet", "columns": [ { "type": "Column", "items": [ { "type": "RichTextBlock", "inlines": [ { "type": "TextRun", "size": "medium", "text": "{{TIME(${string(reservationFor.departureTime)})}}\\n", "wrap": true }, { "type": "TextRun", "text": "{{DATE(${string(reservationFor.departureTime)}, SHORT)}}\\n", "isSubtle": true, "wrap": true }, { "type": "TextRun", "text": "${reservationFor.departureAirport.city}", "isSubtle": true, "wrap": true } ] } ], "width": 1 }, { "type": "Column", "items": [ { "type": "RichTextBlock", "horizontalAlignment": "right", "inlines": [ { "type": "TextRun", "size": "medium", "text": "{{TIME(${string(reservationFor.arrivalTime)})}}\\n", "wrap": true }, { "type": "TextRun", "text": "{{DATE(${string(reservationFor.arrivalTime)}, SHORT)}}\\n", "isSubtle": true, "wrap": true }, { "type": "TextRun", "text": "${reservationFor.arrivalAirport.city}", "isSubtle": true, "wrap": true } ] } ], "width": 1 } ] }, { "type": "ActionSet", "separator": true, "actions": [ { "type": "Action.Submit", "title": "Check in", "style": "positive" }, { "type": "Action.Submit", "title": "View" } ], "spacing": "medium" } ] } ], "width": 55 } ], "height": "stretch" } ], "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "version": "1.0" } 25. Simple Fallback Data JSON: { "fallback": { "message":"No graph support. Guess we'll just use this textblock instead." } } Template JSON: { "type": "AdaptiveCard", "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "version": "1.2", "body": [ { "type": "TextBlock", "text": "Fallback test:", "wrap": true }, { "type": "Steve Holt!", "egg": "her?", "fallback": "drop" }, { "type": "Graph", "someProperty": "foo", "fallback": { "type": "TextBlock", "text": "${fallback.message}", "wrap": true } } ] }
JSON Scripts and Templates: Microsoft.com
In a continuation of my earlier article, Adaptive Cards with Microsoft Teams with Examples, we continue with the details of how to create these Adaptive Cards authored with JSON templates. The templates can be used as-is, edited to suit your organization’s needs, or used as a launching point to customize your templates.
Samples and Templates of Adaptive Cards for Microsoft Teams
This is exciting as these select samples and templates are created and offered for Microsoft Teams to show what you can create. These can be copied, edited, and tweaked to create any possible scenario. There are limitless scenarios to design and create.
Adaptive Cards with Microsoft Teams – JSON Templates Part 7 includes templates for Sporting Event, Stock Update, and Agenda.
Sporting Event
Data JSON: { "id": 401117857, "season": 2019, "week": 1, "season_type": "regular", "start_date": "2019-08-31T19:30:00Z", "neutral_site": false, "conference_game": false, "attendance": null, "venue_id": 3852, "venue": "Navy-Marine Corps Memorial Stadium", "home_team": "Navy", "home_conference": "American Athletic", "home_points": 45, "home_line_scores": [ 10, 14, 14, 7 ], "away_team": "Holy Cross", "away_conference": null, "away_points": 7, "away_line_scores": [ 0, 7, 0, 0 ] } Template JSON: { "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "type": "AdaptiveCard", "version": "1.0", "speak": "The Seattle Seahawks beat the Carolina Panthers 40-7", "body": [ { "type": "Container", "items": [ { "type": "ColumnSet", "columns": [ { "type": "Column", "width": "auto", "items": [ { "type": "Image", "url": "https://adaptivecards.io/content/cats/3.png", "size": "Medium" }, { "type": "TextBlock", "text": "SHADES", "horizontalAlignment": "Center", "weight": "Bolder", "wrap": true } ] }, { "type": "Column", "width": "stretch", "separator": true, "spacing": "Medium", "items": [ { "type": "TextBlock", "text": "{{DATE(${string(start_date)}, SHORT)}}", "horizontalAlignment": "Center", "wrap": true }, { "type": "TextBlock", "text": "Final", "spacing": "None", "horizontalAlignment": "Center", "wrap": true }, { "type": "TextBlock", "text": "${home_points} - ${away_points}", "size": "ExtraLarge", "horizontalAlignment": "Center", "wrap": true } ] }, { "type": "Column", "width": "auto", "separator": true, "spacing": "Medium", "items": [ { "type": "Image", "url": "https://adaptivecards.io/content/cats/2.png", "size": "Medium", "horizontalAlignment": "Center" }, { "type": "TextBlock", "text": "SKINS", "horizontalAlignment": "Center", "weight": "Bolder", "wrap": true } ] } ] } ] } ] }
Stock Update
Data JSON: { "symbol": "MSFT", "companyName": "Microsoft Corporation", "primaryExchange": "Nasdaq Global Select", "sector": "Technology", "calculationPrice": "close", "open": 127.42, "openTime": 1556890200, "close": 128.9, "closeTime": 1556913600, "high": 129.43, "low": 127.25, "latestPrice": 128.9, "latestSource": "Close", "latestTime": "May 3, 2019", "latestUpdate": 1556913600, "latestVolume": 24835154, "iexRealtimePrice": null, "iexRealtimeSize": null, "iexLastUpdated": null, "delayedPrice": 128.9, "delayedPriceTime": 1556913600, "extendedPrice": 129.04, "extendedChange": 0.14, "extendedChangePercent": 0.00109, "extendedPriceTime": 1556917190, "previousClose": 126.21, "change": 2.69, "changePercent": 0.02131, "iexMarketPercent": null, "iexVolume": null, "avgTotalVolume": 22183270, "iexBidPrice": null, "iexBidSize": null, "iexAskPrice": null, "iexAskSize": null, "marketCap": 987737229888, "peRatio": 30.84, "week52High": 131.37, "week52Low": 93.96, "ytdChange": 0.30147812013916003 } Template JSON: { "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "type": "AdaptiveCard", "version": "1.2", "body": [ { "type": "Container", "items": [ { "type": "TextBlock", "text": "${companyName}", "size": "Medium", "wrap": true }, { "type": "TextBlock", "text": "${primaryExchange}: ${symbol}", "isSubtle": true, "spacing": "None", "wrap": true }, { "type": "TextBlock", "text": "{{DATE(${formatEpoch(latestUpdate, 'yyyy-MM-ddTHH:mm:ssZ')}, SHORT)}} {{TIME(${formatEpoch(latestUpdate, 'yyyy-MM-ddTHH:mm:ssZ')})}}", "wrap": true } ] }, { "type": "Container", "spacing": "None", "items": [ { "type": "ColumnSet", "columns": [ { "type": "Column", "width": "stretch", "items": [ { "type": "TextBlock", "text": "${formatNumber(latestPrice, 2)} ", "size": "ExtraLarge", "wrap": true }, { "type": "TextBlock", "text": "${if(change >= 0, '▲', '▼')} ${formatNumber(change,2)} USD (${formatNumber(changePercent * 100, 2)}%)", "color": "${if(change >= 0, 'good', 'attention')}", "spacing": "None", "wrap": true } ] }, { "type": "Column", "width": "auto", "items": [ { "type": "FactSet", "facts": [ { "title": "Open", "value": "${open} " }, { "title": "High", "value": "${high} " }, { "title": "Low", "value": "${low} " } ] } ] } ] } ] } ] }
Agenda
Data JSON: { "@odata.context": "https://outlook.office.com/api/beta/$metadata#Me/Events/$entity", "@odata.id": "https://outlook.office.com/api/beta/Users('ddfcd489-628b-40d7-b48b-57002df800e5@1717622f-1d94-4d0c-9d74-709fad664b77')/Events('AAMkAGI2TG93AAA=')", "@odata.etag": "W/\"nfZyf7VcrEKLNoU37KWlkQAAA0x48w==\"", "Id": "AAMkAGI2TG93AAA=", "ChangeKey": "nfZyf7VcrEKLNoU37KWlkQAAA0x48w==", "Categories": [], "CreatedDateTime": "2014-10-19T23:13:47.3959685Z", "LastModifiedDateTime": "2014-10-19T23:13:47.6772234Z", "Subject": "Contoso Campaign Status Meeting", "BodyPreview": "Setting up some time to review the budget and planning on the Contoso Project", "Body": { "ContentType": "HTML", "Content": "\r\n\r\n\r\n\r\n\r\nSetting up some time to review the budget and planning on the Contoso Project\r\n\r\n\r\n" }, "Importance": "Normal", "HasAttachments": false, "Start": { "DateTime": "2014-10-13T21:00:00", "TimeZone": "Pacific Standard Time" }, "End": { "DateTime": "2014-10-13T22:00:00", "TimeZone": "Pacific Standard Time" }, "Location": { "DisplayName": "Conf Room Bravern-2/9050", "Address": null }, "ShowAs": "Busy", "IsAllDay": false, "IsCancelled": false, "IsOrganizer": true, "ResponseRequested": true, "Type": "SeriesMaster", "SeriesMasterId": null, "Attendees": [ { "EmailAddress": { "Address": "[email protected]", "Name": "Janet Schorr" }, "Status": { "Response": "None", "Time": "0001-01-01T00:00:00Z" }, "Type": "Required" }, { "EmailAddress": { "Address": "[email protected]", "Name": "Pavel Bansky" }, "Status": { "Response": "None", "Time": "0001-01-01T00:00:00Z" }, "Type": "Required" } ], "Recurrence": { "Pattern": { "Type": "Weekly", "Interval": 1, "Month": 0, "Index": "First", "FirstDayOfWeek": "Sunday", "DayOfMonth": 0, "DaysOfWeek": [ "Monday" ] }, "RecurrenceTimeZone": "Pacific Standard Time", "Range": { "Type": "NoEnd", "StartDate": "2014-10-13", "EndDate": "2014-11-13", "NumberOfOccurrences": 0 } }, "OriginalEndTimeZone": "Pacific Standard Time", "OriginalStartTimeZone": "Pacific Standard Time", "Organizer": { "EmailAddress": { "Address": "[email protected]", "Name": "Alex D" }, "OnlineMeetingUrl": null } } Template JSON: { "type": "AdaptiveCard", "body": [ { "type": "ColumnSet", "horizontalAlignment": "Center", "columns": [ { "type": "Column", "items": [ { "type": "ColumnSet", "horizontalAlignment": "Center", "columns": [ { "type": "Column", "items": [ { "type": "Image", "url": "https://messagecardplayground.azurewebsites.net/assets/LocationGreen_A.png" } ], "width": "auto" }, { "type": "Column", "items": [ { "type": "TextBlock", "text": "**Redmond**", "wrap": true }, { "type": "TextBlock", "spacing": "None", "text": "8a - 12:30p", "wrap": true } ], "width": "auto" } ] } ], "width": 1 }, { "type": "Column", "spacing": "Large", "separator": true, "items": [ { "type": "ColumnSet", "horizontalAlignment": "Center", "columns": [ { "type": "Column", "items": [ { "type": "Image", "url": "https://messagecardplayground.azurewebsites.net/assets/LocationBlue_B.png" } ], "width": "auto" }, { "type": "Column", "items": [ { "type": "TextBlock", "text": "**Bellevue**", "wrap": true }, { "type": "TextBlock", "spacing": "None", "text": "12:30p - 3p", "wrap": true } ], "width": "auto" } ] } ], "width": 1 }, { "type": "Column", "spacing": "Large", "separator": true, "items": [ { "type": "ColumnSet", "horizontalAlignment": "Center", "columns": [ { "type": "Column", "items": [ { "type": "Image", "url": "https://messagecardplayground.azurewebsites.net/assets/LocationRed_C.png" } ], "width": "auto" }, { "type": "Column", "items": [ { "type": "TextBlock", "text": "**Seattle**", "wrap": true }, { "type": "TextBlock", "spacing": "None", "text": "8p", "wrap": true } ], "width": "auto" } ] } ], "width": 1 } ] }, { "type": "ColumnSet", "columns": [ { "type": "Column", "items": [ { "type": "ColumnSet", "columns": [ { "type": "Column", "items": [ { "type": "Image", "horizontalAlignment": "Left", "url": "https://messagecardplayground.azurewebsites.net/assets/Conflict.png" } ], "width": "auto" }, { "type": "Column", "spacing": "None", "items": [ { "type": "TextBlock", "text": "2:00 PM", "wrap": true } ], "width": "stretch" } ] }, { "type": "TextBlock", "spacing": "None", "text": "1hr", "isSubtle": true, "wrap": true } ], "width": "110px" }, { "type": "Column", "backgroundImage": { "url": "https://messagecardplayground.azurewebsites.net/assets/SmallVerticalLineGray.png", "fillMode": "RepeatVertically", "horizontalAlignment": "Center" }, "items": [ { "type": "Image", "horizontalAlignment": "Center", "url": "https://messagecardplayground.azurewebsites.net/assets/CircleGreen_coffee.png" } ], "width": "auto", "spacing": "None" }, { "type": "Column", "items": [ { "type": "TextBlock", "text": "**${Subject}**", "wrap": true }, { "type": "ColumnSet", "spacing": "None", "columns": [ { "type": "Column", "items": [ { "type": "Image", "url": "https://messagecardplayground.azurewebsites.net/assets/location_gray.png" } ], "width": "auto" }, { "type": "Column", "items": [ { "type": "TextBlock", "text": "${Location.DisplayName}", "wrap": true } ], "width": "stretch" } ] }, { "type": "ImageSet", "spacing": "Small", "imageSize": "Small", "images": [ { "type": "Image", "url": "https://messagecardplayground.azurewebsites.net/assets/person_w1.png", "size": "Small" }, { "type": "Image", "url": "https://messagecardplayground.azurewebsites.net/assets/person_m1.png", "size": "Small" }, { "type": "Image", "url": "https://messagecardplayground.azurewebsites.net/assets/person_w2.png", "size": "Small" } ] }, { "type": "ColumnSet", "spacing": "Small", "columns": [ { "type": "Column", "items": [ { "type": "Image", "url": "https://messagecardplayground.azurewebsites.net/assets/power_point.png" } ], "width": "auto" }, { "type": "Column", "items": [ { "type": "TextBlock", "text": "**Contoso Brand Guidelines** shared by **Susan Metters**", "wrap": true } ], "width": "stretch" } ] } ], "width": 40 } ] }, { "type": "ColumnSet", "spacing": "None", "columns": [ { "type": "Column", "width": "110px" }, { "type": "Column", "backgroundImage": { "url": "https://messagecardplayground.azurewebsites.net/assets/SmallVerticalLineGray.png", "fillMode": "RepeatVertically", "horizontalAlignment": "Center" }, "items": [ { "type": "Image", "horizontalAlignment": "Center", "url": "https://messagecardplayground.azurewebsites.net/assets/Gray_Dot.png" } ], "width": "auto", "spacing": "None" }, { "type": "Column", "items": [ { "type": "ColumnSet", "columns": [ { "type": "Column", "items": [ { "type": "Image", "url": "https://messagecardplayground.azurewebsites.net/assets/car.png" } ], "width": "auto" }, { "type": "Column", "items": [ { "type": "TextBlock", "text": "about 45 minutes", "isSubtle": true, "wrap": true } ], "width": "stretch" } ] } ], "width": 40 } ] }, { "type": "ColumnSet", "spacing": "None", "columns": [ { "type": "Column", "items": [ { "type": "TextBlock", "spacing": "None", "text": "8:00 PM", "wrap": true }, { "type": "TextBlock", "spacing": "None", "text": "1hr", "isSubtle": true, "wrap": true } ], "width": "110px" }, { "type": "Column", "backgroundImage": { "url": "https://messagecardplayground.azurewebsites.net/assets/SmallVerticalLineGray.png", "fillMode": "RepeatVertically", "horizontalAlignment": "Center" }, "items": [ { "type": "Image", "horizontalAlignment": "Center", "url": "https://messagecardplayground.azurewebsites.net/assets/CircleBlue_flight.png" } ], "width": "auto", "spacing": "None" }, { "type": "Column", "items": [ { "type": "TextBlock", "text": "**Alaska Airlines AS1021 flight to Chicago**", "wrap": true }, { "type": "ColumnSet", "spacing": "None", "columns": [ { "type": "Column", "items": [ { "type": "Image", "url": "https://messagecardplayground.azurewebsites.net/assets/location_gray.png" } ], "width": "auto" }, { "type": "Column", "items": [ { "type": "TextBlock", "text": "Seattle Tacoma International Airport (17801 International Blvd, Seattle, WA, United States)", "wrap": true } ], "width": "stretch" } ] }, { "type": "Image", "url": "https://messagecardplayground.azurewebsites.net/assets/SeaTacMap.png", "size": "Stretch" } ], "width": 40 } ] } ], "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "version": "1.0" }
JSON Scripts and Templates: Microsoft.com
In a continuation of my earlier article, Adaptive Cards with Microsoft Teams with Examples, we continue with the details of how to create these Adaptive Cards authored with JSON templates. The templates can be used as-is, edited to suit your organization’s needs, or used as a launching point to customize your templates.
Samples and Templates of Adaptive Cards for Microsoft Teams
This is exciting as these select samples and templates are created and offered for Microsoft Teams to show what you can create. These can be copied, edited, and tweaked to create any possible scenario. There are limitless scenarios to design and create.
In Part 6, we have included Inputs, Inputs with Validation, and Restaurant templates.
Inputs
Data JSON: { "ParticipantInfoForm":{ "title":"Input.Text elements" }, "Survey": { "title":"Input ChoiceSet", "questions": [ { "question":"What color do you want? (compact)", "items": [ { "choice":"Red", "value":"1" }, { "choice":"Green", "value":"2" }, { "choice":"Blue", "value":"3" } ] }, { "question": "What color do you want? (expanded)", "items": [ { "choice":"Red", "value":"1" }, { "choice":"Green", "value":"2" }, { "choice":"Blue", "value":"3" } ] }, { "question": "What color do you want? (multiselect)", "items": [ { "choice":"Red", "value":"1" }, { "choice":"Green", "value":"2" }, { "choice":"Blue", "value":"3" } ] }, { "question":"I accept the terms and conditions (True/False)" }, { "question":"Red cars are better than other cars" } ] } } Template JSON: { "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "type": "AdaptiveCard", "version": "1.0", "body": [ { "type": "TextBlock", "size": "Medium", "weight": "Bolder", "text": " ${ParticipantInfoForm.title}", "horizontalAlignment": "Center", "wrap": true, "style": "heading" }, { "type": "TextBlock", "text": "Name", "wrap": true }, { "type": "Input.Text", "style": "text", "id": "SimpleVal" }, { "type": "TextBlock", "text": "Homepage", "wrap": true }, { "type": "Input.Text", "style": "url", "id": "UrlVal" }, { "type": "TextBlock", "text": "Email", "wrap": true }, { "type": "Input.Text", "style": "email", "id": "EmailVal" }, { "type": "TextBlock", "text": "Phone", "wrap": true }, { "type": "Input.Text", "style": "tel", "id": "TelVal" }, { "type": "TextBlock", "text": "Comments", "wrap": true }, { "type": "Input.Text", "style": "text", "isMultiline": true, "id": "MultiLineVal" }, { "type": "TextBlock", "text": "Quantity", "wrap": true }, { "type": "Input.Number", "min": -5, "max": 5, "value": 1, "id": "NumVal" }, { "type": "TextBlock", "text": "Due Date", "wrap": true }, { "type": "Input.Date", "id": "DateVal", "value": "2017-09-20" }, { "type": "TextBlock", "text": "Start time", "wrap": true }, { "type": "Input.Time", "id": "TimeVal", "value": "16:59" }, { "type": "TextBlock", "size": "Medium", "weight": "Bolder", "text": "${Survey.title} ", "horizontalAlignment": "Center", "wrap": true, "style": "heading" }, { "type": "TextBlock", "text": "${Survey.questions[0].question}", "wrap": true }, { "type": "Input.ChoiceSet", "id": "CompactSelectVal", "value": "1", "choices": [ { "$data": "${Survey.questions[0].items}", "title": "${choice}", "value": "${value}" } ] }, { "type": "TextBlock", "text": "${Survey.questions[1].question}", "wrap": true }, { "type": "Input.ChoiceSet", "id": "SingleSelectVal", "style": "expanded", "value": "1", "choices": [ { "$data": "${Survey.questions[1].items}", "title": "${choice}", "value": "${value}" } ] }, { "type": "TextBlock", "text": "${Survey.questions[2].question}", "wrap": true }, { "type": "Input.ChoiceSet", "id": "MultiSelectVal", "isMultiSelect": true, "value": "1,3", "choices": [ { "$data": "${Survey.questions[2].items}", "title": "${choice}", "value": "${value}" } ] }, { "type": "TextBlock", "size": "Medium", "weight": "Bolder", "text": "Input.Toggle", "horizontalAlignment": "Center", "wrap": true, "style": "heading" }, { "type": "Input.Toggle", "title": "${Survey.questions[3].question}", "id": "AcceptsTerms", "wrap": false, "value": "false" }, { "type": "Input.Toggle", "title": "${Survey.questions[4].question}", "valueOn": "RedCars", "valueOff": "NotRedCars", "id": "ColorPreference", "wrap": false, "value": "NotRedCars" } ], "actions": [ { "type": "Action.Submit", "title": "Submit", "data": { "id": "1234567890" } }, { "type": "Action.ShowCard", "title": "Show Card", "card": { "type": "AdaptiveCard", "body": [ { "type": "TextBlock", "text": "Enter comment", "wrap": true }, { "type": "Input.Text", "style": "text", "id": "CommentVal" } ], "actions": [ { "type": "Action.Submit", "title": "OK" } ], "$schema": "http://adaptivecards.io/schemas/adaptive-card.json" } } ] }
Inputs with Validation
Data JSON: { "ParticipantInfoForm":{ "title":"Input.Text elements" }, "Survey": { "title":"Input ChoiceSet", "questions": [ { "question":"What color do you want? (compact)", "items": [ { "choice":"Red", "value":"1" }, { "choice":"Green", "value":"2" }, { "choice":"Blue", "value":"3" } ] }, { "question": "What color do you want? (expanded)", "items": [ { "choice":"Red", "value":"1" }, { "choice":"Green", "value":"2" }, { "choice":"Blue", "value":"3" } ] }, { "question": "What color do you want? (multiselect)", "items": [ { "choice":"Red", "value":"1" }, { "choice":"Green", "value":"2" }, { "choice":"Blue", "value":"3" } ] }, { "question":"I accept the terms and conditions (True/False)" }, { "question":"Red cars are better than other cars" } ] } } Template JSON: { "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "type": "AdaptiveCard", "version": "1.0", "body": [ { "type": "TextBlock", "size": "medium", "weight": "bolder", "text": " ${ParticipantInfoForm.title}", "horizontalAlignment": "center", "wrap": true, "style": "heading" }, { "type": "Input.Text", "label": "Name", "style": "text", "id": "SimpleVal", "isRequired": true, "errorMessage": "Name is required" }, { "type": "Input.Text", "label": "Homepage", "style": "url", "id": "UrlVal" }, { "type": "Input.Text", "label": "Email", "style": "email", "id": "EmailVal" }, { "type": "Input.Text", "label": "Phone", "style": "tel", "id": "TelVal" }, { "type": "Input.Text", "label": "Comments", "style": "text", "isMultiline": true, "id": "MultiLineVal" }, { "type": "Input.Number", "label": "Quantity", "min": -5, "max": 5, "value": 1, "id": "NumVal", "errorMessage": "The quantity must be between -5 and 5" }, { "type": "Input.Date", "label": "Due Date", "id": "DateVal", "value": "2017-09-20" }, { "type": "Input.Time", "label": "Start time", "id": "TimeVal", "value": "16:59" }, { "type": "TextBlock", "size": "medium", "weight": "bolder", "text": "${Survey.title} ", "horizontalAlignment": "center", "wrap": true, "style": "heading" }, { "type": "Input.ChoiceSet", "id": "CompactSelectVal", "label": "${Survey.questions[0].question}", "style": "compact", "value": "1", "choices": [ { "$data": "${Survey.questions[0].items}", "title": "${choice}", "value": "${value}" } ] }, { "type": "Input.ChoiceSet", "id": "SingleSelectVal", "label": "${Survey.questions[1].question}", "style": "expanded", "value": "1", "choices": [ { "$data": "${Survey.questions[1].items}", "title": "${choice}", "value": "${value}" } ] }, { "type": "Input.ChoiceSet", "id": "MultiSelectVal", "label": "${Survey.questions[2].question}", "isMultiSelect": true, "value": "1,3", "choices": [ { "$data": "${Survey.questions[2].items}", "title": "${choice}", "value": "${value}" } ] }, { "type": "TextBlock", "size": "medium", "weight": "bolder", "text": "Input.Toggle", "horizontalAlignment": "center", "wrap": true, "style": "heading" }, { "type": "Input.Toggle", "label": "Please accept the terms and conditions:", "title": "${Survey.questions[3].question}", "valueOn": "true", "valueOff": "false", "id": "AcceptsTerms", "isRequired": true, "errorMessage": "Accepting the terms and conditions is required" }, { "type": "Input.Toggle", "label": "How do you feel about red cars?", "title": "${Survey.questions[4].question}", "valueOn": "RedCars", "valueOff": "NotRedCars", "id": "ColorPreference" } ], "actions": [ { "type": "Action.Submit", "title": "Submit", "data": { "id": "1234567890" } }, { "type": "Action.ShowCard", "title": "Show Card", "card": { "type": "AdaptiveCard", "body": [ { "type": "Input.Text", "label": "enter comment", "style": "text", "id": "CommentVal" } ], "actions": [ { "type": "Action.Submit", "title": "OK" } ] } } ] }
Restaurant
Data JSON: { "@context": "http://schema.org/", "@type": "LocalBusiness", "name": "Malt \u0026 Vine", "url": "https://www.yelp.com/biz/malt-and-vine-redmond", "address": { "addressLocality": "Redmond", "addressRegion": "WA", "streetAddress": "16851 Redmond Way", "postalCode": "98052", "addressCountry": "US" }, "image": "https://s3-media1.fl.yelpcdn.com/bphoto/HD_NsxwaCTwKRxvOZs2Shw/ls.jpg", "imageAlt": "image of beer growlers on a table", "telephone": "+14258816461", "aggregateRating": { "reviewCount": 176, "@type": "AggregateRating", "ratingValue": 4.5 }, "review": [{ "reviewRating": { "ratingValue": 4 }, "datePublished": "2014-11-28", "description": "Great concept and a wide selection of beers both on tap and bottled! Smaller wine selection than I wanted, but the variety of beers certainly made up for that. Although I didn't order anything, my boyfriend got a beer and he loved it. Their prices are fair too. \n\nThe concept is really awesome. It's a bar/store that you can bring outside food into. The place was pretty packed tonight. I wish we had stayed for more than one drink. I would have loved to sample everything!", "author": "Blaire S." }], "priceRange": "mid-priced" } Template JSON: { "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "type": "AdaptiveCard", "version": "1.0", "body": [ { "speak": "Tom's Pie is a Pizza restaurant which is rated 9.3 by customers.", "type": "ColumnSet", "columns": [ { "type": "Column", "width": 2, "items": [ { "type": "TextBlock", "text": "${address.addressLocality}, ${address.addressRegion}", "wrap": true }, { "type": "TextBlock", "text": "${name}", "weight": "bolder", "size": "extraLarge", "spacing": "none", "wrap": true }, { "type": "TextBlock", "$when": "${aggregateRating.ratingValue <= 1}", "text": "${aggregateRating.ratingValue} star (${aggregateRating.reviewCount} reviews) · ${priceRange}", "isSubtle": true, "spacing": "none", "wrap": true }, { "type": "TextBlock", "$when": "${aggregateRating.ratingValue >= 2}", "text": "${aggregateRating.ratingValue} stars (${aggregateRating.reviewCount} reviews) · ${priceRange}", "isSubtle": true, "spacing": "none", "wrap": true }, { "type": "TextBlock", "text": "**${review[0].author}** said \"${review[0].description}\"", "size": "small", "wrap": true, "maxLines": 3 } ] }, { "type": "Column", "width": 1, "items": [ { "type": "Image", "url": "${image}", "altText": "${imageAlt}", "size": "auto" } ] } ] } ], "actions": [ { "type": "Action.OpenUrl", "title": "More Info", "url": "${url}" } ] } JSON Scripts and Templates: Microsoft.com
In a continuation of my earlier article, Adaptive Cards with Microsoft Teams with Examples, we continue with the details of how to create these Adaptive Cards authored with JSON templates. The templates can be used as-is, edited to suit your organization’s needs, or used as a launching point to customize your templates.
Samples and Templates of Adaptive Cards for Microsoft Teams
This is exciting as these select samples and templates are created and offered for Microsoft Teams to show what you can create. These can be copied, edited, and tweaked to create any possible scenario. There are limitless scenarios to design and create.
Food Order
Data JSON: { "@context":"http://schema.org", "@type":"Restaurant", "url":"https://www.thisisarestaurant.com", "name":"The Restaurant", "image":"https://www.example.com/image-of-some-restaurant.jpg", "description":"This is an example restaurant that serves American cuisine.", "servesCuisine":[ "American cuisine" ], "hasMenu":{ "@type":"Menu", "name":"Dine-In Menu", "description":"Menu for in-restaurant dining only.", "hasMenuSection":[ { "@type":"MenuSection", "name":"Steak", "description":"How would you like your steak prepared?", "image":"https://contososcubademo.azurewebsites.net/assets/steak.jpg", "offers":{ "@type":"Offer", "availabilityEnds":"T8:22:00", "availabilityStarts":"T8:22:00" }, "hasMenuSection":[ { "@type":"MenuSection", "name":"Chicken", "description":"Do you have any allergies?", "image":"https://contososcubademo.azurewebsites.net/assets/chicken.jpg", "offers":{ "@type":"Offer", "availabilityEnds":"T8:22:00", "availabilityStarts":"T8:22:00" }, "hasMenuItem":{ "@type":"MenuItem", "name":"Potato Skins", "description":"Small serving of stuffed potato skins.", "offers":{ "@type":"Offer", "price":"7.49", "priceCurrency":"USD" }, "suitableForDiet":"http://schema.org/GlutenFreeDiet" } }, { "@type":"MenuSection", "name":"Tofu", "description":"Would you like it prepared vegan?", "image":"https://contososcubademo.azurewebsites.net/assets/tofu.jpg", "offers":{ "@type":"Offer", "availabilityEnds":"T8:22:00", "availabilityStarts":"T8:22:00" }, "hasMenuItem":{ "@type":"MenuItem", "name":"Pea Soup", "description":"Creamy pea soup topped with melted cheese and sourdough croutons.", "offers":{ "@type":"Offer", "price":"3.49", "priceCurrency":"USD" } } } ] } ] } } Template JSON: { "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "type": "AdaptiveCard", "version": "1.0", "body": [ { "type": "TextBlock", "text": "Your registration is almost complete", "size": "Medium", "weight": "Bolder", "wrap": true }, { "type": "TextBlock", "text": "What type of food do you prefer?", "wrap": true }, { "type": "ImageSet", "imageSize": "medium", "images": [ { "type": "Image", "url": "${hasMenu.hasMenuSection[0].image}" }, { "type": "Image", "url": "${hasMenu.hasMenuSection[0].hasMenuSection[0].image}" }, { "type": "Image", "url": "${hasMenu.hasMenuSection[0].hasMenuSection[1].image}" } ] } ], "actions": [ { "type": "Action.ShowCard", "title": "${hasMenu.hasMenuSection[0].name}", "card": { "type": "AdaptiveCard", "body": [ { "type": "TextBlock", "text": "${hasMenu.hasMenuSection[0].description}", "size": "Medium", "wrap": true }, { "type": "Input.ChoiceSet", "id": "SteakTemp", "style": "expanded", "choices": [ { "title": "Rare", "value": "rare" }, { "title": "Medium-Rare", "value": "medium-rare" }, { "title": "Well-done", "value": "well-done" } ] }, { "type": "Input.Text", "id": "SteakOther", "isMultiline": true, "placeholder": "Any other preparation requests?" } ], "actions": [ { "type": "Action.Submit", "title": "OK", "data": { "FoodChoice": "Steak" } } ], "$schema": "http://adaptivecards.io/schemas/adaptive-card.json" } }, { "type": "Action.ShowCard", "title": "${hasMenu.hasMenuSection[0].hasMenuSection[0].name}", "card": { "type": "AdaptiveCard", "body": [ { "type": "TextBlock", "text": "${hasMenu.hasMenuSection[0].hasMenuSection[0].description}", "size": "Medium", "wrap": true }, { "type": "Input.ChoiceSet", "id": "ChickenAllergy", "style": "expanded", "isMultiSelect": true, "choices": [ { "title": "I'm allergic to peanuts", "value": "peanut" } ] }, { "type": "Input.Text", "id": "ChickenOther", "isMultiline": true, "placeholder": "Any other preparation requests?" } ], "actions": [ { "type": "Action.Submit", "title": "OK", "data": { "FoodChoice": "Chicken" } } ], "$schema": "http://adaptivecards.io/schemas/adaptive-card.json" } }, { "type": "Action.ShowCard", "title": "${hasMenu.hasMenuSection[0].hasMenuSection[1].name}", "card": { "type": "AdaptiveCard", "body": [ { "type": "TextBlock", "text": "${hasMenu.hasMenuSection[0].hasMenuSection[1].description}", "size": "Medium", "wrap": true }, { "type": "Input.Toggle", "id": "Vegetarian", "title": "Please prepare it vegan", "valueOn": "vegan", "valueOff": "notVegan", "wrap": false }, { "type": "Input.Text", "id": "VegOther", "isMultiline": true, "placeholder": "Any other preparation requests?" } ], "actions": [ { "type": "Action.Submit", "title": "OK", "data": { "FoodChoice": "Vegetarian" } } ], "$schema": "http://adaptivecards.io/schemas/adaptive-card.json" } } ] }
Food Order with Validation
Data JSON: { "@context":"http://schema.org", "@type":"Restaurant", "url":"https://www.thisisarestaurant.com", "name":"The Restaurant", "image":"https://www.example.com/image-of-some-restaurant.jpg", "description":"This is an example restaurant that serves American cuisine.", "servesCuisine":[ "American cuisine" ], "hasMenu":{ "@type":"Menu", "name":"Dine-In Menu", "description":"Menu for in-restaurant dining only.", "hasMenuSection":[ { "@type":"MenuSection", "name":"Steak", "description":"How would you like your steak prepared?", "image":"https://contososcubademo.azurewebsites.net/assets/steak.jpg", "offers":{ "@type":"Offer", "availabilityEnds":"T8:22:00", "availabilityStarts":"T8:22:00" }, "hasMenuSection":[ { "@type":"MenuSection", "name":"Chicken", "description":"Do you have any allergies?", "image":"https://contososcubademo.azurewebsites.net/assets/chicken.jpg", "offers":{ "@type":"Offer", "availabilityEnds":"T8:22:00", "availabilityStarts":"T8:22:00" }, "hasMenuItem":{ "@type":"MenuItem", "name":"Potato Skins", "description":"Small serving of stuffed potato skins.", "offers":{ "@type":"Offer", "price":"7.49", "priceCurrency":"USD" }, "suitableForDiet":"http://schema.org/GlutenFreeDiet" } }, { "@type":"MenuSection", "name":"Tofu", "description":"Would you like it prepared vegan?", "image":"https://contososcubademo.azurewebsites.net/assets/tofu.jpg", "offers":{ "@type":"Offer", "availabilityEnds":"T8:22:00", "availabilityStarts":"T8:22:00" }, "hasMenuItem":{ "@type":"MenuItem", "name":"Pea Soup", "description":"Creamy pea soup topped with melted cheese and sourdough croutons.", "offers":{ "@type":"Offer", "price":"3.49", "priceCurrency":"USD" } } } ] } ] } } Template JSON: { "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "type": "AdaptiveCard", "version": "1.0", "body": [ { "type": "TextBlock", "text": "Your registration is almost complete", "size": "Medium", "weight": "Bolder", "wrap": true }, { "type": "TextBlock", "text": "What type of food do you prefer?", "wrap": true }, { "type": "ImageSet", "imageSize": "medium", "images": [ { "type": "Image", "url": "${hasMenu.hasMenuSection[0].image}" }, { "type": "Image", "url": "${hasMenu.hasMenuSection[0].hasMenuSection[0].image}" }, { "type": "Image", "url": "${hasMenu.hasMenuSection[0].hasMenuSection[1].image}" } ] } ], "actions": [ { "type": "Action.ShowCard", "title": "${hasMenu.hasMenuSection[0].name}", "card": { "type": "AdaptiveCard", "body": [ { "type": "Input.ChoiceSet", "id": "SteakTemp", "style": "expanded", "label": "${hasMenu.hasMenuSection[0].description}", "isRequired": true, "errorMessage": "Please select one of the above options", "choices": [ { "title": "Rare", "value": "rare" }, { "title": "Medium-Rare", "value": "medium-rare" }, { "title": "Well-done", "value": "well-done" } ] }, { "type": "Input.Text", "id": "SteakOther", "isMultiline": true, "label": "Any other preparation requests?" } ], "actions": [ { "type": "Action.Submit", "title": "OK", "data": { "FoodChoice": "Steak" } } ], "$schema": "http://adaptivecards.io/schemas/adaptive-card.json" } }, { "type": "Action.ShowCard", "title": "${hasMenu.hasMenuSection[0].hasMenuSection[0].name}", "card": { "type": "AdaptiveCard", "body": [ { "type": "Input.Toggle", "id": "ChickenAllergy", "valueOn": "noPeanuts", "valueOff": "peanuts", "title": "I'm allergic to peanuts", "label": "${hasMenu.hasMenuSection[0].hasMenuSection[0].description}" }, { "type": "Input.Text", "id": "ChickenOther", "isMultiline": true, "label": "Any other preparation requests?" } ], "actions": [ { "type": "Action.Submit", "title": "OK", "data": { "FoodChoice": "Chicken" } } ], "$schema": "http://adaptivecards.io/schemas/adaptive-card.json" } }, { "type": "Action.ShowCard", "title": "${hasMenu.hasMenuSection[0].hasMenuSection[1].name}", "card": { "type": "AdaptiveCard", "body": [ { "type": "Input.Toggle", "id": "Vegetarian", "title": "Please prepare it vegan", "label": "${hasMenu.hasMenuSection[0].hasMenuSection[1].description}", "valueOn": "vegan", "valueOff": "notVegan" }, { "type": "Input.Text", "id": "VegOther", "isMultiline": true, "label": "Any other preparation requests?" } ], "actions": [ { "type": "Action.Submit", "title": "OK", "data": { "FoodChoice": "Vegetarian" } } ], "$schema": "http://adaptivecards.io/schemas/adaptive-card.json" } } ] }
Input Form
Data JSON: { "title": "Tell us about yourself", "body": "We just need a few more details to get you booked for the trip of a lifetime!", "disclaimer": "Don't worry, we'll never share or sell your information.", "properties": [ { "title" : "Your Name", "placeholder" : "Last, First" }, { "title" : "Your email", "placeholder" : "[email protected]" }, { "title" : "Phone Number", "placeholder" : "xxx.xxx.xxxx" } ], "thumbnailUrl": "https://upload.wikimedia.org/wikipedia/commons/b/b2/Diver_Silhouette%2C_Great_Barrier_Reef.jpg" } Template JSON: { "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "type": "AdaptiveCard", "version": "1.0", "body": [ { "type": "ColumnSet", "columns": [ { "type": "Column", "width": 2, "items": [ { "type": "TextBlock", "text": "${title}", "weight": "Bolder", "size": "Medium", "wrap": true, "style": "heading" }, { "type": "TextBlock", "text": "${body}", "isSubtle": true, "wrap": true }, { "type": "TextBlock", "text": "${disclaimer}", "isSubtle": true, "wrap": true, "size": "Small" }, { "type": "Container", "$data": "${properties}", "items": [ { "type": "TextBlock", "text": "${title}", "wrap": true }, { "type": "Input.Text", "id": "${if(title == 'Your Name', 'myName', if(title == 'Your email', 'myEmail', 'myTel'))}", "placeholder": "${placeholder}" } ] } ] }, { "type": "Column", "width": 1, "items": [ { "type": "Image", "url": "${thumbnailUrl}", "size": "auto" } ] } ] } ], "actions": [ { "type": "Action.Submit", "title": "Submit" } ] }
Input Form with Labels
Data JSON: { "title": "Tell us about yourself", "body": "We just need a few more details to get you booked for the trip of a lifetime!", "disclaimer": "Don't worry, we'll never share or sell your information.", "properties": [ { "id": "myName", "label": "Your name (Last, First)", "validation": "^[A-Z][a-z]+, [A-Z][a-z]+$", "error": "Please enter your name in the specified format" }, { "id": "myEmail", "label": "Your email", "validation": "^[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+[.][A-Za-z0-9-]{2,4}$", "error": "Please enter a valid email address" }, { "id": "myTel", "label": "Phone Number (xxx-xxx-xxxx)", "validation": "^[0-9]{3}-[0-9]{3}-[0-9]{4}$", "error": "Invalid phone number. Use the specified format: 3 numbers, hyphen, 3 numbers, hyphen and 4 numbers" } ], "thumbnailUrl": "https://upload.wikimedia.org/wikipedia/commons/b/b2/Diver_Silhouette%2C_Great_Barrier_Reef.jpg" } Template JSON: { "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "type": "AdaptiveCard", "version": "1.0", "body": [ { "type": "ColumnSet", "columns": [ { "type": "Column", "width": 2, "items": [ { "type": "TextBlock", "text": "${title}", "weight": "bolder", "size": "medium", "style": "heading" }, { "type": "TextBlock", "text": "${body}", "isSubtle": true, "wrap": true }, { "type": "TextBlock", "text": "${disclaimer}", "isSubtle": true, "wrap": true, "size": "small" }, { "type": "Container", "$data": "${properties}", "items": [ { "type": "Input.Text", "label": "${label}", "id": "${id}", "regex": "${validation}", "errorMessage": "${error}", "isRequired": true } ] } ] }, { "type": "Column", "width": 1, "items": [ { "type": "Image", "url": "${thumbnailUrl}", "size": "auto" } ] } ] } ], "actions": [ { "type": "Action.Submit", "title": "Submit" } ] }
JSON Scripts and Templates: Microsoft.com