Lekcja 11 / 2016 min czytaniaStan na 2 października 2026

Desktop, przeglądarka i @remotion

Orkiestracja narzędzi, testy stron, grafika ruchoma

W skrócie

Agent sam decyduje, z których podłączonych narzędzi skorzystać, obsługuje przeglądarkę obok rozmowy i generuje edytowalną animację komendą @remotion.

Po tej lekcji
  • Wydasz jeden brief zamiast prowadzić agenta narzędzie po narzędziu
  • Zlecisz automatyczny test ścieżki użytkownika na własnej stronie
  • Rozpoznasz granice prawne i bezpieczeństwa pracy agenta w przeglądarce
  • Wygenerujesz animację z parametrami, które poprawisz bez przeróbki całości

Moduł C

Integracje i aplikacja desktop - agent, który sam sięga po kontekst

Trzy rzeczy, które zmieniają aplikację desktop w narzędzie pracy: agent sam decyduje, z których podłączonych narzędzi skorzystać, potrafi obsłużyć przeglądarkę obok rozmowy i wygenerować edytowalną grafikę ruchomą.

Jeden brief, wiele narzędzi - bez konfigurowania po drodze

Kiedyś trzeba było powiedzieć: „wejdź do kalendarza”, potem „teraz do maila”, potem „teraz do notatek”. Dziś podłączasz narzędzia raz, a w promptcie opisujesz rezultat. Agent sam decyduje, gdzie zajrzeć - i to on składa z tego jeden materiał.

Kalendarz

kto, kiedy, o czym

Poczta

historia ustaleń i obietnic

Notatki ze spotkań

co padło ostatnim razem

Dysk

oferty, umowy, cenniki

Dla zaawansowanych: przykładowy prompt +
Przygotuj mnie na jutro.

REZULTAT: prezentacja - jeden slajd na spotkanie z jutrzejszego kalendarza.
Na slajdzie: firma i uczestnicy, o czym rozmawialiśmy ostatnio, otwarte
ustalenia z terminami, dokumenty których dotyczy rozmowa, 3 pytania
do zadania, jedno ryzyko.

ŹRÓDŁA: sam zdecyduj, z których podłączonych narzędzi skorzystać.
Jeśli czegoś nie znajdziesz, napisz „brak danych” zamiast zgadywać.

OGRANICZENIA: niczego nie wysyłaj, nie zmieniaj wpisów w kalendarzu,
nie otwieraj dokumentów spoza mojego dysku firmowego.

NA KOŃCU: wypisz, z których źródeł faktycznie skorzystałeś.

Ostatnie zdanie promptu - „wypisz, z których źródeł skorzystałeś” - to najtańsze QA, jakie znam. Bez niego nie odróżnisz danych z Waszej skrzynki od tego, co model dopowiedział.

Dostępność zależy od planu, regionu, workspace i konfiguracji administratora.

Przeglądarka wbudowana w aplikację

Część stron nie ma API, a dane pojawiają się dopiero po kliknięciu. Wbudowana przeglądarka pozwala agentowi przejść tę ścieżkę tak jak człowiek: kliknąć, przewinąć, poczekać na doładowanie i odczytać to, co się pokazało.

Nawigacja obok Ciebie

Przeglądarka otwiera się w panelu obok rozmowy. Widzisz, w co agent klika, i możesz przerwać w połowie - to nie jest czarna skrzynka.

Sesje i logowanie

Karty potrafią zachować sesję, więc agent nie loguje się od nowa przy każdym kroku. To samo, co daje wygodę, jest największym ryzykiem - loguj się tylko tam, gdzie świadomie chcesz dać dostęp.

Wiele kart naraz

Agent trzyma kilka stron otwartych i buduje z nich jedno zestawienie - porównanie ofert, cenników albo specyfikacji z linkiem do każdej pozycji.

Testy własnego serwisu

Przejście ścieżki użytkownika krok po kroku: formularz, koszyk, rejestracja. Agent opisuje, co się zepsuło, w którym kroku i przy jakich danych.

Przykład: automatyczny test formularza

Dla zaawansowanych: przykładowy prompt +
CEL: sprawdź, czy formularz kontaktowy na [URL] działa poprawnie.

PRZEJDŹ ŚCIEŻKĘ: strona główna → kontakt → wypełnienie formularza danymi
testowymi ([IMIĘ TESTOWE], [MAIL TESTOWY]) → wysyłka.

SPRAWDŹ przy okazji: walidację pustych pól, walidację błędnego adresu mail,
komunikat po wysłaniu, czas ładowania każdego kroku, widok na telefonie.

REZULTAT: tabela kroków - co zrobiłeś, czego oczekiwano, co się stało,
zrzut ekranu przy każdej różnicy. Na końcu lista błędów uszeregowana
według wpływu na użytkownika.

OGRANICZENIA: tylko nasza domena, dane wyłącznie testowe, nie loguj się
na konta produkcyjne, nie wysyłaj formularza więcej niż raz.

Zanim wypuścisz agenta na strony

  • Zgoda właściciela serwisu - testujesz tylko to, co należy do Was albo na co macie pisemną zgodę.
  • Regulamin strony i robots.txt obowiązują agenta tak samo jak człowieka.
  • Nie omijaj logowania, paywalla ani captcha - jeśli strona ich broni, to jest odpowiedź na pytanie „czy wolno”.
  • Dane osobowe zebrane ze stron podlegają RODO dokładnie tak, jakbyś przepisał je ręcznie.
  • Do testów używaj kont testowych, nie produkcyjnych - agent czasem kliknie „usuń”.

Każda akcja poza czatem

  1. READagent czyta
  2. DRAFTprzygotowuje draft
  3. REVIEWTy sprawdzasz
  4. APPROVETy akceptujesz
  5. WRITE / SENDdopiero teraz zapis lub wysyłka

@remotion - grafika ruchoma, którą da się poprawić

Komenda @remotion generuje animację opisaną kodem, a nie gotowy plik wideo bez możliwości zmiany. W panelu bocznym masz odtwarzacz z podglądem, a parametry - czasy, kolory, teksty - poprawiasz bezpośrednio i renderujesz ponownie.

Animacja to kod

Ruch jest opisany programowo, więc da się go zmienić słowem, a nie myszką po osi czasu.

Podgląd obok

Odtwarzacz w panelu bocznym pokazuje efekt na bieżąco - przewijasz do klatki i widzisz, co poprawić.

Parametry, nie przeróbki

Zmieniasz czas trwania sceny, kolor albo tekst i renderujesz od nowa. Nie zaczynasz projektu od zera.

Powtarzalny szablon

Ta sama animacja z podmienionymi danymi to gotowy szablon na serię materiałów - odcinki, oferty, karty produktów.

Dla zaawansowanych: przykładowy prompt +
@remotion

CEL: 20-sekundowa animacja otwierająca webinar „[TYTUŁ]”.

SCENY:
1) 0-4 s: logo wjeżdża od dołu, podpis „[FIRMA]”,
2) 4-12 s: trzy punkty agendy pojawiają się kolejno, jeden pod drugim,
3) 12-20 s: data, godzina i adres rejestracji, na końcu statyczna plansza.

STYL: kolory [HEX 1] i [HEX 2], krój bezszeryfowy, spokojne przejścia,
bez efektów dźwiękowych. Format 1920x1080, 30 klatek na sekundę.

WAŻNE: parametry tekstów i kolorów wystaw jako zmienne, żebym mógł
zmienić treść bez przerabiania animacji.

Uwaga na prawa: logo, krój pisma, muzyka i zdjęcia wymagają licencji tak samo jak w każdym innym programie. To, że animację złożył agent, nie zmienia niczego po stronie prawnej.

Mój postęp

Sprawdź, czy rozumiesz

Agent twierdzi, że przycisk działa. Jaki dowód jest przydatny?

To samoocena. Zaznacz lekcję jako ukończoną po wykonaniu ćwiczenia i sprawdzeniu wyniku.

Zrób to teraz

Zleć test jednej ścieżki na własnej stronie: wejście, wybór opcji, oczekiwany wynik. Poproś o dowód każdego kroku oraz opis błędów. Nie wysyłaj testowych formularzy do prawdziwych klientów.

Status lekcji
W trakcie — przewinięto 0% strony
Następna