Flowstep genera pantalles d’interfície d’usuari a partir de prompts en llenguatge natural, permetent-te passar d’una idea al disseny visual en segons. Ja sigui que necessitis una única pantalla per validar un concepte o un conjunt complet de pantalles que cobreixin un viatge d’usuari complet, un prompt ben escrit és tot el que necessites per començar.
Generar un disseny
Obrir un projecte nou
Des del teu panell de Flowstep, crea un projecte nou o obrir-ne un de ja existent on vulguis afegir pantalles.
Escriu el teu prompt
Escriu una descripció de la pantalla o les pantalles que vols. Sigues específic sobre el tipus d’aplicació, l’objectiu de l’usuari i el contingut que esperes veure.
Especifica quantes pantalles vols
Per defecte, Flowstep genera una única pantalla. Si vols múltiples pantalles, digues-ho explícitament al teu prompt — Flowstep pot generar fins a 6 pantalles a partir d’un únic prompt.
Pantalla única vs. múltiples pantalles
Pots generar una única pantalla o fins a 6 pantalles a partir d’un únic prompt. Ambdós enfocaments s’adequen a diferents etapes del treball de disseny.- Pantalla única — millor per explorar un estat específic de la interfície d’usuari, un component o un concepte centrat.
- Múltiples pantalles — millor per a cartografiar fluixos, comparar opcions de disseny o cobrir un viatge d’usuari complet ràpidament.
Més maneres de promptar
El text no és l’única entrada. Pots també:- Adjuntar fitxers — afegir imatges (JPG, PNG, WEBP) o documents (PDF, MD, TXT) de fins a 3 MB cadascun al prompt, mitjançant arrossega-i-deixa, el selector de fitxers o pegant. Referencia una imatge adjunta en el teu prompt i Flowstep l’incorpora a les pantalles generades. Veure referencias de disseny.
- Dictar el teu prompt — fes clic al botó de micròfon a la barra de prompts (o prem Cmd+Shift+V a Mac, Ctrl+Shift+V a Windows) i parla fins a 60 segons. La transcripció s’afegeix al que ja has escrit.
- Deixar que Flowstep investiga la web — quan el teu prompt ho demani (per exemple, “clonar la pàgina de preus de Stripe”), Flowstep pot cercar la web i llegir la marca d’una pàgina — colors, fonts, logo, components de la interfície d’usuari — i utilitzar-la en les pantalles generades. Flowstep decideix per si mateix si ha d’investigar, així que no necessàriament es dispararà en cada prompt; ten en compte que els llocs web recreats utilitzen imatges i navegació diferents de l’original.
- Establir directrius de disseny — definir regles d’estil permanents que s’apliquin a cada generació en el fitxer. Veure Directrius de disseny.
Escrivir prompts efectius
Tingues en compte aquests principis quan escriguis prompts:- Nomena la plataforma (mòbil, escriptori, tauleta) perquè Flowstep ajusti la mida de les pantalles correctament.
- Descriu l’objectiu de l’usuari, no només els elements de la interfície d’usuari — Flowstep infereix el disseny a partir de la intenció.
- Inclou contingut clau com etiquetes, accions o dades si importen en el disseny.
- Utilitza frases com “generar múltiples pantalles” o “cobrir el viatge complet de l’usuari” per activar la sortida multi-pantalla.