Miro Prototypes

Kto może to zrobić: Wszyscy członkowie z dodatkiem Miro Prototypes
Jakie abonamenty: Starter, Business, Enterprise
Jakie platformy: Przeglądarka, Desktop

Miro Prototypes umożliwia tworzenie interfejsów użytkownika bezpośrednio na planszy Miro. 

Możesz generować jedno- i wieloekranowe przepływy, dopracowywać swoje projekty i stosować style, a także podglądać interaktywną symulację swojego prototypu. Buduj swój projekt w wielu, określonych promptach, które generują każdy element Twojego prototypu. Możesz także dopracowywać swoje prompty, aby uniknąć zaczynania od nowa.

Ten artykuł wyjaśnia, jak korzystać z funkcji Miro Prototypes. Aby uzyskać ogólne informacje o Miro Prototypes, zobacz przegląd Miro Prototypes. 

UWAGA: Funkcja Prototypów została przeniesiona do współpracowników AI. Obecnie w publicznej wersji beta, niektórzy użytkownicy już mają zaktualizowane, wsparte na współpracownikach AI wprowadzanie prototypów generowanych przez AI. Jeśli Twoje doświadczenie nie odpowiada dokumentacji, zobacz Utwórz prototyp z pomocą współpracowników AI (wersja beta). Treść wyjaśniająca, jak udoskonalać i iterować swoje wyniki, jest nadal aktualna.

Więcej informacji: Zobacz FAQ.

Utwórz prototyp z pomocą Miro AI

Ta sekcja opisuje, jak zacząć prototypowanie z Miro AI. Aby dowiedzieć się, jak rozpocząć ręcznie, zobacz biblioteka prototypowania.

Zacznij od zera

1. Na planszy Miro, nad Paskiem tworzenia kliknij Sidekicks.
   Otwiera się panel Sidekick.
2. Kliknij bibliotekę współpracowników AI.
   Uzyskaj dostęp do prototypu w bibliotece współpracowników AI 
3. Kliknij Formaty > Protoyp.
4. Określ, czy chcesz rozpocząć od promptu tekstowego czy zrzutu ekranu.
5. Określ typ urządzenia.
6. Określ, czy ma to być prototyp jedno- czy wieloekranowy.
7. Postępuj zgodnie ze wskazówkami ekranowymi, aby napisać prompt lub przesłać zrzut ekranu. W polu odpowiedzi możesz opcjonalnie użyć tagów sugestii, aby rozpocząć swój prompt.
8. Zakończ pisanie promptu, a następnie kliknij strzałkę Wyślij lub naciśnij ENTER na klawiaturze.
   Miro AI generuje wstępny prototyp na planszy.
9. (Opcjonalnie) Aby zatrzymać generowanie, kliknij na swoim prototypie Stop.
10. (Opcjonalnie) Aby iterować swój prototyp, kontynuuj używanie promptów w panelu Prototype.
    Każda iteracja tworzy wersję Twojego wstępnego prototypu.
11. Na swoim szkicu prototypu wybierz jedną z poniższych opcji:
    • Zastosuj na planszy
      Twój prototyp jest teraz edytowalny na planszy.
    • Odrzuć wszystkie
      Twój szkic został usunięty z planszy. Możesz poprawić swój prompt i powtórzyć kroki 7–9.

Tworzenie prototypu ze współpracownikiem AI (wersja beta)

Niektórzy użytkownicy mogą już mieć zaktualizowane dane wejściowe współpracowników AI do prototypowania. Ta sekcja opisuje, jak rozpocząć prototypowanie ze współpracownikiem AI. Aby dowiedzieć się, jak rozpocząć ręcznie, zobacz Biblioteka prototypów.

WSKAZÓWKA: Stwórz swój prototyp z użyciem współpracowników AI, aby włączyć historię czatu AI, która przypomina Twoje prompty, pozwalając Ci na przegląd opcji, które wcześniej eksplorowałeś, oraz na kontynuowanie pracy na każdej tablicy. Więcej informacji znajdziesz w artykułach Współpracownicy AI rozwijają tworzenie AI w Miro, oraz Przegląd prototypów Miro.

UWAGA: Aktualizacja współpracowników AI dla prototypów jest obecnie w wersji beta. Jeśli Twoje doświadczenia nie pokrywają się z dokumentacją w tej sekcji, zobacz Tworzenie prototypu z Miro AI.

Postępuj zgodnie z tymi krokami:

1. Na planszy Miro, powyżej paska tworzenia, kliknij współpracownik AI.
   Otworzy się panel Sidekicks.

2. W polu prompta kliknij Utwórz prototyp.
   Współpracownik AI gotowy jest do pomocy przy tworzeniu Twojego prototypu.
   Rozpocznij tworzenie prototypu w panelu Współpracownika AI.

   PORADA: Możesz również otworzyć panel Współpracownika AI i od razu zacząć wpisywać komendy. Upewnij się, że wyraźnie zaznaczasz chęć stworzenia prototypu, np. "Utwórz prototyp dla przepływu kasowego".

   PORADA: Możesz również uzyskać dostęp do formatu prototypu z poziomu Narzędzia, Media i Integracje (+) na pasku tworzenia.

3. Napisz swój prompt, aby opisać prototyp, który chcesz, by współpracownik AI wygenerował. 
4. Kliknij strzałkę w górę lub naciśnij ENTER na klawiaturze.
5. (Opcjonalnie) Aby zatrzymać generowanie, kliknij Zatrzymaj na swoim prototypie.
6. (Opcjonalnie) Aby iterować nad prototypem, kontynuuj stosowanie promptów w panelu Prototyp.
   Każda iteracja tworzy wersję roboczego prototypu.
7. Na swoim roboczym prototypie wybierz jedną z opcji:
   • Zastosuj na planszy
     Twój prototyp jest teraz edytowalny na planszy.
   • Odrzuć wszystko
     Twój szkic został usunięty z planszy. Możesz doprecyzować swój prompt i powtórzyć kroki 3-6.

Wskazówka: Zacznij od małej liczby elementów i bądź szczegółowy. Mniejsza liczba generowanych ekranów daje bardziej precyzyjne wyniki w krótszym czasie. Wyraźnie określ kluczowe elementy, jakie chcesz mieć na każdym ekranie, jak przyciski, sekcje czy działania.

Wskazówka: Zastosuj kilka wersji prototypów na planszy. Możesz porównywać i eksplorować decyzje projektowe oraz nadal dopracowywać najlepszą opcję.

Wskazówka: Wygenerowanie prototypu może zająć 1–3 minuty, w zależności od złożoności promptu i wielkości treści. Jeśli generowanie prototypu zajmuje dłużej, uprość prompt lub zmniejsz liczbę ekranów.

Wskazówka: Możesz dołączyć URL w swoim promptcie i polecić współpracownikowi AI, aby zastosował style z podlinkowanej strony.

Użyj planszy jako promptu

Wybierz treść na planszy, którą chcesz wykorzystać w promptcie. Na przykład, masz specyfikację projektu w Dokumencie lub na karteczkach. Prototypy mogą użyć tej treści jako kontekstu do stworzenia Twojego prototypu. 

Postępuj zgodnie z tymi krokami:

Kliknij Biblioteka współpracowników AI
Uzyskaj dostęp do prototypu w Bibliotece współpracowników AI 

Wskazówka: Możesz nakłonić Miro AI do użycia konkretnych obiektów na planszy, zaznaczając je. Na przykład w promcie możesz powiedzieć "Użyj zrzutów ekranu na planszy jako przewodników do budowy prototypu." Jeśli na planszy masz wiele podobnych obiektów, dokładnie opisz, które obiekty chcesz, aby Miro AI użył.

Iteracja prototypu

Twój pierwszy projekt może nie być idealnym wynikiem. Zanim zastosujesz projekt na planszy, możesz kontynuować jego iterację i stworzyć wiele wersji twojego prototypu.

1. Utwórz prototyp za pomocą Miro AI. Nie stosuj na planszy.
   Kolejny krok w panelu Prototypu to Co chcesz zrobić dalej?
2. Wybierz Edytuj prototyp. 
3. W przypadku przepływu wieloekranowego, wybierz ekran, który chcesz iterować.
4. W polu odpowiedzi opisz, jakie zmiany chcesz wprowadzić.
5. Kliknij strzałkę w górę lub naciśnij Enter na klawiaturze.
   Miro generuje nową wersję Twojego prototypu.

UWAGA: Edycje można przeprowadzać tylko na jednym ekranie naraz.

Wskazówka: Użyj kontekstu planszy. Wybierz dokumenty, diagramy, karteczki lub inne treści na tablicy, aby utworzyć prompt dla Miro AI.

Iteracja z użyciem zrzutu ekranu jako kontekstu wizualnego

Zanim zastosujesz swój prototyp na planszy, możesz użyć zrzutu ekranu lub innego prototypu już umieszczonego na planszy jako kontekstu do iteracji swojego projektu.

1. Utwórz prototyp za pomocą Miro AI. Nie stosuj na planszy.
   Kolejnym krokiem w panelu Prototyp jest Co chcesz zrobić dalej?
2. Kliknij Edytuj prototyp.
3. Dla przepływu wieloekranowego wybierz ekran, który chcesz iterować.
4. Wybierz zrzut ekranu na tablicy.
5. W polu odpowiedzi opisz zmiany, które chcesz wprowadzić na podstawie wybranego zrzutu ekranu.
6. Kliknij strzałkę w górę lub naciśnij Enter na klawiaturze.
   Miro generuje nową wersję twojego prototypu. 

WSKAZÓWKA: Możesz użyć istniejących ekranów prototypów umieszczonych już na tablicy jako kontekstu wizualnego. Utwórz i zastosuj prototyp na tablicy. Wybierz ekran.

Edycja z pomocą AI

Dla każdego prototypu już zastosowanego na planszy, możesz dalej iterować za pomocą Edycji z pomocą AI. Użyj Edycji z pomocą AI, aby dopracować zamiast przebudowywać, na przykład jeśli chcesz stworzyć wersję ciemną istniejącego prototypu.

Postępuj zgodnie z tymi krokami:

1. Dla dowolnego prototypu umieszczonego na planszy, w menu kontekstowym kliknij Edit with AI.
   Otworzy się panel współpracownika AI.
   Edit with AI umożliwia Ci wprowadzenie poprawek do istniejącego prototypu.

   UWAGA: Możesz używać Edit with AI i współpracownika AI z jednym prototypem na raz. Aby zmienić, zamknij panel współpracownika AI i ponownie otwórz Edit with AI z wybranego prototypu.

2. W polu prompt opisz zmiany, które chcesz wprowadzić. Na przykład, "Zmień na ciemny motyw".
3. Aby wykonać prompt, kliknij przycisk ze strzałką w górę lub naciśnij ENTER na klawiaturze.
   Współpracownik AI wygeneruje ulepszony prototyp.
4. (Opcjonalnie) Kontynuuj wprowadzanie promptów do współpracownika AI i iteruj na swoim prototypie. Możesz wybrać wersję przed zastosowaniem prototypu na planszy.
5. Nad szkicem prototypu kliknij Dodaj do planszy.

UWAGA: Dla Miro Prototypes, wszystkie funkcje prototypowania wspomagane przez AI są dostępne tylko z dodatkiem Prototypes.

Zastosowanie stylów prototypu z URL

Aby zastosować styl z istniejącego URL do swojego prototypu:

1. Utwórz prototyp.
2. Wybierz ekrany swojego prototypu.
   Pojawia się menu kontekstowe.
3. W menu kontekstowym kliknij Edytuj z AI, aby otworzyć panel Współpracownik AI.
4. W polu prompt poproś Współpracownika AI o zastosowanie stylu z dołączonego URL (pamiętaj, aby uwzględnić pełny adres URL).
5. Współpracownik AI zastosuje wizualny styl z URL w zaktualizowanej wersji Twojego prototypu na tablicy.

Zastosuj style prototypu ze zrzutu ekranu

Jeśli chcesz, aby Twój prototyp odpowiadał istniejącej stronie internetowej lub produktowi, możesz wyodrębnić style ze zrzutu ekranu i zastosować je na swoich ekranach.

1. Utwórz prototyp.
2. Wybierz ekran(y) swojego prototypu.
   Pojawia się menu kontekstowe.
3. Kliknij ikonę Miro AI w menu kontekstowym.
4. Wybierz Importuj styl z obrazu.
   Importuj style i zastosuj je w swoim prototypie
5. Wybierz plik obrazu, z którego chcesz zaimportować styl.
6. Style są stosowane w twoim prototypie.

Wskazówka: Zastosuj style na początku lub na końcu. Aby zapewnić spójność wszystkich elementów w Twoim prototypie z motywem, zaimplementuj motyw na wczesnym etapie projektowania prototypu lub jako ostateczny krok.

Konwertuj zrzuty ekranu na prototypy, które można edytować

Możesz przekształcić zrzut ekranu projektu lub interfejsu użytkownika konkurencyjnych rozwiązań w edytowalny prototyp.

1. Dodaj zrzut ekranu do swojej tablicy Miro.
2. Kliknij obraz, aby otworzyć menu kontekstowe.
3. Kliknij przycisk Konwertuj na, a następnie wybierz Prototyp.
4. W podmenu wybierz typ urządzenia (Mobilne, Tablet, Komputer, Własne).
5. AI odbuduje to jako edytowalny prototyp — tekst, przyciski, układ i inne elementy.
6. Teraz możesz modyfikować, dodawać lub edytować tę wersję według potrzeb.

WSKAZÓWKA: Przekształć zrzut ekranu w edytowalną makietę. Następnie zainicjuj edycję za pomocą Miro AI. Możesz też użyć zrzutu ekranu jako kontekstu w swoim prompt, aby wygenerować prototyp. Aby użyć kilku zrzutów ekranu, zaznacz wszystkie i skopiuj jako obraz. Następnie użyj obrazu jako kontekstu w prompt.

Wybierz wersję prototypu

Każde udoskonalenie tworzy wersję prototypu. Podczas udoskonalania prototypu, selektor wersji znajduje się nad szkicem prototypu. 

Kliknij strzałki, aby przełączać się między wersjami. Po wybraniu wersji, kliknij Dodaj do planszy. Wybrana wersja zostanie zastosowana na planszy.

Wybierz, które poprawki lub wersję swojego prototypu dodać do planszy.

WSKAZÓWKA: Zanim klikniesz Dodaj do planszy, możesz wybrać ekran z dowolnej wersji, a następnie skopiować i wkleić go na planszę. Dzięki temu możesz zachować ekran z wersji, którą może zechcesz usunąć. 

OSTRZEŻENIE: Po kliknięciu Dodaj do planszy, wszystkie inne wersje nie będą mogły zostać odzyskane.

Podgląd prototypu

W menu kontekstowym prototypu kliknij Podgląd. Załaduje się podgląd.

Wskazówka: Aby uzyskać w pełni interaktywny podgląd prototypu, używaj linii łączących między ekranami.

Dodawanie linii łączących, aby prototyp był interaktywny

Aby dodać lub zmienić połączenia między obiektami w prototypie Miro:

1. Kliknij element (na przykład przycisk) w prototypie.
2. Przeciągnij ikonę linii łączącej do ekranu, z którym ma się połączyć.
3. W trybie Podgląd kliknięcie elementu przeniesie użytkowników do powiązanego ekranu.

Ukrywanie linii łączących

Dla prototypów z wieloma połączeniami, aby uprościć widok prototypu, możesz ukryć połączenia.

W trybie planszy wybierz swój prototyp. Z menu kontekstowego kliknij trzy kropki. Następnie wybierz Ukryj łączniki.

W trybie skupienia, w lewym górnym rogu kliknij przycisk Ukryj | Pokaż łączniki.

Ukryj lub pokaż łączniki w trybie skupienia.

Powtórz te same kroki, aby pokazać łączniki.

Wskazówka: Użyj skrótów klawiszowych, aby ukryć lub pokazać łączniki. Na klawiaturze naciśnij Shift + E. W trybie planszy, aby używać skrótów klawiszowych, upewnij się, że zaznaczasz swój prototyp.

Tryb skupienia

Miro Prototypes obejmuje tryb skupienia. Wejdź w tryb skupienia, aby pracować nad swoim prototypem bez żadnych innych treści na tablicy widocznych wokół, co pozwala pracować bez rozpraszania uwagi.

Aby wejść w tryb skupienia, wybierz swoje Miro Prototype. W menu kontekstowym kliknij Tryb skupienia.

Tryb skupienia umożliwia działanie bez zakłóceń z Miro Prototypes.

Kopiuj do Figmy

Udostępnij swój prototyp projektantom w Figmie bez konieczności ręcznego odtwarzania go. Możesz skopiować cały prototyp lub poszczególne ekrany.

Kopiuj prototyp do Figmy

1. Kliknij ramkę prototypu.
   Pojawia się menu kontekstowe Format.
2. W menu kontekstowym kliknij pionowe trzy kropki, aby otworzyć menu Więcej.
3. Kliknij Kopiuj do Figma.
   Miro kopiuje Twój prototyp do schowka.
   Skopiuj swój prototyp do Figma. 
4. W Figma wklej swój prototyp. Możesz użyć skrótów klawiaturowych (Windows) Ctrl + V lub (MacOS) Command + V.
   Twój prototyp wkleja się w Figma.

Kopiowanie ekranu prototypu do Figma

1. Kliknij, aby wybrać ekran prototypu.
   Pojawia się menu kontekstowe widgetu.
2. W menu kontekstowym kliknij pionowe trzy kropki, aby otworzyć menu Więcej.
3. Kliknij Kopiuj do Figma.
   Miro kopiuje Twój ekran prototypu do schowka.
4. W Figma wklej swój prototyp. Możesz użyć skrótów (Windows) Ctrl + V lub (MacOS) Command + V.
   Twój ekran prototypu wkleja się w Figma.

Udostępnij link do swojego prototypu (wersja beta)

Możesz skopiować unikalny link, aby udostępnić go członkom zespołu lub zewnętrznym stakeholderom bez konta Miro. 

1. Z menu kontekstowego prototypu kliknij pionowe trzy kropki, aby otworzyć menu Więcej.
2. Kliknij Udostępnij i eksportuj > Udostępnij prototyp.
   Otworzy się modalne okno Udostępnij prototyp.
3. Kliknij Skopiuj link.
4. (Opcjonalnie) Kliknij Podgląd w przeglądarce, aby zobaczyć, jak Twój prototyp wyświetlany jest dla osoby posiadającej link.
5. Udostępnij swój link.

UWAGA: Aby zewnętrzni użytkownicy mogli uzyskać dostęp, Twoja tablica musi być publiczna. Zewnętrzni użytkownicy mogą uzyskać dostęp do prototypu tylko w trybie skupienia i nie mają dostępu do innych treści na planszy. Mogą jednak wchodzić w interakcje z punktami aktywnymi i przepływem prototypu. Jeśli uprawnienia tablicy na to pozwalają, zewnętrzni użytkownicy mogą również dodawać komentowanie.

Wskazówka: Możesz również skopiować udostępniany link w trybie skupienia: w prawym górnym rogu kliknij trzy kropki. Następnie kliknij Udostępnij prototyp. Oraz w trybie podglądu: w prawym górnym rogu kliknij Udostępnij prototyp.

Eksportuj swój prototyp

Możesz eksportować swój prototyp jako SVG. Możesz także użyć Serwera Protokołu Kontekstu Modelu (MCP) firmy Miro, aby eksportować do baz kodu AI; zespoły mogą wykorzystać eksport do generowania działającego kodu i przyspieszenia rozwoju.

Eksportuj do SVG

1. W menu kontekstowym prototypu kliknij pionowe trzy kropki.
2. Kliknij Udostępnij i eksportuj > Eksportuj jako obraz.
   Otwiera się okno wyboru i modalne Eksportuj obraz jako.
3. Dostosuj okno wyboru, aby objęło cały prototyp.
4. W modalnym Eksportuj obraz jako wybierz Wektor – SVG.
5. Kliknij Eksportuj. 

PORADA: Możesz eksportować pojedynczy ekran jako SVG z menu kontekstowego. Wybierz ekran w swoim prototypie. Z menu kontekstowego kliknij trzy pionowe kropki, a następnie Eksportuj jako obraz. Otworzy się okno Eksportuj jako obraz, następnie wybierz Wektor – SVG.

UWAGA: W przypadku eksportu SVG z prototypów z obrazami, jeśli importujesz SVG do innego oprogramowania do edycji, jak Figma, obrazy są zastępowane zastępczymi symbolami.

Eksport z Miro MCP Server

Aby wyeksportować swój prototyp do edytora baz kodu AI, na przykład Cursor, dołącz w swoim prompecie URL tablicy z ID tablicy. Upewnij się, że dostarczasz instrukcje do generowania kodu na podstawie prototypu.

Aby dowiedzieć się więcej o korzystaniu z Miro MCP, zobacz przegląd Miro MCP Server.

Edytor bazy kodu taki jak Cursor akceptuje adres URL tablicy Miro z identyfikatorem tablicy, aby generować kod na podstawie prototypu.

FAQ