UI per Landing Page e Dashboard SaaS di AgentBoard
Genera un mockup raffinato affiancato di una landing page SaaS e di una dashboard per uno spazio di lavoro per agenti AI, utile per l'esplorazione del design di prodotto.
Istruzione
Obiettivo: Creare un'immagine editoriale raffinata di esplorazione prodotto SaaS per una piattaforma di collaborazione tra agenti AI chiamata AgentBoard, mostrando due ampie schermate dell'interfaccia web affiancate su uno sfondo color crema caldo: una landing page di marketing a sinistra e la dashboard del prodotto a destra. Utilizzare un design startup raffinato, ombre morbide, schede arrotondate, sottili divisori grigi, ampio spazio bianco, accenti verde foresta tenue, tipografia display serif nera per il titolo della landing e testo UI sans-serif piccolo e pulito.
Canvas: Composizione ampia 4:3, circa 1200×900. Posizionare due pannelli alti simili a browser con angoli arrotondati e leggere ombre portate, separati da un sottile spazio. Lo sfondo è crema chiaro con una grana tenue e una vignettatura molto leggera.
Schermata sinistra, landing page di marketing: Barra di navigazione superiore con il logo testuale “AgentBoard” in alto a sinistra, 4 link di navigazione centrati etichettati Product, Solutions, Resources, Pricing, poi Log in e un pulsante verde scuro “Start for free” sulla destra. L'area hero presenta una piccola etichetta a pillola “AI-NATIVE WORKSPACE”, un grande titolo su tre righe che recita “One board. Many agents. Real outcomes.” con “Real outcomes.” in corsivo e verde, una riga di supporto “Plan, build, and ship work—together.” e 2 pulsanti CTA: “Start for free” verde scuro e “Book a demo” con contorno chiaro. A destra del testo hero, mostrare una bacheca di flusso di lavoro isometrica con esattamente 5 schede agente collegate: Research Agent, Strategy Agent, Content Agent, Design Agent e Data Agent, collegate da linee curve con piccoli chip di stato come Done e In progress. Sotto, includere esattamente 4 riquadri di metriche: “2.4M+ Tasks automated”, “180K+ Agents this month”, “98.6% On-time” e “4.9★ User rating”. Sotto le metriche, includere una riga etichettata “Connects with the tools you use” con esattamente 7 icone/pulsanti di integrazione: Slack, Notion, GitHub, Figma, Google Drive, HubSpot e “+ More”. Aggiungere un blocco testimonianza con la foto circolare di una donna e la citazione “AgentBoard gives us complete visibility and keeps our team aligned.” attribuita a Sarah Chen, Head of Product, Northline. In fondo, includere esattamente 4 descrizioni di funzionalità con minuscole icone lineari: Visual workspace, Multi-agent collaboration, Real-time progress e Secure & governed.
Schermata destra, dashboard del prodotto: Creare un'interfaccia web app densa ma elegante. La barra superiore dell'app mostra “AgentBoard” a sinistra, schede principali Workspace, Agents, Integrations, Data, Reports, più un pulsante Invite, una riga di 5 piccoli avatar utente, un badge “+3” e una freccia a discesa. Barra laterale sinistra per lo spazio di lavoro “Acme Inc.” con esattamente 11 elementi di navigazione: Home, Inbox con un badge 8, Boards, Agents, Workflows, Data, Reports, Integrations, Settings, Help e Collapse. Il titolo della pagina principale recita Q2 Go-to-Market Launch con una pillola verde “Live” e il sottotitolo “Coordinating agents across research, strategy, content, design, and ops.” Includere i pulsanti Share e Add agent verde scuro.
Contenuto della dashboard: Sotto il titolo, mostrare esattamente 4 schede: Board, Progress, Outputs, Activity, con Board attiva. Il canvas della bacheca principale contiene esattamente 6 schede di flusso di lavoro collegate disposte da sinistra a destra con linee di connessione curve: Research Agent “Market & audience research” Done; Data Agent “Performance analysis” Done; Strategy Agent “Go-to-market plan” In progress; Content Agent “Messaging & content framework” In progress; Design Agent “Creative concepts & brand” In progress; Ops Agent “Launch readiness & checklist” In progress; Analytics Agent “Performance forecast” Queued. Includere piccoli controlli della bacheca in alto a destra: icona di ricerca, icona di layout, icona di adattamento, zoom “100%” e menu a discesa.
Sotto la bacheca, aggiungere una striscia KPI con esattamente 5 elementi: Live progress 72% con barra di avanzamento verde, 9 Active agents, 24 Tasks running, 156 Tasks completed e 92% On-time, più un pulsante “View all runs”. Aggiungere una sezione Recent outputs con esattamente 4 schede documento: GTM Strategy Brief, Messaging Framework, Creative Concepts e Performance Forecast, ognuna con una piccola miniatura di anteprima e l'orario di aggiornamento. Aggiungere una tabella Recent runs con esattamente 5 righe: Q2 Go-to-Market Launch, Customer Onboarding Revamp, Pricing Strategy Analysis, Brand Refresh Campaign e Enterprise Sales Playbook; includere piccoli cluster di avatar agente, pillole di stato colorate, orari di inizio e durate. In fondo, includere una barra di input Composer con segnaposto “What would you like the agents to work on?”, pulsanti per Attach e Add context, un menu a discesa “All agents” e un pulsante di invio verde.
Stile visivo: Mockup di prodotto minimalista premium, proporzioni UI realistiche, rendering nitido simile a un vettore, testo dell'interfaccia piccolo e leggibile dove possibile, sottile texture di sfondo punteggiata, schede beige chiaro, indicatori di stato verdi, linee di connessione sottili, estetica SaaS editoriale moderna adatta a un tweet di esplorazione del design di prodotto.
Vincoli: Utilizzare esattamente 2 schermate principali, esattamente 5 schede agente nell'hero della landing, esattamente 4 riquadri di metriche, esattamente 7 icone di integrazione, esattamente 4 descrizioni di funzionalità in fondo, esattamente 11 elementi della barra laterale, esattamente 4 schede della dashboard, esattamente 6 schede agente di flusso di lavoro sulla bacheca della dashboard più la scheda Analytics in coda come settimo endpoint, esattamente 5 elementi KPI, esattamente 4 schede di output ed esattamente 5 righe di tabella. Non aggiungere pannelli extra, filigrane, elementi del browser o testo decorativo oltre alla UI descritta.
Come usare questo prompt
- 1
Copia il prompt completo qui sopra.
- 2
Apri una piattaforma che supporta GPT Image 2, come YouMind, e incolla il prompt.
- 3
Cambia soggetto, stile o dettagli in base alla tua idea, poi genera.
Questo è un prompt IA gratuito della libreria di prompt di YouMind. Esplora altre migliaia di prompt immagine, tutti liberi da copiare e adattare.
Esplora altri prompt immagineAltro da GPT Image 2
Griglia Lookbook Acconciature con Volto Coerente
@Ciri
Poster d'arte geometrica curativa
@小小东
Poster con griglia di scarabocchi disegnati a mano
@小小东
Da foto a icona 3D professionale
@小小东
Diorama artigianale in miniatura di una caffetteria
@simeon-sanai
Ritratto in studio cinematografico in bianco e nero
@Professor
Tutte le categorie Immagine
01
Casi d’uso
02
Stili
Altre funzioni per prompt
Libreria IA
Ricerca prompt con IA
Lascia che l'IA cerchi tra decine di migliaia di prompt. Filtra per modello, intervallo di date e parole chiave e ordina per interazione: visualizzazioni, preferiti, condivisioni e altro.
Strumenti visivi
Da immagine a prompt
Trasforma qualsiasi foto in un prompt di immagine AI dettagliato. Il convertitore gratuito da immagine a prompt analizza composizione, stile e luce per ricreare ogni look in pochi secondi.
Altre funzioni per prompt
Per modello
Pensato per i creator. Gratis per sempre.
YouMind è il copilota creativo IA scelto da creator in tutto il mondo. Ogni prompt è curato per aiutarti a creare meglio e più velocemente.