MCP dla projektantów: łączenie Figma, tokenów i kodu z Claude i Cursor

Krótko mówiąc, czym jest MCP

Oficjalna dokumentacja MCP opisuje go jako standard typu open source do łączenia aplikacji AI z systemami zewnętrznymi, takimi jak pliki, bazy danych i narzędzia. Jednym z własnych przykładów jest Claude Code generujący całą aplikację internetową na podstawie projektu Figma. Dla projektanta ważne jest to, że sztuczna inteligencja nie musi już zgadywać, jak wygląda Twój projekt. Może zadać pytanie bezpośrednio narzędziu projektowemu.

Narzędzia do projektowania z serwerami MCP już dziś

Stan na październik 2026 r.:

• Figma: serwer MCP, który zapewnia agentom kontekst projektowy (zmienne, komponenty, układ) do generowania kodu i może zapisywać natywną treść z powrotem na kanwie. Figma wymienia go w planach Starter i płatnych; pisanie na płótnie jest bezpłatne w fazie beta.
• Penpot: darmowy, otwarty serwer MCP, który współpracuje z dowolnym klientem MCP, w tym Claude, Cursor, VS Code i OpenAI Codex, i może być hostowany samodzielnie.
• ExodeUI (my to robimy): serwer MCP, który pozwala narzędziom do kodowania AI tworzyć i edytować interaktywne animacje ze stanami i fizyką sprężyn.
• Projektuj tokeny: jeśli Twoje tokeny znajdują się w repozytorium jako JSON, narzędzie do kodowania AI może już je odczytać jako pliki; serwer dedykowany jest potrzebny tylko dla tokenów przechowywanych w narzędziu.

Jak projektanci faktycznie z tego korzystają

Najpopularniejsze przepływy pracy są raczej praktyczne niż magiczne. Programiści wybierają ramkę i proszą sztuczną inteligencję o zaimplementowanie jej w istniejącej bibliotece komponentów. Projektanci proszą sztuczną inteligencję o sprawdzenie, czy zakodowany ekran pasuje do projektu i wyświetla listę różnic. Zespoły proszą sztuczną inteligencję o aktualizację tokenów komponentu w bazie kodu. Coraz częściej projektanci wykorzystują sztuczną inteligencję do tworzenia wariantów bezpośrednio na płótnie, a następnie udoskonalania ich ręcznie.

Podłączanie serwera

Claude Code dodaje serwery za pomocą polecenia claude mcp add lub poprzez plik .mcp.json w projekcie i obsługuje zarówno zdalne serwery HTTP, jak i lokalne. Cursor zarządza serwerami MCP w swoich ustawieniach i obsługuje serwery lokalne (stdio) i zdalne. Serwery zdalne zwykle proszą Cię o jednokrotne zalogowanie się przy użyciu protokołu OAuth. Każdy dostawca dokumentuje dokładne polecenie lub adres URL swojego serwera.

Na co uważać

MCP daje narzędziom AI realny dostęp, więc traktuj to jak każdą integrację:

• Uprawnienia: agent, który może zapisywać na kanwie lub w repozytorium, również może popełniać błędy. Korzystaj z historii wersji i przeglądaj zmiany.
• Prywatność: sprawdź, dokąd trafiają dane projektowe i czy Twój plan na to pozwala.
• Koszt: niektóre funkcje zapisu są bezpłatne w wersji beta i planuje się je uzależnić od użytkowania.
• Jakość: wyniki AI są zgodne z systemem projektowym tylko wtedy, gdy system jest dobrze zorganizowany, zawiera nazwane komponenty i tokeny.