В сегодняшнем эксперименте попробуем сделать условные веб-дизайнерские ассеты для пяти различных тематик: игровую, финтеховскую, стилизованную под Web 1.0, экологическую, и для нейро-сервиса.
HUD-панель для киберспортивного шутера
Промт:
Game HUD overlay for competitive FPS, futuristic minimalism, translucent dark panels with neon cyan accents, health/ammo bars, minimap frame in corner, kill-feed ticker on right side, sharp angular corners, 4K clean vector style, transparent background PNG.
Nano Banana Pro
Grok Image 2
Flux 2 Pro
Инвентарь RPG в стиле dark fantasy
Промт:
Fantasy RPG inventory UI, 6x4 grid slots with ornate golden frames, weathered parchment texture background, item rarity color coding (gray/green/blue/purple/orange), drag-and-drop hover state, gothic serif typography labels, Diablo-inspired, seamless tileable.
Nano Banana Pro
Grok Image 2
Flux 2 Pro
Мобильные кнопки для казуальной головоломки
Промт:
Casual mobile game buttons set, rounded candy-like shapes, glossy gradients (strawberry pink, lemon yellow, mint green), soft drop shadows, pressed/disabled/normal states, chunky sans-serif labels, Dribbble-worthy, isolated on transparent background
Nano Banana Pro
Grok Image 2
Flux 2 Pro
Дашборд криптобиржи
Промт:
Crypto trading dashboard UI, dark mode, real-time candlestick chart widget, portfolio balance card with sparkline, order book panel, monochrome palette with green/red accents, glassmorphism cards, Inter typography, Figma-ready components
Nano Banana Pro
Grok Image 2
Flux 2 Pro
Карточка банковского перевода
Промт:
Mobile banking transfer confirmation screen, neumorphic soft UI, rounded 24px card, amount in large tabular numerals, sender/recipient avatars, animated checkmark success state, pastel blue and white palette, iOS human interface guidelines
Nano Banana Pro
Grok Image 2
Flux 2 Pro
Онбординг для инвестиционного приложения
Промт:
Fintech onboarding illustration set, 3 screens (Welcome / Risk Profile / Goal Setting), flat isometric style, geometric shapes, muted teal and coral palette, subtle grain texture, friendly human figures, Stripe-inspired minimalism. Make it a usable PNG asset.
Nano Banana Pro
Grok Image 2
Flux 2 Pro
Гифки-баннеры 468x60 как в 2000-х
Промт:
Retro 2000s web banner set, 468x60 leaderboard format, animated GIF feel, Comic Sans and Impact fonts. Flashing "Under Construction" neon lime and hot pink palette caption, blinking text, Y2K kitsch. Make a sprite sheet for the caption animation to make it appear flashing. Make it a usable PNG asset.
Nano Banana Pro
Grok Image 2
Flux 2 Pro
Анимация кнопок
Промт:
"Web 1.0 style website UI asset sprite sheet. Retro 90s internet aesthetic. A grid of animated button states: normal, hover, pressed, disabled. Classic beveled 3D borders, chunky pixel edges, high-contrast colors (navy blue, silver gray, bright red, yellow, teal). Glossy gradient fills, 1px black outlines, drop shadows. Buttons labeled with pixel fonts are: 'Submit', 'Home', 'Click Here', 'Download'. Include tiny animated GIF-style effects: blinking, marquee shimmer, 'NEW!' badges. Sprite sheet layout with evenly spaced frames, transparent background, seamless looping animation frames. Style references: GeoCities, AOL, Windows 95, Netscape Navigator. Pixel art, 8-bit/16-bit, dithered shading, low resolution, aliased edges, vibrant retro palette."
Nano Banana Pro
Grok Image 2
Flux 2 Pro (несколько попыток)
Не смотря на сочный, душещипательно ностальгический дизайн кнопок, ни с одной из генерации Flux в цель не попала, что странно. Данная модель, работающая на принципе согласования потоков, проходила вполне надежное обучение и последовательная логика в генерации, а также работа с надписями не должны быть для нее чем-то сложными. Но тем не менее она почему-то рисует кнопки с функциями на неустановленном (возможно, клингонском) языке.
Дашборд углеродного следа
Промт:
Carbon footprint tracking dashboard, organic soft UI, earthy palette (sage green, terracotta, sand), circular progress rings, tree/leaf line icons, friendly rounded corners, paper texture subtlety, Patagonia brand aesthetic, light mode. Make it a usable PNG asset.
Nano Banana Pro
Grok Image 2
Flux 2 Pro
Карточки эко-товаров для маркетплейса
Промт:
Sustainable product cards, minimalist grid, recycled kraft paper texture, hand-drawn botanical illustrations, ingredient badges, "carbon neutral" tag, neutral beige palette, Etsy-meets-Aesop branding. Make it a usable PNG asset.
Nano Banana Pro
Grok Image 2
Flux 2 Pro
Мобильный трекер переработки
Промт:
Recycling habit tracker mobile app, playful flat illustrations, bin icons color-coded (plastic/glass/paper/organic), streak counter widget, confetti micro-interaction preview, Duolingo-style gamification, bright yet natural palette. Make it a usable PNG asset.
Nano Banana P
Grok Image 2
Flux 2 Pro
Чат-интерфейс AI-ассистента
Промт:
AI chat interface, streaming response animation frames, typing indicator (three dots pulse), message bubbles with gradient edge glow, code block styling with syntax highlight, dark violet-to-black background, Anthropic/OpenAI aesthetic, high fidelity. Make it a usable PNG asset.
Nano Banana Pro
Grok Image 2
Flux 2 Pro
Панель управления ML-моделью
Промт:
Make a web design asset: ML model monitoring dashboard, loss/accuracy line charts, confusion matrix heatmap, hyperparameter sliders, neuron network node visualization, dark terminal-inspired theme, monospace + Inter mix, lab-tech vibe. Make it a usable PNG asset.
Nano Banana Pro
Grok Image 2
Flux 2 Pro
Онбординг для генератора изображений
Промт:
Make a web design asset: AI image generator onboarding, prompt input hero, style preset thumbnails grid (anime, photoreal, watercolor, 3D render), aspect ratio selector, generation progress ring, sleek dark UI with iridescent accent gradients, Midjourney/DALL-E hybrid. Make it a usable PNG asset.
Nano Banana Pro
Grok Image 2
Flux 2 Pro
По результатам, Grok 2.0 и Nano Banana Pro хорошо справились с задачами, в то время как Flux допускал местами ошибки, особенно в текстовых надписях.
В остальном, нейронки показывают неплохую “насмотренность” и выдают приемлемый результат, попадая в эстетику сходу в большинстве случаев. С их помощью можно запросто накидать референсов веб-аутлета в любом формате — включая даже Web 1.0 из баснословных времен — для включения оных в техзадание. Либо, если писать более проработанные промты и выделить бюджет для большой серии генераций, то получится соорудить из них качественное тело для сайта.