AI AI 工具指南
AI 提示词库

App Onboarding 背景 Prompt:12 个能放在 UI 后面的

12 个 Onboarding 背景 Prompt——渐变、抽象母题、虚化摄影、动画静帧——读作氛围,不抢标题与 CTA 的戏。

发布于: 作者: AI Productivity Guide Team 🌐 查看英文版本

Onboarding 背景只有一个任务：作为氛围出现，不作为内容出现。叠在它上面的 UI 才是真正的主角(标题、插画、CTA)——背景要托住它们，不抢戏。下面这些 Prompt 强制低对比、大留白、构图重心放下三分之一，深浅色主题切换都站得住。完整生产流程见 AI App 背景图教程。

这套 Prompt 适合用在哪

  • Onboarding 流程——文字要全程清晰可读
  • Splash 屏淡入到首页
  • 空状态——要有温度但不分散注意力
  • 动画 onboarding 背景(导出 1080×2400 静帧)
  • 系统主题切换用的浅 / 深双版

1. 柔和渐变

minimal app background, smooth gradient pale blue to lavender, very low contrast, subtle abstract shapes in lower third, large empty space for UI in upper two thirds, 9:20 mobile aspect

2. 柔几何

minimal app background, two soft overlapping geometric shapes in lower-right corner, pastel palette, large negative space for UI overlay, blurred edges, 9:20 mobile aspect

3. 有机色块

minimal app background, single soft organic blob shape in lower-left corner, soft pastel peach to cream, lots of negative space for UI, 9:20 mobile aspect

4. 极光色带

色带横在下半，无细节。

minimal app background, diffuse aurora-like color band stretching across the lower half, gradient teal to soft magenta, heavy blur, no objects, upper two-thirds clean for UI, 9:20 mobile aspect

5. 浅 / 深双色版

同一构图、两套配色、一次出。

minimal app background, smooth dual-tone gradient with one soft circle in lower-right. Generate TWO versions side by side: (a) light mode — pale cream to dusty pink palette, (b) dark mode — deep navy to muted purple palette. Same composition, same crop, 9:20 mobile aspect each.

6. 失焦虚化

摄影感、光斑、整张虚化。

minimal app background, fully out-of-focus bokeh photograph, soft circular highlights in warm amber, deep negative space, no recognizable objects, vertical 9:20 phone aspect

7. 纸纹极简

有质感不繁——只有再生纸的颗粒。

minimal app background, recycled-paper texture, soft warm beige, no graphic elements, very subtle horizontal fold mark across lower third, large empty space for UI, 9:20 mobile aspect

8. 抽象波线

手绘感曲线，只出现在画面下三分之一。

minimal app background, single thin hand-drawn curving line sweeping across the lower third, soft sage-green palette, off-white field, lots of negative space above the curve for UI, 9:20 mobile aspect

9. 毛玻璃层

底层一个淡渐变，上面毛玻璃化。

minimal app background, frosted-glass blur over a faint pastel gradient, very low contrast, no objects, light bottom-edge gradient suggesting depth, 9:20 mobile aspect

10. 网格渐变

现代多色 mesh,柔和、不带方向。

minimal app background, soft multi-color mesh gradient blending blush, periwinkle, and pale sage, no objects, heavy blur, even brightness across the frame for UI legibility, 9:20 mobile aspect

11. 动画 onboarding 静帧

为 4 秒循环动画设计的静态背景。

minimal app background still frame designed to loop in a 4-second motion video, slowly drifting soft particles in the lower third only, deep navy field, large empty negative space in the upper two thirds, 9:20 mobile aspect

12. 同一观感的平板版

同样的观感、不同比例——配色和构图角必须一致。

minimal app background, same calm gradient and lower-corner blob composition as a phone onboarding background, re-rendered for tablet at 3:4 aspect, keep palette and corner composition identical, scale negative space to fit

怎么微调

按设备目标比例出图(--ar 9:20 新机型、9:16 老机型、3:4 平板)。上线前把你真实的标题文字铺在黑色色条上压到背景上测可读性——读不清就是太满了。最热闹的区域留在下三分之一，上三分之二让给标题和插画。多屏 onboarding 用相同 seed 重生成、只换配色，让相邻屏感觉是一组的。

容易踩的坑

  • 太满——纹理或图案抢 UI 文字，标题读不清
  • 标题区下面对比太高；永远把上三分之一留给 UI
  • 配色和品牌反着走而不是托着走
  • 一个比例打天下；手机、平板、深色态要一起出
  • 漏掉”标题可读性”那一步检查——单看好看，叠字就糊

相关阅读

标签: #App 背景

相关文章