Przewodnik krok po kroku: tworzenie pierwszej karty adaptacyjnej w MS Teams
By Mirko Peters · · Updated
Witamy ponownie na blogu! Jeśli kiedykolwiek czułeś(-aś) się przytłoczony(-a) ciągłym dźwiękiem powiadomień czatu, wiadomości z kanałów i zautomatyzowanych ostrzeżeń, z pewnością nie jesteś w tym sam(-a)…
Automatically translated with AI from the original post. Read the English original
Witamy ponownie na blogu! Jeśli kiedykolwiek czułeś(-aś) się przytłoczony(-a) ciągłym dźwiękiem powiadomień czatu, wiadomości z kanałów i zautomatyzowanych ostrzeżeń, z pewnością nie jesteś w tym sam(-a). Dzisiejsi pracownicy cyfrowi mierzą się z ogromną ilością informacji, często otrzymując kilkanaście alertów co godzinę. Ten nieustanny napływ rozprasza uwagę, wymusza ciągłe przełączanie kontekstu i sprawia, że pod koniec dnia czujemy się psychicznie wyczerpani. W naszym odcinku podcastu Build Actionable Teams Notifications with Adaptive Cards omówiliśmy, jak można całkowicie zmienić podejście do komunikacji, rezygnując z bezużytecznych, statycznych alertów na rzecz inteligentnych, interaktywnych wiadomości.
Dziś rozwiniemy tę rozmowę, podchodząc do tematu praktycznie. Ten przewodnik przeprowadzi Cię przez proces budowania pierwszej karty adaptacyjnej dla Microsoft Teams. Niezależnie od tego, czy chcesz usprawnić wewnętrzne zatwierdzenia, rozsyłać krytyczne alerty o incydentach, czy po prostu ułatwić codzienną pracę zespołu, opanowanie kart adaptacyjnych to jedna z najbardziej dźwigniowych umiejętności, jakie możesz rozwijać w ekosystemie Microsoft 365. Zacznijmy od razu i sprawdźmy, czego potrzeba, aby rozpocząć.
Podstawy: dlaczego tradycyjne powiadomienia zawodzą
Zanim przejdziemy do budowania, warto zrozumieć główny problem, który chcemy rozwiązać. Większość standardowych powiadomień w Microsoft Teams informuje, że coś się wydarzyło, ale nie daje bezpośredniego sposobu, by na nie zareagować. Wyobraź sobie, że otrzymujesz alert informujący, że nowe zamówienie zakupu wymaga Twojego zatwierdzenia. Przy standardowym powiadomieniu tekstowym musisz przeczytać alert, otworzyć przeglądarkę, zalogować się do osobnej aplikacji biznesowej, przejść do konkretnego rekordu i wreszcie kliknąć „Zatwierdź”.
Taka wieloetapowa ścieżka rozprasza koncentrację i pochłania cenne minuty. Pomnóż to przerwanie przez sześćdziesiąt razy w ciągu godziny, a produktywność po prostu znika. Karty adaptacyjne rozwiązują ten problem, przenosząc interfejs aplikacji bezpośrednio do okna czatu. Pozwalają odczytywać dane, wypełniać pola formularzy i klikać przyciski akcji bez opuszczania klienta Teams. Aby jednak skutecznie wdrożyć te karty, musisz zrozumieć narzędzia i wymagania wstępne, które są potrzebne, by je przygotować.
Wymagania wstępne i narzędzia
Budowanie kart adaptacyjnych nie wymaga rozległego doświadczenia w tworzeniu oprogramowania, ale warto zapoznać się ze standardowym zestawem narzędzi autorskich udostępnianym przez Microsoft. Mając pod ręką odpowiednie narzędzia, zapewnisz sobie płynny proces projektowania – od koncepcji po wdrożenie.
Podstawowe zasoby dla projektantów kart
- Adaptive Card Designer: przeglądarkowe, wizualne środowisko, w którym można przeciągać i upuszczać elementy, podglądać karty na różnych urządzeniach i od razu generować bazowy schemat JSON.
- Microsoft Teams UI Kit (Figma): nieocenione źródło wytycznych projektowych, motywów, standardów dostępności i responsywnych rozmiarów w różnych aplikacjach klienckich.
- Oficjalne centrum dokumentacji: Twój wiarygodny przewodnik po obsługiwanych wersjach schematu, akcjach kart i ograniczeniach renderowania w Teams.
- Szablony przykładowe: gotowe szablony JSON od społeczności open source, które dają dobry start w typowych wzorcach, takich jak zatwierdzenia, ankiety i alerty z bogatymi multimediami.
Gdy środowisko projektowe jest gotowe, możesz zacząć składać układ wizualny i strukturę danych swojej karty.
Tworzenie karty adaptacyjnej
Tworzenie karty adaptacyjnej to przede wszystkim ćwiczenie z kompozycji układu i struktury JSON. Ponieważ karty adaptacyjne korzystają ze schematu niezależnego od platformy, jedna definicja karty może być natywnie renderowana w systemach Windows, macOS, iOS, Android i w klientach internetowych.
Korzystanie z Adaptive Card Designer
Najprostszy sposób na zbudowanie pierwszej karty to użycie narzędzia Designer w przeglądarce. Oto prosty przebieg pracy:
- Otwórz oficjalny Adaptive Card Designer w przeglądarce internetowej.
- Wybierz szablon startowy – na przykład podstawowe powiadomienie lub formularz wejściowy – aby mieć solidną podstawę.
- Przeciągnij i upuść elementy wizualne, takie jak TextBlocks, FactSets, obrazy i ActionSets, na kanwę.
- Skonfiguruj właściwości, takie jak rozmiary czcionek, odstępy i tytuły przycisków, tak aby odpowiadały stylowi komunikacji w Twojej organizacji.
- Ustaw podgląd docelowy na „Microsoft Teams”, aby sprawdzić, jak karta będzie wyglądać dla użytkowników końcowych.
- Skopiuj automatycznie wygenerowany kod JSON z panelu widoku kodu.
Podstawy struktury JSON
Każda karta adaptacyjna jest ostatecznie oparta na ustrukturyzowanym ładunku JSON. Poniżej znajduje się prosty przykład schematu JSON karty adaptacyjnej, który definiuje podstawowe powitanie i przycisk akcji:
{
"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"
}
]
}W tym fragmencie obiekt główny określa typ karty i wersję schematu. Tablica body zawiera elementy wizualne, takie jak bloki tekstowe, natomiast tablica actions definiuje interaktywne przyciski – na przykład Action.Submit lub Action.OpenUrl – które umożliwiają użytkownikom uruchamianie procesów działających w tle.
Wysyłanie kart za pomocą botów lub interfejsu Graph API
Gdy ładunek JSON zostanie sfinalizowany i przetestowany w projektancie, kolejnym krokiem jest dostarczenie karty bezpośrednio do użytkowników w usłudze Microsoft Teams. W zależności od architektury technicznej masz kilka solidnych opcji wdrożenia.
Możesz skorzystać z usługi Power Automate do integracji przepływów pracy w modelu low-code lub wykorzystać niestandardowe boty oraz interfejs Microsoft Graph API do zaawansowanych mechanizmów dostarczania klasy enterprise. Użycie zarejestrowanej aplikacji Azure AD wraz z interfejsem REST API Bot Framework pozwala automatycznie wysyłać interaktywne karty do konkretnych użytkowników lub kanałów o dużej widoczności.
Oto przykładowa struktura ładunku, gdy karta adaptacyjna jest osadzona jako załącznik wiadomości 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"
}
]
}
}
]
}Połączenie tego ładunku z automatycznym wyzwalaczem – takim jak nowy wiersz na liście SharePoint lub nieudane uruchomienie systemu w usłudze Power Automate – sprawia, że pasywne powiadomienie staje się aktywnym podpowiedzią wspierającą podejmowanie decyzji.
Testowanie i debugowanie kart
Wdrożeniu zawsze powinno towarzyszyć dokładne testowanie. Ponieważ różne klienty (takie jak aplikacja Teams na komputer, aplikacje mobilne i klienci poczty e-mail Outlook) renderują karty adaptacyjne za pomocą własnych konfiguracji hosta, drobne błędy układu mogą czasem się pojawić.
Podczas debugowania kart warto pamiętać o następujących dobrych praktykach:
- Sprawdź wersje schematu: upewnij się, że wersja karty jest zgodna z możliwościami obsługiwanymi przez aktualną architekturę klienta Microsoft Teams.
- Sprawdź renderowanie tekstu: zweryfikuj, czy powiązanie danych zmiennych wypełnia się poprawnie i nie powoduje pustych miejsc, gdy pole danych jest puste.
- Testuj na różnych urządzeniach: podglądaj karty na wąskich ekranach urządzeń mobilnych, aby upewnić się, że układy kolumn i zestawy przycisków ustawiają się czysto, bez niezręcznego zawijania.
- Obsłuż akcje przesłania: upewnij się, że usługa zaplecza poprawnie przetwarza przychodzące ładunki JSON wywoływane przyciskami interakcji użytkownika.
Podsumowanie
Usprawnienie codziennej pracy w Microsoft Teams sprowadza się do ograniczania tarcia i przebijania się przez cyfrowy szum. Zastępując statyczne, bezużyteczne alerty dynamicznymi, interaktywnymi kartami adaptacyjnymi, zyskujesz możliwość zdecydowanego działania – bez ciągłego przełączania się między rozłączonymi aplikacjami. Omówiliśmy dziś podstawowe mechanizmy projektowania, strukturyzowania i wdrażania tych kart, ale to dopiero początek tego, co możesz osiągnąć.
Aby zgłębić strategie produktywności i dowiedzieć się, jak nowoczesne narzędzia mogą przekształcić Twoje cyfrowe miejsce pracy, koniecznie posłuchaj towarzyszącego odcinka podcastu Build Actionable Teams Notifications with Adaptive Cards. Zacznij eksperymentować z własnymi kartami już dziś, usprawnij swoje przepływy pracy i odzyskaj głębokie skupienie!