Przy wdrożeniu aplikacji lub SaaS kalendarz designu utknie na trzech assetach: splash / launch, feature benefit cards i empty-state illustrations. Komponenty są w Figma, ale screenshoty do sklepu i onboarding wciąż bez wizualizacji; outsourcing to tydzień na rundę, a copy ciągle się zmienia.
Image 2 oferuje lepszą ścieżkę: traktuj potrzebę jako linię produkcyjną UI visual slots — zablokuj kolor marki i hierarchię typografii, potem dostarcz splash → onboarding → feature cards → empty state → settings mock → store frame. Ten post zawiera 6 przetestowanych promptów image-2 dla App / UI screens gotowych do review.
Użyj tego jako playbook product-design: jedno zadanie na klatkę, copy dosłownie, przed eksportem sprawdź pisownię przycisków i tytułów.
📌 Prompty poniżej są po angielsku (Image 2 niezawodnie obsługuje ustrukturyzowany angielski i tekst w obrazie). Ręcznie sprawdź copy UI, znaki towarowe i dostępny kontrast; finalna dopracowanie i tak powinno trafić do Figma na siatce 8pt z prawdziwymi komponentami.
1. Dlaczego Image 2 pasuje do pracy „App / UI screen”
W porównaniu z nadzieją, że generyczny model ilustracji „trafi”, Image 2 wygrywa, bo:
-
Tekst w obrazie pozostaje czytelny — tytuły splash, trzyliniowe feature cards, CTA empty state — poziom benchmark ~99% text rendering bije „wygeneruj, potem wklej typ w PS” przy dostarczaniu AI interface art.
-
Wieloetapowe edycje zamieniają copy bez psucia layoutu — PM zmienia jedną linię onboardingu; w czacie podmień tylko tę linię, zachowując ilustrację i kształt przycisku — tutaj błyszczą conversational edits Image2.
-
Ograniczenia stylu stają się polami design system — brand HEX, corner radius, siła cienia, styl ilustracji (flat / soft 3D) w każdym prompcie sprawiają, że seria wygląda jak jeden Design System.
Dla partnerów product i design: UI visual assets można generować z information architecture, a nie czekać na kalendarz ilustracji.
2. Standardowy workflow (pięć kroków)
-
Wypisz UI visual slots — minimum sześć: ① splash/launch ② onboarding page ③ feature benefit cards (3 punkty) ④ empty state ⑤ settings/profile mock ⑥ App Store / store screenshot frame. Nigdy nie wciskaj pełnej interaktywnej aplikacji w jeden obraz.
-
Zapisz ograniczenia marki i typografii — primary/secondary colors, light/dark ground, limity długości tytułów; unikaj podrabiania chronionego OS chrome (generic status bars są OK).
-
Jedno zadanie na klatkę + dosłowne copy — każda odpowiada na jedno pytanie użytkownika: wrażenie przy pierwszym otwarciu? dlaczego zostać? co jeśli brak danych? jak wygląda w sklepie?
-
Ujednolić aspect ratios — splash/store często 9:16; feature cards 1:1 lub 4:5; trzymaj jedną rodzinę ratio w zestawie.
-
Trzy kontrole przed Figma — pisownia, kontrast, corner radius vs DS — napraw drift wieloetapowymi edycjami Image 2 zamiast pełnego re-roll.
3. Sześć przetestowanych promptów UI (kopiuj-wklej)
Przykładowy produkt: fikcyjna aplikacja produktywności „FlowDay”. Podmień nazwę i korzyści na swoje. Trzymaj brand accent w każdym prompcie (przykład: #4F46E5 indigo).
Slot 1: Splash / launch screen
Scenariusz: wrażenie marki przy cold start — wyśrodkowany mark + krótki tagline.
App splash / launch screen mock with Image 2 for mobile UI.
Vertical 9:16, clean modern iOS-like frame (generic status bar, no trademarked icons).
Centered app mark: simple indigo rounded-square icon with white "F" monogram.
Headline exactly: "FlowDay"
Subline exactly: "Plan less. Finish more."
Background: soft indigo-to-white gradient, subtle geometric glow, ample padding.
Sharp legible type, Image2 text accuracy, premium SaaS look.
Do not clutter with fake notifications. No watermark.
Wynik: app splash visual gotowy do review.
Slot 2: Onboarding single page
Scenariusz: strona wartości przy pierwszym otwarciu — copy + ilustracja.
Mobile onboarding screen UI mock using Image 2.
Vertical 9:16, light mode, generous bottom padding for a primary button.
Top illustration: soft 3D calendar and checkmarks, brand color #4F46E5 accents.
Title exactly: "Your day, in one timeline"
Body exactly: "Drag tasks into focus blocks. FlowDay keeps priorities visible."
Primary button label exactly: "Continue"
Keep layout airy, 8pt rhythm feel, Image 2 commercial UI quality.
Do not invent extra menus. Do not misspell.
Wynik: onboarding copy i art jako jedna całość — szybko do linii A/B.
Slot 3: Feature benefit cards (three points)
Scenariusz: rząd feature na stronie lub header paywall z trzema równymi kartami.
App feature benefit cards board with Image 2 (UI marketing).
1:1 or 4:5, white background, three equal cards in a row with soft shadow.
Card icons in #4F46E5. Exact English labels:
Card1 title: "Focus Blocks" / line: "Timeboxed deep work"
Card2 title: "Smart Reminders" / line: "Nudge only what matters"
Card3 title: "Weekly Review" / line: "See progress at a glance"
Modern SaaS marketing UI, crisp type, Image2 text accuracy.
No fake App Store badges. No overcrowded icons.
Wynik: ustrukturyzowane feature cards — klatka, gdzie najbardziej liczy się dokładność tekstu.
Slot 4: Empty-state screen
Scenariusz: brak zadań/powiadomień — przyjazne wskazówki, nie „coś się zepsuło”.
Empty-state mobile screen with Image 2 for product UI.
Vertical 9:16, light gray background, large friendly illustration center:
soft 3D empty inbox with a single indigo plus badge.
Title exactly: "Nothing here yet"
Body exactly: "Create your first focus block to start the day."
Secondary text button exactly: "Create task"
Clean, calm, accessible contrast, Image 2 UI illustration quality.
Do not make it look like an error. No scary red alerts.
Wynik: empty state staje się actionable zamiast pusty.
Slot 5: Settings / profile mock
Scenariusz: pokaż IA stakeholderom — non-interactive wystarczy.
Settings / profile screen mock with Image 2 (non-interactive UI visual).
Vertical 9:16, light mode list UI, rounded group cells.
Header: avatar circle + name "Alex Chen" + plan chip "Pro".
List rows with exact labels: "Notifications" / "Calendars" / "Appearance" / "Export Data".
Accent switches and chevrons in #4F46E5, generous spacing, SF-like but generic typography.
Image2 clean UI mock quality. Do not copy real iOS glyphs trademarked details.
No tiny unreadable text.
Wynik: settings mock wystarczająco dobry na spotkania, bez udawania, że jest tappable.
Slot 6: Store screenshot frame (with device)
Scenariusz: asset listingu — phone chrome + kluczowy UI + górny caption.
App Store screenshot composition with Image 2.
Vertical 9:16 marketing frame: large caption on top, phone device mock below.
Caption exactly: "Focus blocks that actually stick"
Inside the phone: a clean task timeline UI using brand #4F46E5, legible list titles.
Soft studio shadow under device, light gray backdrop, premium DTC style.
Image 2 commercial ASO visual. Exact text, no gibberish.
Do not invent fake star ratings. Do not overcrowded stickers.
Wynik: ASO direction frame; później podmień prawdziwe screenshoty w Figma.
4. Uniwersalny fill-in template
Zmieniaj tylko job line i on-image copy na slot:
Image 2 App / UI visual slot.
Brand lock: primary #[HEX], [light|dark] mode, [flat|soft-3D] illustration style.
Frame job (ONE only): [splash / onboarding / feature cards / empty state / settings mock / store screenshot].
Aspect: [9:16 | 1:1 | 4:5].
On-image copy exactly: "[titles/buttons]" — verbatim, no extra claims.
Do not: [fake OS trademarks / unreadable microcopy / cluttered chrome].
Output: review-ready UI visual, Image2 quality.
5. Outsourcing ilustracji vs Image 2 UI slots vs icon collage
| Wymiar | Pełny outsourcing ilustracji | Image 2 UI slot line | Icon / screenshot collage |
|---|---|---|---|
| Szybkość poprawek copy | Wolno (przerysowanie) | Szybko (multi-turn jedna linia) | Szybko, ale tanio wygląda |
| Spójność design system | Zależy od briefu | HEX / style fields to blokują | Łatwy drift |
| Najlepszy etap | Duże wersje marki | Tygodniowa iteracja, review, ASO drafts | Tylko wewnętrzne szkice |
| Główne ryzyko | Harmonogram | Wymaga ręcznej weryfikacji type & grid | Luka conversion / polish |
6. Dla kogo ta metoda?
✅ PM / project leads
Uzupełnij splash, empty states i store direction z Image 2 przed review — mniej slajdów „zostaw puste”.
✅ UI / UX designers
Traktuj image-2 jako warstwę visual exploration: zablokuj color i type, generuj, potem wyrównaj prawdziwe komponenty w Figma.
✅ Indie builders / small teams
Brak dedicated illustrator? Jedna prompt family i tak daje spójny app splash i feature cards.
✅ Growth & ASO ops
Store captions często się zmieniają — multi-turn edits biją przebudowę całej device frame.
7. Trzy typowe failure mode
-
❌ Jeden obraz udający pełną tappable app — Image 2 zamienia się w cluttered UI soup. Dziel po slot; interaktywne prototypy zostaw w Figma/code.
-
❌ Niejasne copy typu „some feature text” — type drift zabija dostarczanie UI design. Tytuły i przyciski muszą być
exactly: "...". -
❌ Podrobione chronione OS details bez contrast checks — generic status bars wystarczą; przed export sprawdź light-on-light accessibility.
8. Podsumowanie
Image 2 dla App / UI visuals to nie „kręcić flashier single”, lecz brand lock → UI slots → verbatim copy → multi-turn polish → Figma finish.
Następnym razem, gdy brakuje splash, feature card lub empty state, nie rób stock collage. Otwórz Image2 workbench i uruchom te sześć slots — dostaniesz unified, readable AI interface set gotowy do review, iteracji i store-frame starts.
Splash trzyma markę, cards mówią o wartości, empty state pokazuje następny krok — to image-2 product-design loop.
Notatki praktyczne; prompty można swobodnie kopiować i adaptować. Przed publikacją potwierdź copy, znaki towarowe i zasady store screenshots.
