Skip to main content
Flowstep generuje UI obrazovky z přirozených jazykových promptů, což vám umožní přejít od nápadu k vizuálnímu návrhu v sekundách. Ať potřebujete jednu obrazovku k ověření konceptu nebo úplnou sadu obrazovek pokrývajících celou cestu uživatele, ke spuštění stačí dobře napsaný prompt.

​
Vygenerujte návrh

1

Otevřete nový projekt

Ze svého Flowstep ovládacího panelu vytvořte nový projekt nebo otevřete existující, do kterého chcete přidat obrazovky.
2

Napište svůj prompt

Zadejte popis obrazovky nebo obrazovek, které chcete. Buďte konkrétní ohledně typu aplikace, cíle uživatele a obsahu, který očekáváte.
3

Určete, kolik obrazovek chcete

Ve výchozím nastavení Flowstep generuje jednu obrazovku. Pokud chcete více obrazovek, řekněte to explicitně v promptu — Flowstep může z jednoho promptu vygenerovat až 6 obrazovek.
4

Vygenerujte

Odešlete svůj prompt. Flowstep vytvoří vaše obrazovky a zobrazí je v editoru, připravené k prohlédnutí nebo úpravě.

​
Jedna obrazovka vs. více obrazovek

Z jednoho promptu můžete vygenerovat buď jednu obrazovku nebo až 6 obrazovek. Oba přístupy jsou vhodné pro různé fáze návrhové práce.
  • Jedna obrazovka — nejlepší pro prozkoumávání konkrétního stavu UI, komponenty nebo zaměřeného konceptu.
  • Více obrazovek — nejlepší pro mapování toků, porovnávání možností rozložení nebo rychlé pokrytí celé cesty uživatele.
Pokud chcete více obrazovek, buďte v promptu explicitní. Flowstep používá k rozhodnutí, kolik obrazovek má vytvořit, konkrétní formulaci promptu, takže nejasné prompty obvykle vrátí jednu obrazovku. Generované obrazovky jsou pojmenovány Screen 1, Screen 2 a tak dále — používejte tato jména k odkazování na konkrétní obrazovku v následujících promptech.

​
Další způsoby, jak zadávat prompty

Text není jediným vstupem. Můžete také:
  • Připojit soubory — přidejte obrázky (JPG, PNG, WEBP) nebo dokumenty (PDF, MD, TXT) do 3 MB za kus k promptu pomocí přetažení, výběru souboru nebo vkládáním. V promptu odkazujte na připojený obrázek a Flowstep jej zahrne do vygenerovaných obrazovek. Viz Použití referencí.
  • Diktujte svůj prompt — klikněte na tlačítko mikrofonu v panelu promptu (nebo stiskněte Cmd+Shift+V na Macu, Ctrl+Shift+V na Windows) a mluvte až 60 sekund. Přepis se připojí k tomu, co jste již zadali.
  • Nechte Flowstep prohledat web — když to váš prompt vyžaduje (například “naklonujte stránku s cenami Stripe”), Flowstep může prohledat web a přečíst si značku stránky — barvy, písma, logo, UI komponenty — a použít je v generovaných obrazovkách. Flowstep se rozhoduje sám, zda provádět výzkum, takže se nemusí spustit na každý prompt; pamatujte, že vytvořené webové stránky používají různé obrázky a navigaci než originál.
  • Nastavte designové pokyny — definujte trvalá pravidla stylu, která se aplikují na každou generaci v souboru. Viz Designové pokyny.

​
Psaní efektivních promptů

Příklad promptu pro jednu obrazovku: “Navrhněte přihlašovací obrazovku na mobilu pro aplikaci sledování fitness s poli pro e-mail a heslo, tlačítkem pro přihlášení a odkazem na zapomenuté heslo.”
Příklad promptu pro více obrazovek: “Vygenerujte více obrazovek pro onboarding tok aplikace na doručování jídla — pokryjte výběr preferencí kuchyně, zadání adresy doručení a potvrzení první objednávky.”
Příklad promptu na úplnou cestu: “Pokryjte celou cestu uživatele v aplikaci pro hlášení výdajů, od odeslání účtenky k schválení manažerem.”
Při psaní promptů mějte na paměti tyto principy:
  • Pojmenujte platformu (mobilní, desktop, tablet), aby Flowstep správně nastavil velikost obrazovek.
  • Popište cíl uživatele, ne jen UI prvky — Flowstep odvodí rozložení ze záměru.
  • Zahrňte klíčový obsah, jako jsou popisky, akce nebo data, pokud jsou důležité pro návrh.
  • Používejte fráze jako “vygenerujte více obrazovek” nebo “pokryjte celou cestu uživatele” k vyvolání výstupu s více obrazovkami.