Scene AI

SceneAI Landing Page Prompt

I. Global Background & Atmosphere

Background Asset: Use a high-quality video background (URL: https://cdn.sceneai.art/Hero%20Section%20Video/bea62976-0843-4cfc-9b03-209e2310838b.mp4).

Visual Style: The video should be fixed, filling the entire viewport with object-fit: cover.

Overlay Shape: Add a soft, black gradient blur "shape" on the left side (from 80% opacity at the left edge to transparent at 70% width) to ensure text legibility while keeping the 3D scene visible on the right.

General Theme: Dark mode, futuristic, minimal, using the "Inter" font family.

II. Top Navigation Bar

Structure: Fixed at the top with a "Glassmorphism" effect (blurred background, subtle white border-bottom).

Left Side: Company Logo (SceneAI) with a minimal white icon (delta/triangle style).

Center: Menu links (Home, How it works, Plans, Download) in uppercase, small font size, and high tracking/letter-spacing.

Right Side: * A square Discord/Social icon button with a glass effect.

A primary CTA button "Start building" with a dark translucent background and rounded corners.

III. Middle Elements (Hero Section)

Engine Tag: A pill-shaped tag containing a glowing purple "live" dot and the text "V2.0 Engine Now Live".

Heading: Large, bold typography ("Create awesome 3D scenes with AI"). Use tight line-height and a subtle drop shadow for depth.

Subtext: Concise 2-line description of the platform with high contrast for readability.

Call to Action Buttons:

Primary Button: "Generate Now" – Must feature a "border-rotate" conic-gradient animation (orange/gold colors). Include a circular arrow icon on the right side.

Secondary Button: "Watch Demo" – Large glassmorphic pill button with a subtle white border and blur.

Stats Section: Horizontal layout showing "Active Creators" and "Scenes Rendered" separated by a thin vertical divider.

IV. Bottom Elements (Footer)

Position: Fixed at the bottom of the viewport.

Content: Copyright notice on the left and utility links (Privacy, Support) on the right.

Style: Minimalist, tiny uppercase font, tracking-widest, and low opacity to keep focus on the hero content.

V. Technical Specs

Responsiveness: Fully fluid for mobile and desktop.

Interactions: Hover states for all buttons and smooth transitions for the conic-gradient animation.

Frameworks: Built using Tailwind CSS for layout and standard CSS for custom keyframe animations.