Toolverse
Wszystkie skille

penpot-uiux-design

autor: github

Projektuj interfejsy w Penpot z pomocą AI — od layoutów po systemy designu

Instalacja

Wybierz klienta i sklonuj repozytorium do odpowiedniego katalogu skilli.

Instalacja

Szybkie info

Autor
github
Kategoria
UX / Design
Wyświetlenia
88

O skillu

Umiejętność do tworzenia profesjonalnych projektów UI/UX w Penpot. Projektuj interfejsy dla aplikacji webowych, mobilnych i desktopowych, buduj systemy designu z komponentami, twórz dashboardy i formularze, a także stosuj standardy dostępności. Skill integruje się z narzędziami MCP Penpota — możesz uruchamiać kod JavaScript, eksportować kształty jako PNG/SVG, importować grafiki i przeglądać dokumentację API. Idealny do projektowania landing pages, nawigacji, oraz recenzji i ulepszania istniejących projektów pod kątem użyteczności.

Jak używać

  1. Sprawdź, czy serwer MCP Penpota jest już uruchomiony — spróbuj użyć narzędzia penpot_api_info. Jeśli się powiedzie, serwer jest gotowy i możesz przejść do kroku 3. Jeśli nie, przejdź do kroku 2.

  2. Zainstaluj i uruchom serwer penpot/penpot-mcp lokalnie. Szczegółowe instrukcje znajdują się w dokumentacji setup-troubleshooting.md dołączonej do skill'a. Upewnij się, że serwer działa i jest dostępny przed kontynuowaniem.

  3. Opisz projekt, który chcesz stworzyć — na przykład "zaprojektuj dashboard do monitorowania sprzedaży", "utwórz formularz rejestracji" lub "zbuduj system designu z komponentami". Skill obsługuje projekty dla web, mobilnych i desktopowych aplikacji.

  4. Skill będzie używać narzędzia execute_code do tworzenia i modyfikowania projektów bezpośrednio w Penpot poprzez kod JavaScript. Możesz prosić o konkretne elementy — layouty, komponenty, ikony czy zdjęcia.

  5. Jeśli chcesz zaimportować grafiki (ikony, loga, zdjęcia), skill użyje narzędzia import_image. Jeśli chcesz sprawdzić, jak wygląda projekt, narzędzie export_shape wyeksportuje elementy jako PNG lub SVG.

  6. Prosty przepływ: opisz potrzebę ("zaprojektuj landing page"), skill tworzy projekt w Penpot, eksportuje podgląd, a Ty możesz prosić o zmiany — dostosowanie kolorów, dodanie elementów, zmianę layoutu czy stosowanie wytycznych dostępności (WCAG) i standardów platformy (iOS, Android, Material Design).

Podobne skille