Ice Cream Motion Landing Page

Hailuo @MiniMax_AI @Hailuo_AI H3

A prototype motion-graphics landing page for ice cream, built to test just how far H3 can push UI animation, typography, transitions, hover interactions, and product motion.

I tried creating similar effects manually in Adobe After Effects but this version is 100% generated with H3.

The model handles these complex motion-design elements incredibly well, and the results are STUNNING

- Animated Shape Layers
- Kinetic Typography
- Cursor Hover Update
- Bounce Effects
- Wiggle Effects
- Live Background
- Micro Text Renders
- Ease in Ease out Keyframes

Prompt Below

### 作者补充

[补充1]
Hailuo @MiniMax_AI @Hailuo_AI H3

A prototype motion-graphics landing page for ice cream, built to test just how far H3 can push UI animation, typography, transitions, hover interactions, and product motion.

I tried creating similar effects manually in Adobe After Effects but this version is 100% generated with H3.

The model handles these complex motion-design elements incredibly well, and the results are STUNNING

- Animated Shape Layers
- Kinetic Typography
- Cursor Hover Update
- Bounce Effects
- Wiggle Effects
- Live Background
- Micro Text Renders
- Ease in Ease out Keyframes

Prompt Below

[补充2]
Create a 15-second premium 16:9 animated ice-cream landing page using the uploaded six-ice-cream reference image Image1 as the exact product source. Build a funky cursor-driven experience where the cursor visibly hovers over Ice Cream 01, then 02, 03, 04, 05 and 06. 

Every hover instantly brings that exact ice cream into the hero area at approximately 70% screen height while changing the typography, background palette, motion graphics, particles and decorative elements. The interaction must clearly read: cursor hover → thumbnail reacts → matching hero appears → visual world transforms.  ART DIRECTION  Style: playful 3D e-commerce × Y2K graphics × contemporary editorial design × premium confectionery branding.

Use colorful organic blobs, checkerboards, wavy lines, spirals, squiggles, dots, stars, warped grids, floating spheres and hand-drawn shapes. Keep the design energetic but professionally composed. Each flavor gets its own visual identity while the website structure remains consistent. No HUD, sci-fi graphics, excessive glassmorphism or generic template styling. 

 TYPOGRAPHY  Use bold, chunky, rounded playful typography inspired by Cooper Black, Fredoka and inflated bubble lettering. Product names should be enormous, expressive and slightly irregular. Use a clean geometric sans serif for navigation and small labels. Headlines can squash, stretch and bounce during transitions but must always resolve into perfectly readable text.  

PRODUCTS  Use exactly: “01 — NOIR SWIRL”, “02 — MATCHA CLOUD”, “03 — CARAMEL TAIYAKI”, “04 — SAKURA DREAM”, “05 — DARK OBSESSION”, “06 — TROPICAL GOLD”. Preserve the exact product designs, toppings, colors, cones and proportions from the reference image.  

WEBSITE LAYOUT  Top-left: “SWIRL°”. Center: “FLAVORS     OUR STORY     SHOP”. Top-right: “BAG 00”. Place all six miniature ice creams along the bottom labeled “01   02   03   04   05   06”. The hovered thumbnail rises and enlarges. Position the selected hero slightly right of center at 70% screen height, with enormous product typography behind and beside it.  00:00–00:01 — INTRO  Open on a funky cream-yellow background. Organic blobs inflate, stars rotate, wavy lines draw themselves and colorful circles bounce into position. Reveal “SWIRL°”, navigation and all six product thumbnails with staggered spring motion. A circular cursor enters and approaches 01.  00:01–00:03 — 01 NOIR SWIRL  Cursor hovers “01”. Thumbnail 01 scales up and NOIR SWIRL launches into the hero area with 3D rotation and elastic overshoot. Display “NOIR SWIRL” and “DARK. BOLD. UNEXPECTED.” Background transforms to cream + charcoal with black spirals, checkerboards, bouncing spheres and ink-like circles. Tiny charcoal particles orbit the product. Hero subtly tilts toward the cursor.  00:03–00:05 — 02 MATCHA CLOUD  Cursor slides onto “02”. NOIR SWIRL squashes and exits while MATCHA CLOUD expands from thumbnail 02 into the hero position. Display “MATCHA CLOUD” and “EARTHY. SOFT. ADDICTIVE.” Change the environment to pistachio green + cream + red accents. Animate mochi circles, flowing matcha ribbons, warped checkerboards and rotating rings. Two mochi spheres briefly orbit the hero. Typography performs one soft rubber-like wobble.  00:05–00:07 — 03 CARAMEL TAIYAKI  Cursor hovers “03”. MATCHA CLOUD shrinks away while CARAMEL TAIYAKI flips into the hero stage. Display “CARAMEL TAIYAKI” and “CRISPY. GOLDEN. CREAMY.” Background becomes caramel orange + butter yellow + cream. Animate caramel rings, fish-inspired outlines, syrup curves, chunky stars and floating crumbs. A caramel wave sweeps behind the product.  00:07–00:09 — 04 SAKURA DREAM  Cursor moves onto “04”. SAKURA DREAM shoots diagonally into the hero position while the previous product exits. Display “SAKURA DREAM” and “SWEET. SOFT. DREAMY.” Transform the page into bubblegum pink + cream + cherry red. Add inflated pink blobs, abstract flowers, hand-drawn hearts, candy dots and flowing ribbons. The giant title briefly infl