Spring til hovedindhold
Flowstep genererer UI-skærme ud fra prompts i naturligt sprog, så du kan gå fra idé til visuelt design på få sekunder. Uanset om du har brug for en enkelt skærm til at teste et koncept, eller et komplet sæt skærme, der dækker en hel brugerrejse, er en veludformet prompt alt, du behøver for at komme i gang.

​
Generér et design

1

Åbn et nyt projekt

Opret et nyt projekt fra dit Flowstep-dashboard, eller åbn et eksisterende projekt, hvor du vil tilføje skærme.
2

Skriv din prompt

Skriv en beskrivelse af den skærm eller de skærme, du vil have. Vær specifik med hensyn til typen af app, brugerens mål og det indhold, du forventer at se.
3

Angiv, hvor mange skærme du vil have

Som standard genererer Flowstep én enkelt skærm. Hvis du vil have flere skærme, skal du sige det eksplicit i din prompt — Flowstep kan generere op til 6 skærme ud fra én prompt.
4

Generér

Send din prompt. Flowstep producerer dine skærme og viser dem i editoren, klar til gennemsyn eller justering.
Når du opretter en ny fil og sender dens første prompt, navngiver Flowstep filen for dig ud fra den prompt, så den er nem at finde senere. En fil, der allerede har et navn eller tidligere prompts, beholder sit navn, og du kan selv omdøbe enhver fil når som helst.

​
Stop en generering

Mens Flowstep svarer, skifter send-knappen til en stopknap (Stop Flowstep response). Klik på den for at stoppe genereringen. I en anmodning om flere skærme forbliver skærme, der allerede er færdige, på dit lærred, og skærme, der ikke er færdige, fjernes. Hvis du stopper, efter Flowstep er begyndt at bygge skærme, bruges der stadig en besked — se beskeder og grænser.

​
Én skærm vs. flere skærme

Du kan generere enten én skærm eller op til 6 skærme ud fra en enkelt prompt. Begge fremgangsmåder passer til forskellige stadier i designarbejdet.
  • En skærm — bedst til at udforske en bestemt UI-tilstand, komponent eller et fokuseret koncept.
  • Flere skærme — bedst til at kortlægge flows, sammenligne layoutmuligheder eller dække en hel brugerrejse hurtigt.
Når du vil have flere skærme, skal du være eksplicit i din prompt. Flowstep bruger ordlyden i din prompt til at afgøre, hvor mange skærme der skal produceres, så vage prompts giver typisk en enkelt skærm. Genererede skærme får navnene Screen 1, Screen 2 og så videre — brug disse navne, når du henviser til en bestemt skærm i opfølgende prompts.

​
Flere måder at skrive prompts på

Tekst er ikke det eneste input. Du kan også:
  • Vedhæft filer — tilføj billeder (JPG, PNG, WEBP) eller dokumenter (PDF, MD, TXT) på op til 3 MB hver til prompten via træk-og-slip, filvælgeren eller ved at indsætte. Henvis til et vedhæftet billede i din prompt, og Flowstep inddrager det i de genererede skærme. Se Brug designreferencer.
  • Dikter din prompt — klik på mikrofonknappen i prompt-linjen (eller tryk på Cmd+Shift+V på Mac, Ctrl+Shift+V på Windows) og tal i op til 60 sekunder. Transskriptionen tilføjes til det, du allerede har skrevet.
  • Lad Flowstep undersøge nettet — når din prompt kræver det (for eksempel “klon Stripe-prissiden”), kan Flowstep søge på nettet og læse en sides branding — farver, skrifttyper, logo og UI-komponenter — og bruge det i de genererede skærme. Flowstep afgør selv, om der skal undersøges, så det udløses ikke nødvendigvis ved hver prompt. Bemærk, at genskabte websites bruger andre billeder og navigation end originalen.
  • Angiv designretningslinjer — definér faste stilregler, der gælder for alle genereringer i filen. Se Designretningslinjer.

​
Sådan skriver du effektive prompts

Eksempel på prompt til én skærm: “Design en mobil loginskærm til en fitness-app med felter til e-mail og adgangskode, en login-knap og et link til glemt adgangskode.”
Eksempel på prompt til flere skærme: “Generér flere skærme til et onboarding-flow i en madbestillings-app — dæk valg af køkkenpræferencer, indtastning af en leveringsadresse og bekræftelse af den første ordre.”
Eksempel på prompt til en hel brugerrejse: “Dæk hele brugerrejsen i en app til udgiftsrapportering, fra indsendelse af en kvittering til godkendelse af en leder.”
Husk disse principper, når du skriver prompts:
  • Angiv platformen (mobil, desktop, tablet), så Flowstep dimensionerer skærmene korrekt.
  • Beskriv brugerens mål, ikke kun UI-elementer — Flowstep udleder layout ud fra hensigten.
  • Inkluder centralt indhold som labels, handlinger eller data, hvis de er vigtige for designet.
  • Brug vendinger som “generér flere skærme” eller “dæk hele brugerrejsen” for at udløse output med flere skærme.