Miro Prototypes

Kto może to zrobić: Wszyscy członkowie z dodatkiem Miro Prototypes
Jakie wersje: 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ć przepływy jedno- i wieloekranowe, dopracować swoje projekty i zastosować style, a także zobaczyć interaktywną symulację swojego prototypu. Buduj swój projekt w kilku, konkretnych promptach generujących każdy element prototypu. Możesz również dopracować swoje prompty, aby nie musieć zaczynać 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. 

✏️ Doświadczenie Prototypes zostało przeniesione do współpracowników AI. Aktualnie w wersji beta, niektórzy użytkownicy już mają dostęp do zaktualizowanego, opartego na współpracownikach AI, wprowadzania prototypów generowanych przez AI. Jeśli zauważysz, że twoje doświadczenie nie pasuje do tej dokumentacji, zobacz Tworzenie prototypu z współpracownikami AI (wersja beta). Treści wyjaśniające, jak doprecyzować i poprawić swoje wyniki nadal są aktualne.

Więcej informacji: Zobacz FAQ.

Utwórz prototyp za pomocą Miro AI

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

Zacznij od początku

1. Na planszy Miro, powyżej paska tworzenia, kliknij Sidekicks.
   Panel Sidekick otworzy się.
2. Kliknij bibliotekę współpracowników AI.
   Uzyskaj dostęp do Prototypu w bibliotece współpracowników AI 
3. Kliknij Formaty > Prototyp.
4. Określ, czy chcesz zacząć od promptu tekstowego czy zrzutu ekranu.
5. Określ typ urządzenia.
6. Określ pojedynczy ekran lub prototyp wieloekranowy.
7. Postępuj zgodnie z wyświetlanymi wskazówkami, 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. Dokończ pisanie promptu, a następnie kliknij strzałkę Wyślij lub naciśnij ENTER na klawiaturze.
   Miro AI generuje szkic prototypu na planszy.
9. (Opcjonalnie) Aby zatrzymać generowanie, kliknij Zatrzymaj na swoim prototypie.
10. (Opcjonalnie) Aby dokonać iteracji swojego prototypu, kontynuuj wprowadzanie promptu w panelu Prototype.
    Każda iteracja tworzy wersję Twojego szkicu prototypu.
11. Na swoim roboczym prototypie wybierz jedną z następujących opcji:
    • Zastosuj na planszy
      Twój prototyp jest teraz edytowalny na planszy.
    • Odrzuć wszystko
      Twój roboczy projekt zostanie usunięty z planszy. Możesz udoskonalić swój prompt i powtórzyć kroki 7–9.

Utwórz prototyp z współpracownikiem AI (wersja beta)

Niektórzy użytkownicy mogą już posiadać zaktualizowany input współpracownika AI do prototypowania. Ta sekcja opisuje, jak rozpocząć prototypowanie przy użyciu współpracownika AI. Aby dowiedzieć się, jak zacząć ręcznie, zobacz Biblioteka prototypów.

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

Postępuj zgodnie z tymi krokami:

1. Na planszy Miro, powyżej paska Tworzenie, kliknij Współpracownik AI.
   Panel współpracownika AI otworzy się.

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

   💡 Alternatywnie możesz otworzyć panel współpracownika AI i rozpocząć promptowanie natychmiast. Upewnij się, że wyraźnie zaznaczasz chęć utworzenia prototypu, np. "Utwórz prototyp przepływu transakcji."

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

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

💡 Zaczynaj małymi krokami i bądź precyzyjny. Mniej wygenerowanych ekranów naraz przynosi dokładniejsze wyniki w krótszym czasie. Wyraźnie określ kluczowe elementy, które chcesz na każdym ekranie, takie jak przyciski, sekcje lub akcje.

💡 Zastosuj kilka szkiców prototypów na planszy. Możesz porównać i zbadać decyzje projektowe oraz kontynuować ulepszanie najkorzystniejszej opcji.

💡 Generowanie prototypu może trwać od 1 do 3 minut, w zależności od złożoności promptu i wielkości treści. Jeśli generowanie prototypu zajmuje dłużej, uprość swój prompt lub zmniejsz liczbę ekranów.

Użyj planszy jako promptu

Wybierz treść na planszy, aby użyć jej w swym prompt. Na przykład, masz opis projektu w dokumencie lub na karteczkach. Prototypy mogą używać treści jako kontekstu do tworzenia 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. Na planszy Miro, nad paskiem tworzenia kliknij Sidekicks.
   Otwiera się panel Sidekick.
   NOTA: Jeśli masz zaktualizowaną...
3. Kliknij bibliotekę współpracowników AI
   Dostęp do Protoypu w bibliotece współpracowników AI
4. Kliknij Formaty > Prototyp.
5. Wybierz prompt tekstowy.
6. Określ typ urządzenia, a następnie wybierz jedno- lub wieloekranowy.
   Pole odpowiedzi pokazuje liczbę obiektów, które wybrałeś w kroku 1.
7. Postępuj zgodnie z instrukcjami na ekranie, aby wygenerować swój prototyp.
   Miro generuje twój prototyp na podstawie twoich specyfikacji i wybranych treści planszy.

💡 Możesz skłonić Miro AI do użycia konkretnych obiektów z planszy, zaznaczając je na planszy. Na przykład w prompcie możesz powiedzieć „Użyj zrzutów ekranu na planszy jako przewodników do tworzenia prototypu.” Jeśli masz wiele podobnych obiektów na planszy, opisz wyraźnie, które obiekty Miro AI powinno użyć.

Iteracja prototypu

Twój pierwszy szkic może nie być idealnym rezultatem. Zanim zastosujesz swój szkic na planszy, możesz kontynuować iterowanie i tworzenie wielu wersji prototypu.

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

✏️ Edycje można przeprowadzać tylko na jednym ekranie naraz.

💡 Użyj kontekstu planszy. Wybierz dokumenty, diagramy, karteczki lub inną zawartość tablicy, aby wywołać prompt 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, który już znajduje się na planszy, jako kontekstu do iteracji twojego szkicu.

1. Utwórz prototyp za pomocą Miro AI. Nie stosuj na planszy.
   Następnym krokiem w panelu Prototype jest Co chcesz zrobić dalej?
2. Kliknij Edytuj prototyp.
3. Dla przepływu z wieloma ekranami 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. 

💡 Możesz używać istniejących ekranów prototypów na tablicy jako kontekstu wizualnego. Stwórz i zastosuj prototyp na tablicy. Wybierz ekran.

Edytuj z pomocą AI

Dla każdego prototypu już zastosowanego na planszy można kontynuować iterację korzystając z Edytuj z pomocą AI. Użyj Edytuj z pomocą AI, aby poprawić istniejący prototyp zamiast go przebudowywać, na przykład jeśli chcesz stworzyć wersję w ciemnym trybie istniejącego prototypu.

Postępuj według następujących kroków:

1. Dla dowolnego prototypu zastosowanego na planszy, w menu kontekstowym kliknij Edycja z AI.
   Otwiera się panel Współpracownik AI.
   Edycja z AI umożliwia rafinację istniejącego prototypu.

   ✏️ Możesz użyć Edycji z AI i Współpracownika AI tylko z jednym prototypem na raz. Aby się przełączyć, zamknij Współpracownika AI i ponownie otwórz Edycja z AI z docelowego prototypu.

2. W oknie promptu opisz zmiany, które chcesz wprowadzić. Na przykład: "Konwertuj na motyw ciemny".
3. Aby wykonać ustawiony prompt, kliknij przycisk ze strzałką w górę lub naciśnij klawisz ENTER na klawiaturze.
   Współpracownik AI generuje dopracowany prototyp.
4. (Opcjonalnie) Kontynuuj podawanie promptów współpracownikowi AI i iteruj nad swoim prototypem. Możesz wybrać wersję przed zastosowaniem prototypu na planszy.
5. Nad przygotowanym prototypem kliknij Dodaj do planszy.

✏️ W przypadku Miro Prototypes wszystkie funkcje prototypowania wspomagane przez AI są dostępne wyłącznie z dodatkiem Prototypes.

Zastosuj style prototypu z 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ą zastosowane do twojego prototypu.

💡 Zastosuj style na początku lub na końcu. Aby upewnić się, że wszystkie elementy w Twoim prototypie są zgodne z motywem, zastosuj temat na początku projektowania prototypu lub jako ostatni krok.

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

Możesz przekonwertować zrzut ekranu projektu lub interfejsu użytkownika konkurencji na edytowalny prototyp.

1. Dodaj zrzut ekranu do swojej tablicy Miro.
2. Kliknij obraz, aby otworzyć menu kontekstowe.
3. Wybierz ikonę Miro AI > Konwertuj obraz na prototyp.
4. Wybierz typ urządzenia (Mobilny, Tablet, Komputer).
5. AI odbuduje go jako edytowalny prototyp—tekst, przyciski, układ i inne elementy.
6. Możesz teraz modyfikować, dodawać lub edytować tę wersję według potrzeb.

💡 Przekształć zrzut ekranu w edytowalną makietę. Następnie zleć dalszą edycję Miro AI. Możesz także użyć zrzutu ekranu jako kontekstu w swoim promcie i wygenerować prototyp. Aby użyć kilku zrzutów ekranu, zaznacz wszystkie zrzuty i skopiuj jako obraz. Następnie użyj obrazu jako kontekstu w promcie.

Wybierz wersję prototypu

Każda poprawka tworzy wersję prototypu. Podczas dopracowywania prototypu selektor wersji znajduje się powyżej szkicu prototypu. 

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

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

💡 Zanim klikniesz Dodaj do planszy, możesz wybrać ekran z dowolnej wersji i skopiować go na planszę. Dzięki temu możesz zachować ekran z wersji, którą możesz odrzucić. 

⚠️ Gdy klikniesz Dodaj do planszy, wszystkie inne wersje nie będą mogły zostać odzyskane.

Podgląd prototypu

1. Wybierz ekran prototypu.
   Pojawia się menu kontekstowe.
2. Z menu kontekstowego kliknij Podgląd.
   Ładuje się podgląd.

💡 Aby uzyskać w pełni interaktywny podgląd prototypu, używaj linii łączących pomiędzy ekranami.

Dodaj linie łączące, aby prototyp był interaktywny

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

1. Kliknij element (taki jak przycisk) na swoim prototypie.
2. Przeciągnij ikonę Linii Łącznika do ekranu, z którym ma się łączyć.
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 Twojego prototypu, możesz ukryć linie łączące.

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

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

Ukryj lub pokaż linie łączące w trybie skupienia.

Powtórz te same kroki, aby pokazać linie łączące.

💡 Użyj skrótów klawiszowych do ukrywania lub pokazywania linii łączących. Na klawiaturze naciśnij Shift + E. W trybie planszy, aby używać skrótów klawiszowych, upewnij się, że wybrano Twój prototyp.

Tryb skupienia

Miro Prototypes zawiera tryb skupienia. Wejdź w tryb skupienia, aby pracować nad prototypem bez widoku pozostałej zawartości tablicy, co umożliwia pracę bez rozpraszania uwagi.

Aby wejść w tryb skupienia, wybierz swój prototyp Miro. W menu kontekstowym kliknij Tryb skupienia.

Tryb skupienia umożliwia pracę z Miro Prototypes bez rozpraszania uwagi.

Kopiuj do Figmy

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

Skopiuj prototyp do Figmy

1. Kliknij ramkę prototypu.
   Pojawi 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 (Windows) Ctrl + V lub (MacOS) Command + V .
   Twój prototyp zostanie wklejony do Figma.

Kopiuj ekran prototypu do Figma

1. W swoim prototypie 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 ekran 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.
   Twój ekran prototypu zostanie wklejony do Figma.

Eksportuj swój prototyp

Możesz eksportować swój prototyp jako SVG. Możesz również użyć Miro serwera Model Context Protocol (MCP) do eksportu do edytora baz kodu AI; zespoły mogą używać eksportu do generowania działającego kodu i przyspieszenia rozwoju.

Eksport do SVG

1. Na pasku tablicy kliknij pionowe trzy kropki.
2. Kliknij Tablica > Eksport > Eksportuj jako obraz.
   Otwiera się okno wyboru i okno modalne Eksportuj obraz jako.
3. Dostosuj okno wyboru, aby obejmowało twój prototyp.
4. W oknie modalnym Eksportuj obraz jako, wybierz Wektor – SVG.
5. Kliknij Eksportuj. 

💡 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 kliknij Eksportuj jako obraz. Otworzy się okno modalne Eksportuj jako obraz, a następnie wybierz Wektor – SVG.

✏️ Podczas eksportu prototypu SVG z obrazami, jeśli zaimportujesz SVG do innego oprogramowania do edycji, jak Figma, obrazy zostaną zastąpione przez symbole zastępcze.

Eksport z Miro MCP Server

Aby wyeksportować swój prototyp do edytora AI bazy kodu, takiego jak Cursor, dołącz URL tablicy z ID tablicy do swojego promptu. Upewnij się, że podajesz instrukcje generowania kodu na podstawie prototypu.

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

Edytor AI bazy kodu, taki jak Cursor, akceptuje URL tablicy Miro z ID tablicy w celu generowania kodu na podstawie prototypu.

FAQ