AgentBoard SaaS Landingpage und Dashboard UI
Erzeugt ein ausgefeiltes SaaS-Landingpage- und Dashboard-Mockup für einen KI-Agenten-Arbeitsbereich, ideal für die Exploration von Produktdesigns.
Eingabe
Ziel: Erstellung eines hochwertigen, redaktionellen SaaS-Produkt-Explorationsbildes für eine KI-Agenten-Kollaborationsplattform namens AgentBoard. Dargestellt werden zwei große Web-UI-Screens nebeneinander auf einem warmen, cremeweißen Hintergrund: links eine Marketing-Landingpage und rechts das Produkt-Dashboard. Verwenden Sie ein raffiniertes Startup-Design, weiche Schatten, abgerundete Karten, dünne graue Trennlinien, viel Weißraum, dezente waldgrüne Akzente, eine schwarze Serifenschrift für die Landingpage-Überschrift und kleinen, klaren serifenlosen UI-Text.
Leinwand: Breitbild-Komposition im 4:3-Format, ca. 1200×900. Platzieren Sie zwei hohe, browserähnliche Panels mit abgerundeten Ecken und dezenten Schlagschatten, getrennt durch einen schmalen Zwischenraum. Der Hintergrund ist hellcremefarben mit feiner Körnung und einer sehr sanften Vignette.
Linker Screen, Marketing-Landingpage: Obere Navigationsleiste mit dem Logo-Text „AgentBoard“ oben links, 4 zentrierten Navigationslinks mit den Bezeichnungen Product, Solutions, Resources, Pricing, sowie Log in und einem dunkelgrünen „Start for free“-Button auf der rechten Seite. Der Hero-Bereich enthält ein kleines Pillen-Label „AI-NATIVE WORKSPACE“, eine große dreizeilige Überschrift „One board. Many agents. Real outcomes.“ wobei „Real outcomes.“ kursiv und grün hervorgehoben ist, sowie die Unterzeile „Plan, build, and ship work—together.“ und 2 CTA-Buttons: dunkelgrün „Start for free“ und hell umrandet „Book a demo“. Rechts neben dem Hero-Text zeigen Sie ein isometrisches Workflow-Board mit genau 5 verbundenen Agentenkarten: Research Agent, Strategy Agent, Content Agent, Design Agent und Data Agent, verbunden durch geschwungene Linien mit kleinen Status-Chips wie Done und In progress. Darunter finden sich genau 4 Metrik-Kacheln: „2.4M+ Tasks automated“, „180K+ Agents this month“, „98.6% On-time“ und „4.9★ User rating“. Unter den Metriken fügen Sie eine Zeile mit der Beschriftung „Connects with the tools you use“ mit genau 7 Integrations-Icons/Buttons ein: Slack, Notion, GitHub, Figma, Google Drive, HubSpot und „+ More“. Fügen Sie einen Testimonial-Block mit einem kreisförmigen Porträtfoto einer Frau und dem Zitat „AgentBoard gives us complete visibility and keeps our team aligned.“ hinzu, zugeschrieben an Sarah Chen, Head of Product, Northline. Am unteren Rand finden sich genau 4 Feature-Beschreibungen mit kleinen Linien-Icons: Visual workspace, Multi-agent collaboration, Real-time progress und Secure & governed.
Rechter Screen, Produkt-Dashboard: Erstellen Sie eine dichte, aber elegante Web-App-Oberfläche. Die obere App-Leiste zeigt „AgentBoard“ links, die Haupt-Tabs Workspace, Agents, Integrations, Data, Reports sowie einen Invite-Button, eine Reihe von 5 kleinen Benutzer-Avataren, ein „+3“-Badge und einen Dropdown-Pfeil. Linke Seitenleiste für den Arbeitsbereich „Acme Inc.“ mit genau 11 Navigationselementen: Home, Inbox mit einem 8er-Badge, Boards, Agents, Workflows, Data, Reports, Integrations, Settings, Help und Collapse. Der Hauptseitentitel lautet Q2 Go-to-Market Launch mit einer grünen „Live“-Pille und dem Untertitel „Coordinating agents across research, strategy, content, design, and ops.“ Fügen Sie Share- und dunkelgrüne Add agent-Buttons hinzu.
Dashboard-Inhalt: Unter dem Titel zeigen Sie genau 4 Tabs: Board, Progress, Outputs, Activity, wobei Board aktiv ist. Die Haupt-Board-Leinwand enthält genau 6 verbundene Workflow-Karten, die von links nach rechts mit geschwungenen Verbindungslinien angeordnet sind: 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. Fügen Sie oben rechts kleine Board-Steuerelemente hinzu: Such-Icon, Layout-Icon, Fit-Icon, Zoom „100%“ und Dropdown.
Unter dem Board fügen Sie einen KPI-Streifen mit genau 5 Elementen hinzu: Live progress 72% mit grünem Fortschrittsbalken, 9 Active agents, 24 Tasks running, 156 Tasks completed und 92% On-time, sowie einen „View all runs“-Button. Fügen Sie einen Abschnitt Recent outputs mit genau 4 Dokumentenkarten hinzu: GTM Strategy Brief, Messaging Framework, Creative Concepts und Performance Forecast, jeweils mit einem kleinen Vorschaubild und Aktualisierungszeitpunkt. Fügen Sie eine Tabelle Recent runs mit genau 5 Zeilen hinzu: Q2 Go-to-Market Launch, Customer Onboarding Revamp, Pricing Strategy Analysis, Brand Refresh Campaign und Enterprise Sales Playbook; enthalten Sie winzige Agenten-Avatar-Gruppen, farbige Status-Pillen, Startzeiten und Dauern. Am unteren Rand fügen Sie eine Composer-Eingabeleiste mit dem Platzhalter „What would you like the agents to work on?“, Buttons für Attach und Add context, ein „All agents“-Dropdown und einen grünen Senden-Button ein.
Visueller Stil: Premium minimales Produkt-Mockup, realistische UI-Proportionen, gestochen scharfes, vektorähnliches Rendering, winziger lesbarer Interface-Text wo möglich, dezente gepunktete Hintergrundtextur, blassbeige Karten, grüne Statusanzeigen, feine Verbindungslinien, moderne redaktionelle SaaS-Ästhetik, geeignet für einen Tweet zur Produktdesign-Exploration.
Einschränkungen: Verwenden Sie genau 2 Haupt-Screens, genau 5 Agentenkarten auf dem Landing-Hero, genau 4 Metrik-Kacheln, genau 7 Integrations-Icons, genau 4 untere Feature-Beschreibungen, genau 11 Seitenleisten-Elemente, genau 4 Dashboard-Tabs, genau 6 Workflow-Agentenkarten auf dem Dashboard-Board plus die Analytics-Karte als siebten Endpunkt, genau 5 KPI-Elemente, genau 4 Output-Karten und genau 5 Tabellenzeilen. Fügen Sie keine zusätzlichen Panels, Wasserzeichen, Browser-Chrome oder dekorativen Text außerhalb der beschriebenen UI hinzu.
So verwendest du diesen Prompt
- 1
Kopiere den vollständigen Prompt oben.
- 2
Öffne eine Plattform, die GPT Image 2 unterstützt, etwa YouMind, und füge den Prompt ein.
- 3
Tausche Motiv, Stil oder Details nach deiner Idee aus und generiere dann.
Dies ist ein kostenloser AI-Prompt aus der Prompt-Bibliothek von YouMind. Entdecke Tausende weitere bild-Prompts, alle frei zum Kopieren und Anpassen.
Mehr bild-Prompts entdecken
Alle Bild-Kategorien
01
Anwendungsfälle
02
Stile
Mehr Prompt-Funktionen
KI-Bibliothek
KI-Prompt-Suche
Lass die KI Zehntausende Prompts durchsuchen. Filtere nach Modell, Zeitraum und Keywords und sortiere nach Engagement — Aufrufe, Lesezeichen, Reposts und mehr.
Vision-Tools
Bild zu Prompt
Verwandeln Sie jedes Foto in einen detaillierten AI-Bild-Prompt. Der kostenlose Image-to-Prompt-Konverter analysiert Komposition, Stil und Licht, damit Sie jeden Look in Sekunden nachbauen können.
Weitere Prompt-Funktionen
Für Kreative gebaut. Für immer kostenlos.
YouMind ist der KI-Kreativ-Copilot, dem Kreative weltweit vertrauen. Jeder Prompt hier ist kuratiert, damit du schneller und besser gestalten kannst.