Przejdź do głównej treści
Screenshot 2026 05 06 At 14 19 49
Kiedy chcesz udostępnić lub przekazać projekt, Flowstep pozwala eksportować go jako obraz statyczny — JPG lub PNG. Oba formaty są szeroko wspierane przez narzędzia projektowe, oprogramowanie do prezentacji i przeglądarki, dlatego możesz przenosić swoje projekty wygenerowane przez AI wszędzie tam, gdzie ich potrzebujesz.

Jak wyeksportować projekt

1

Otwórz projekt

Przejdź do projektu, który chcesz wyeksportować w Flowstep.
2

Otwórz menu eksportu

Zlokalizuj opcję eksportu na pasku narzędzi lub panelu projektowania. Wybierz ją, aby otworzyć ustawienia eksportu.
3

Wybierz format

Wybierz JPG lub PNG w zależności od Twojego przypadku użycia (patrz porównanie poniżej).
4

Pobierz plik

Potwierdź wybór i pobierz wyeksportowany obraz na urządzenie.
Screenshot 2026 05 06 At 14 19 39

JPG vs PNG: który format wybrać?

Jeśli wklejasz projekt do prezentacji lub wysyłasz szybki podgląd klientowi, JPG to zwykle właściwy wybór. Jeśli potrzebujesz ostrych krawędzi lub przezroczystego tła — na przykład, aby nałożyć projekt na inny obraz — użyj PNG.

Kod eksportu

Poza obrazami przycisk Code eksportuje projekt jako kod React + Tailwind — skopiuj fragment lub pobierz pełny pakiet jako ZIP. Możesz wyeksportować jeden ekran, kilka wybranych ekranów lub cały plik na raz. Gdy eksportujesz więcej niż jeden ekran, każdy staje się własnym plikiem komponentu, a wszelka nawigacja ustawiona między ekranami jest wbudowana w wygenerowany kod, dzięki czemu wyeksportowana aplikacja jest klikalnym końcem do końca. Pakiety są samodzielne: obrazy używane w projekcie (w tym te, które dołączyłeś w panelu czatu) są zawarte w folderze public/assets/ z kodem odwołującym się do nich za pomocą ścieżki lokalnej, więc eksport działa od razu. Pobrane pliki — zarówno obrazy, jak i pakiety kodu — noszą nazwę ekranu, do którego należą (przywracając do nazwy pliku, jeśli ekran nie ma nazwy), co ułatwia identyfikowanie eksportów podczas pracy z wieloma ekranami.

Wyślij projekty do agenta kodującego

Zamiast pobierać plik, możesz przekazać projekt bezpośrednio asystentowi kodującemu AI. Kliknij Send to your coding agent na pasku narzędzi — lub otwórz dialog eksportu i wybierz tę samą opcję — aby skopiować gotowy prompt do wklejenia dla agenta:
Twój agent odczytuje te ekrany przez MCP i buduje je w Twoim repozytorium. Wklej ten prompt do Claude, Cursor lub preferowanego agenta.
Prompt informuje agenta, aby pobrał ekrany przez serwer Flowstep MCP i przebudował je w bazie kodu. Możesz przekazać jeden ekran, kilka wybranych ekranów lub cały plik na raz — prompt dostosowuje się do tego, co wybrałeś. Używa to serwera Flowstep MCP, dlatego najpierw połącz klienta MCP. Patrz przegląd serwera MCP dla obsługiwanych klientów i Quickstart aby połączyć jednego.
Jeśli potrzebujesz przenieść projekt do przepływu pracy edycji wektorowej, skopiuj go bezpośrednio do Figma. Patrz Skopiuj projekty Flowstep do Figma natychmiast.