Lovart Email Section
In a marketing email, users glance once — this UI animation uses a fixed prompt bar plus a background asset collage to explain "one prompt, 40 brand assets" in a single frame.
In a marketing email, users glance once — this UI animation uses a fixed prompt bar plus a background asset collage to explain "one prompt, 40 brand assets" in a single frame.
An email section is not a landing page: there is no scroll room, and users will not watch frame by frame. The animation has to convey both "type one sentence" and "get a pile of cross-channel assets" inside one static canvas, at very high information density.
"Create 40 campaign assets for my brand" is concrete, but you cannot show all 40 items. A product screenshot alone leaves only the input bar in memory; a pile of assets alone hides where they came from. The core challenge: make volume and cause-and-effect feel true at the same time.
The input bar stays centered. The prompt field sits in the middle throughout. A typing animation fills in the full instruction first, anchoring user intent. However the background shifts, viewers know these outputs belong to one request.
Background goes from empty to full. The opening is near-blank — soft circular gradients only. Then Lovart brand assets — social covers, merch, color swatches, Voice Mode thumbnails — flow in from the edges and the collage density ramps up. Not 40 images popping at once, but a natural sense of the frame being filled.
Real assets, not a number. Platform badges (TikTok, LinkedIn, Shopify) sit on matching creatives, implying cross-channel delivery. The same logo repeats across formats, making "one brand, many shapes" clear without writing "40" on screen.
Typing and background are offset. While text is still appearing, the background stays restrained so motion does not fight for attention. Once the line is complete, the background accelerates — cause and effect read more clearly.
Collage layers use depth. Near assets scale up slightly, distant ones soften. Scale and opacity ramps in AE keep high density from turning into flat wallpaper.
Input UI on its own comp. The prompt bar lives on a top pre-comp so background motion never hurts legibility.
The rule for email UI motion: input and output must coexist in one frame, and the sequence should let viewers infer causality themselves. Keep the bar still, let the background tell the volume story — that beats any numeric headline.