AI i MCP

Serwer MCP do projektowania, w którym płótno to HTML

Narzędzia do projektowania wpuszczają dziś agentów AI przez MCP. To, co agent może zrobić, zależy od tego, z czego zrobione jest płótno. Gdy jest z HTML, agent sam pisze stronę.

Baurice Ley · 6 min czytania · Fakty sprawdzone 9 paź 2026

Co serwer MCP daje narzędziu do projektowania

MCP, czyli Model Context Protocol, to standardowy sposób, w jaki agent AI korzysta z narzędzi innej aplikacji. Narzędzie do projektowania z serwerem MCP pozwala twojemu agentowi odczytać plik, zmienić go albo zamienić w kod, prosto z edytora kodu lub czatu.

Jak działa serwer MCP Figmy

Według centrum pomocy Figmy jej serwer MCP przekazuje agentom kontekst projektu, zmienne, komponenty i dane o układzie, a także potrafi generować kod z zaznaczonych ramek. Agenci mogą też tworzyć i modyfikować natywną zawartość Figmy przez zdalny serwer. Ten dostęp do zapisu jest darmowy w czasie bety, a Figma zapowiada, że stanie się płatną funkcją rozliczaną za użycie.

Zdalny serwer jest dostępny we wszystkich planach. Serwer desktopowy wymaga stanowiska Dev lub Full w płatnym planie.

Najważniejsze: agent pracuje na projekcie wektorowym. Zrobienie z niego strony internetowej to wciąż osobny etap tłumaczenia.

Co się zmienia, gdy płótno to HTML

W Kalce każda warstwa to element HTML, a każdy styl to CSS. Agent nie opisuje więc projektu, który ktoś potem odtworzy. Pisze stronę, a ty widzisz ją na płótnie jako warstwy, które możesz zaznaczać i edytować ręcznie.

// Narzędzia planowane w serwerze MCP Kalki
get_tree odczytuje warstwy strony jako HTML
write_html dodaje lub podmienia sekcję strony
update_styles zmienia CSS dowolnej warstwy
get_screenshot ogląda efekt, tak jak zrobiłby to projektant
export oddaje pliki

Trzy rzeczy, które robią różnicę

  • Lokalnie, bez limitu użycia. Serwer działa razem z aplikacją desktopową na twoim komputerze. Bez limitu wywołań narzędzi, bez zakładania konta.
  • Dowolny agent. Jeśli twój agent obsługuje MCP, może pracować w Kalce. Nie jesteś przywiązany do jednego modelu.
  • Nic do konwersji. To, co napisze agent, trafia na produkcję: HTML i CSS w folderze, który należy do ciebie.

Przykład

Prosisz: „Dodaj sekcję z cennikiem, trzy plany, w tym samym stylu co hero.” Agent odczytuje stronę przez get_tree, pisze section.pricing przez write_html, sprawdza efekt przez get_screenshot, a ty ręcznie poprawiasz zaokrąglenie i kolor w panelu projektu. Bez eksportu, bez przekazywania projektu.

Kalka jest w fazie rozwoju i jest open source. Powyższa lista narzędzi pochodzi z naszej specyfikacji produktu i może się zmienić przed premierą.