Miro Prototypes

Kto może to zrobić: Wszyscy członkowie z dodatkiem Miro Prototypes
Jakie abonamenty: Starter, Business, Enterprise
Na jakich platformach: 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, poprawiać swoje projekty i stosować style oraz przeglądać interaktywną symulację swojego prototypu. Twórz swoje projekty w wielu, konkretnych promptach, które generują każdy element twojego prototypu. Możesz również udoskonalać swoje prompty, aby uniknąć rozpoczynania 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 Prototypy została przeniesiona do współpracowników AI. Teraz w wersji publicznej beta, niektórzy użytkownicy mają już zaktualizowany interfejs wejściowy dla prototypów generowanych przez AI. Jeśli Twoje doświadczenie nie pokrywa się z dokumentacją, zobacz Tworzenie prototypu z współpracownikami AI (wersja beta). Treść wyjaśniająca, jak udoskonalać i iterować swoje wyniki, nadal jest aktualna.

Więcej informacji: Zobacz FAQ.

Utwórz prototyp za pomocą Miro AI

Ta sekcja opisuje, jak rozpocząć prototypowanie za pomocą Miro AI. Aby dowiedzieć się, jak rozpocząć ręcznie, zobacz biblioteka prototypów.

Zacznij od początku

1. Na planszy Miro, nad paskiem tworzenia kliknij Sidekicks.
   Otworzy się panel Sidekick.
2. Kliknij bibliotekę współpracowników AI.
   Dostęp do funkcji prototypu w bibliotece współpracowników AI
3. Kliknij Formaty > Prototyp.
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 jednookienkowy, czy wieloekranowy.
7. Postępuj zgodnie z instrukcjami na ekranie, aby napisać swój 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 Zatrzymaj na swoim prototypie.
10. (Opcjonalnie) Aby iterować swój prototyp, kontynuuj wpisywanie promptu w panelu Prototyp.
    Każda iteracja tworzy wersję twojego wstępnego prototypu.
11. Na swoim roboczym prototypie wybierz jedną z poniższych opcji:
    • Zastosuj na planszy
      Twój prototyp jest teraz edytowalny na planszy.
    • Odrzuć wszystko
      Twój szkic zostanie usunięty z planszy. Możesz poprawić swój prompt i powtórzyć kroki 7–9.

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

Niektórzy użytkownicy mogą już mieć zaktualizowane wejście współpracownika AI do prototypowania. Sekcja ta opisuje, jak zacząć prototypowanie z współpracownikiem AI. Aby dowiedzieć się, jak rozpocząć ręcznie, zobacz Biblioteka prototypów.

Wskazówka: Twórz prototypy z pomocą współpracownika AI, aby włączyć historię czatu, która przypomina Twoje prompty, co umożliwia przeglądanie wcześniej eksplorowanych opcji i kontynuowanie pracy na dowolnej tablicy. Aby uzyskać więcej informacji, zobacz Współpracownicy AI w Miro oraz Przegląd Miro Prototypes.

Uwaga: Aktualizacja współpracownika AI dla prototypów jest obecnie w publicznej wersji beta. Jeśli Twoje wrażenia nie pasują do dokumentacji w tej sekcji, zobacz Tworzenie prototypu za pomocą Miro AI.

Postępuj zgodnie z tymi krokami:

1. Na planszy Miro, nad paskiem Tworzenia kliknij Współpracownicy AI.
   Otworzy się panel Współpracowników AI.

2. W polu prompt kliknij Utwórz prototyp.
   Współpracownik AI jest gotowy, aby pomóc Ci w tworzeniu prototypu.
   Rozpocznij tworzenie prototypu w panelu współpracowników AI.

   Wskazówka: Alternatywnie możesz otworzyć panel współpracowników AI i od razu zacząć wpisywać prompt. Upewnij się, że wyraźnie określasz, że chcesz utworzyć prototyp, np. „Utwórz prototyp przepływu zakupowego.”

   Wskazówka: Format prototypu można również uzyskać z Narzędzi, Mediów i Integracji (+) na pasku tworzenia.

3. Napisz prompt opisujący prototyp, który ma wygenerować współpracownik AI. 
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 wprowadzić iteracje do swojego prototypu, kontynuuj uzupełnianie w panelu Prototyp.
   Każda iteracja tworzy wersję twojego szkicowego prototypu.
7. Na swoim prototypie roboczym wybierz jedną z opcji:
   • Zastosuj na planszy
     Twój prototyp jest teraz edytowalny na planszy.
   • Odrzuć wszystkie
     Twój szkic został usunięty z planszy. Możesz dopracować swój prompt i powtórzyć kroki 3–6.

WSKAZÓWKA: Zacznij od małych kroków i bądź konkretny. Generowanie mniejszej ilości ekranów na raz przynosi precyzyjniejsze wyniki w krótszym czasie. Wyraźnie wymień kluczowe elementy, które chcesz na każdym ekranie, takie jak przyciski, sekcje czy akcje.

WSKAZÓWKA: Zastosuj kilka projektów prototypów na planszy. Możesz porównać i zbadać decyzje projektowe oraz kontynuować dopracowywanie najlepszej opcji.

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 trwa dłużej, uprość prompt lub zmniejsz liczbę ekranów.

Użyj planszy jako promptu

Wybierz treść na planszy, aby użyć jej jako promptu. Na przykład brief projektowy w dokumencie lub na karteczkach. Prototypy mogą używać tej treści jako kontekstu do stworzenia prototypu. 

Postępuj zgodnie z tymi krokami:

1. Wybierz zawartość planszy. Na przykład dokument lub karteczki. Możesz opcjonalnie wybrać wiele obiektów.
2. Zaznacz zawartość planszy Miro, powyżej Paska tworzenia kliknij Sidekicks.
   Otwiera się panel Sidekick.
   UWAGA: Jeśli masz zaktualizowaną...
3. Kliknij biblioteka współpracownika AI
   Otwórz Prototype w bibliotece współpracownika AI 
4. Kliknij Formaty > Prototype.
5. Wybierz prompt tekstu.
6. Określ typ urządzenia, następnie wybierz pojedynczy lub wieloekranowy.
   Pole odpowiedzi pokazuje liczbę obiektów wybranych w kroku 1.
7. Postępuj zgodnie z instrukcjami na ekranie, aby wygenerować prototyp.
   Miro generuje Twój prototyp na podstawie specyfikacji i wybranej zawartości planszy.

PORADA: Możesz poprosić Miro AI, aby skorzystało z konkretnych obiektów na planszy, zaznaczając je na planszy. Na przykład, w swoim prompcie możesz powiedzieć „Użyj zrzutów ekranu na planszy jako przewodników do budowy prototypu." Jeśli masz wiele podobnych obiektów na planszy, dokładnie opisz, z których obiektów chcesz, aby Miro AI skorzystało.

Iteruj swój prototyp

Twój pierwszy szkic może nie być idealny. Zanim zastosujesz swój szkic na planszy, możesz kontynuować iteracje i tworzyć wiele wersji swojego prototypu.

1. Utwórz prototyp za pomocą Miro AI. Nie stosuj na planszy.
   Następnym krokiem w panelu Prototypu jest Co chcesz zrobić następnie?
2. Wybierz Edytuj prototyp. 
3. Dla 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ę albo naciśnij Enter na klawiaturze.
   Miro generuje nową wersję Twojego prototypu.

UWAGA: Edycje można wprowadzać tylko po jednym ekranie na raz.

Wskazówka: Użyj kontekstu planszy. Wybierz dokumenty, diagramy, karteczki lub inną zawartość tablicy, aby aktywować Miro AI.

Iteracja z użyciem zrzutu ekranu jako kontekstu wizualnego

Zanim zastosujesz prototyp na planszy, możesz użyć zrzutu ekranu lub innego prototypu, który już znajduje się na planszy, jako kontekstu do iteracji projektu.

1. Utwórz prototyp z Miro AI. Nie stosuj na planszy.
   Następnym krokiem w panelu Prototyp jest Co chcesz zrobić dalej?
2. Kliknij Edytuj prototyp.
3. W przypadku 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ć, bazując na wybranym zrzucie ekranu.
6. Kliknij strzałkę do góry lub naciśnij Enter na klawiaturze.
   Miro generuje nową wersję prototypu. 

Wskazówka: Możesz użyć istniejących ekranów prototypu już znajdujących się na tablicy jako kontekst wizualny. Utwórz i zastosuj prototyp na tablicy. Wybierz ekran.

Edycja z pomocą AI

Dla dowolnego prototypu już zastosowanego na planszy, możesz kontynuować iterację z użyciem Edycji z AI. Użyj Edycji z AI, aby udoskonalać zamiast odbudowywać, na przykład gdy chcesz stworzyć wersję ciemną istniejącego prototypu.

Postępuj zgodnie z tymi krokami:

1. Dla każdego prototypu zastosowanego na planszy, w menu kontekstowym kliknij Edycja z AI.
   Otworzy się panel współpracownika AI.
   Edycja z AI umożliwia udoskonalenie istniejącego prototypu.

   UWAGA: Możesz używać Edycji z AI i współpracownika AI na jednym prototypie naraz. Aby zmienić, zamknij współpracownika AI i ponownie otwórz Edycję z AI z docelowego prototypu.

2. W polu prompt opisz zmiany, które chcesz wprowadzić. Na przykład „Przekształć na ciemny motyw”.
3. Aby wykonać swój prompt, kliknij przycisk strzałki w górę lub naciśnij przycisk ENTER na klawiaturze.
   Współpracownik AI generuje Twoj nowy prototyp.
4. (Opcjonalnie) Kontynuuj wprowadzanie promptów do współpracownika AI i iteruj nad swoim prototypem. Możesz wybrać wersję zanim zaaplikujesz prototyp na planszy.
5. Nad szkicowanym prototypem kliknij Dodaj do planszy.

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

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 do swoich ekranów.

1. Utwórz prototyp.
2. Wybierz ekrany swojego prototypu.
   Pojawia się menu kontekstowe.
3. Kliknij ikonę Miro AI w menu kontekstowym.
4. Wybierz Importuj styl z obrazu.
   Importowanie stylów i zastosowanie ich do prototypu
5. Wybierz plik obrazu, z którego chcesz zaimportować styl.
6. Style są zastosowane do twojego prototypu.

Wskazówka: Stosuj style jako pierwsze lub ostatnie. Aby zapewnić, że wszystkie elementy w Twoim prototypie będą zgodne z motywem, zastosuj motyw we wczesnej fazie projektowania prototypu lub jako ostatni krok.

Przekształć zrzuty ekranu w prototypy, które można edytować

Możesz przekształcić zrzut ekranu projektu lub interfejsu użytkownika konkurencji w edytowalny prototyp.

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

Wskazówka: Przekształć zrzut ekranu w edytowalną makietę. Następnie zaleć Miro AI dalszą edycję. Możesz także użyć zrzutu ekranu jako kontekstu w swoim promtcie i wygenerować prototyp. Aby użyć wielu zrzutów ekranu, wybierz wszystkie zrzuty i skopiuj jako obraz. Następnie użyj tego obrazu jako kontekstu w swoim promtcie.

Wybierz wersję prototypu

Każda modyfikacja tworzy wersję prototypu. Podczas udoskonalania prototypu selektor wersji znajduje się nad wersją roboczą prototypu. 

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

Wybierz, którą wersję lub poprawkę prototypu dodać do planszy.

Wskazówka: Zanim klikniesz Dodaj do planszy, możesz wybrać ekran z dowolnej wersji i skopiować go na planszę. To zapewnia, że możesz zachować ekran z wersji, którą możesz odrzucić. 

Ostrzeżenie: Po kliknięciu Dodaj do planszy, wszystkie inne wersje nie będą już dostępne.

Podgląd prototypu

Z menu kontekstowego prototypu, kliknij Podgląd. Ładowanie podglądu.

PORADA: Aby uzyskać w pełni interaktywne podgląd prototypu, użyj linii łączących między ekranami.

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

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

1. Kliknij element (na przykład przycisk) w swoim prototypie.
2. Przeciągnij ikonę linii łączącej do ekranu, z którym ma być połączona.
3. W trybie podglądu kliknięcie elementu przeniesie użytkowników do połączonego ekranu.

Ukrywanie linii łączących

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

W trybie planszy wybierz swój prototyp. W menu kontekstowym 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 swojej klawiaturze naciśnij Shift + E. W trybie planszy, aby używać skrótów, upewnij się, że wybrałeś swój prototyp.

Tryb skupienia

Miro Prototypes zawiera tryb skupienia. Wejdź w tryb skupienia, aby pracować nad swoim prototypem bez widoku innych elementów tablicy, umożliwiając pracę bez rozpraszania.

Aby wejść do trybu skupienia, wybierz swój Miro Prototype. W menu kontekstowym kliknij tryb skupienia.

Tryb skupienia umożliwia pracę z Miro Prototypes bez żadnych rozproszeń.

Kopiuj do Figmy

Przekaż swój prototyp projektantom w Figmie bez potrzeby ręcznego odbudowywania. Możesz skopiować cały prototyp lub pojedyncze ekrany.

Kopiowanie prototypu 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 skorzystać z klawiszy skrótu (Windows) Ctrl + V lub (MacOS) Command + V .
   Twój prototyp zostaje wklejony w Figma.

Kopiuj ekran prototypu do Figma

1. Kliknij, aby wybrać ekran prototypu.
   Pojawia się menu kontekstowe widżetu.
2. W menu kontekstowym kliknij pionowe trzy kropki, aby otworzyć menu Więcej.
3. Kliknij Kopiuj do Figma.
   Miro kopiuje ekran Twojego prototypu do schowka.
4. W Figma wklej swój prototyp. Możesz użyć skrótów klawiszowych (Windows) Ctrl + V lub (MacOS) Command + V.
   Ekran Twojego prototypu zostaje wklejony 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 trzy pionowe kropki, aby otworzyć menu Więcej.
2. Kliknij Udostępnij i eksportuj > Udostępnij prototyp.
   Otworzy się okno modalne Udostępnij prototyp.
3. Kliknij Kopiuj link.
4. (Opcjonalnie) Kliknij Podgląd w przeglądarce, aby zobaczyć, jak wygląda Twój prototyp dla kogoś z Twoim linkiem.
5. Udostępnij swój link.

UWAGA: Aby użytkownicy zewnętrzni mieli dostęp do prototypu, Twoja tablica musi być publiczna. Użytkownicy zewnętrzni mogą uzyskać dostęp do prototypu tylko w trybie skupienia i nie mają dostępu do innej treści planszy. Mogą interakcjonować z hotspotami i przepływem prototypu. Jeśli na tablicy dozwolone jest komentowanie, użytkownicy zewnętrzni mogą także dodawać komentarze.

WSKAZÓWKA: Możesz również skopiować link do udostępnienia w trybie skupienia: W prawym górnym rogu kliknij pionowe trzy kropki, a następnie wybierz Udostępnij prototyp. 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 również użyć serwera Model Context Protocol (MCP) Miro do eksportu do baz kodu edytorów AI; zespoły mogą używać eksportu do generowania działającego kodu i przyspieszania rozwoju.

Eksport do SVG

1. Z menu kontekstowego prototypu kliknij pionowe trzy kropki.
2. Kliknij Udostępnij i eksportuj > Eksportuj jako obraz.
   Pojawia się okno wyboru oraz okno modalne Eksportuj obraz jako.
3. Dostosuj okno wyboru, aby objęło Twój prototyp.
4. W oknie modalnym Eksportuj obraz jako wybierz Wektor – SVG.
5. Kliknij Eksportuj. 

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

Uwaga: Przy eksporcie prototypów SVG zawierających obrazy, jeśli importujesz SVG do innego oprogramowania do edytowania, takiego jak Figma, obrazy są zastępowane przez zastępniki.

Eksport przez serwer Miro MCP

Aby wyeksportować swój prototyp do edytora kodu AI, jak na przykład Cursor, uwzględnij adres URL tablicy z ID tablicy w swoim promcie. Upewnij się, że podałeś instrukcje do generowania kodu na podstawie prototypu.

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

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

FAQ