bender/748387ee-7967-422d-831f-e140cce96712
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_1 into main #2

Merged
bender merged 5 commits from version_1 into main 2026-03-03 00:23:57 +00:00
Conversation 0 Commits 5 Files Changed 5 +131 -311
5 changed files with 131 additions and 311 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
src/app/contact/page.tsx
View File

@@ -1,10 +1,10 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
import ContactSplit from "@/components/sections/contact/ContactSplit";
import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
import FooterBase from "@/components/sections/footer/FooterBase";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FooterBase from '@/components/sections/footer/FooterBase';
import { HelpCircle } from "lucide-react";
export default function ContactPage() {
@@ -19,7 +19,7 @@ export default function ContactPage() {
borderRadius="pill"
contentWidth="smallMedium"
sizing="largeSizeMediumTitles"
background="noiseDiagonalGradient"
background="circleGradient"
cardStyle="subtle-shadow"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="solid"
@@ -30,14 +30,12 @@ export default function ContactPage() {
navItems={[
{ name: "Features", id: "features" },
{ name: "Pricing", id: "pricing" },
{ name: "How It Works", id: "how-it-works" },
{ name: "How It Works", id: "products" },
{ name: "Testimonials", id: "testimonials" },
{ name: "FAQ", id: "faq" },
]}
button={{
text: "Start Free Trial",
href: "/contact",
}}
text: "Start Free Trial", href: "contact"}}
brandName="ViralAI Studio"
/>
</div>
@@ -49,7 +47,7 @@ export default function ContactPage() {
description="Get the latest features, tips, and best practices delivered to your inbox. Join our creator community and never miss an update."
background={{ variant: "sparkles-gradient" }}
useInvertedBackground={false}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/abstract-technology-background-with-warm-1772497231143-4baf05db.png?_wi=2"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/abstract-technology-background-with-warm-1772497231143-4baf05db.png"
imageAlt="ViralAI Studio technology background"
mediaAnimation="slide-up"
mediaPosition="left"
@@ -64,20 +62,11 @@ export default function ContactPage() {
<FaqSplitMedia
faqs={[
{
id: "1",
title: "How does AI highlight detection work?",
content: "Our AI analyzes video content using advanced machine learning models to identify moments with high engagement potential. It considers factors like visual changes, audio peaks, scene transitions, and sentiment analysis. The system learns from viral content patterns to ensure your shorts have maximum impact.",
},
id: "1", title: "How does AI highlight detection work?", content: "Our AI analyzes video content using advanced machine learning models to identify moments with high engagement potential. It considers factors like visual changes, audio peaks, scene transitions, and sentiment analysis. The system learns from viral content patterns to ensure your shorts have maximum impact."},
{
id: "2",
title: "What video formats are supported?",
content: "ViralAI Studio supports MP4, MOV, AVI, MKV, and WebM formats. We can process videos in any resolution from 720p to 8K, and automatically optimize them for your chosen export format. Upload larger files with our cloud processing or batch upload multiple videos.",
},
id: "2", title: "What video formats are supported?", content: "ViralAI Studio supports MP4, MOV, AVI, MKV, and WebM formats. We can process videos in any resolution from 720p to 8K, and automatically optimize them for your chosen export format. Upload larger files with our cloud processing or batch upload multiple videos."},
{
id: "3",
title: "Can I export to multiple platforms at once?",
content: "Yes! One of our key features is simultaneous multi-platform export. Generate 16:9 (YouTube), 9:16 (TikTok/Reels), and 1:1 (Instagram Feed) versions in a single click. You can also set up direct posting to your social media accounts with our integrations.",
},
id: "3", title: "Can I export to multiple platforms at once?", content: "Yes! One of our key features is simultaneous multi-platform export. Generate 16:9 (YouTube), 9:16 (TikTok/Reels), and 1:1 (Instagram Feed) versions in a single click. You can also set up direct posting to your social media accounts with our integrations."},
]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/friendly-customer-support-representative-1772497230606-2e080611.png"
imageAlt="ViralAI Studio customer support"
@@ -120,17 +109,15 @@ export default function ContactPage() {
<FooterBase
columns={[
{
title: "Product",
items: [
{ label: "Features", href: "/features" },
{ label: "Pricing", href: "/pricing" },
title: "Product", items: [
{ label: "Features", href: "features" },
{ label: "Pricing", href: "pricing" },
{ label: "API Docs", href: "https://docs.viralaistudio.com" },
{ label: "Roadmap", href: "#" },
],
},
{
title: "Company",
items: [
title: "Company", items: [
{ label: "About Us", href: "#" },
{ label: "Blog", href: "https://blog.viralaistudio.com" },
{ label: "Careers", href: "#" },
@@ -138,10 +125,9 @@ export default function ContactPage() {
],
},
{
title: "Support",
items: [
{ label: "Help Center", href: "#faq" },
{ label: "Contact", href: "/contact" },
title: "Support", items: [
{ label: "Help Center", href: "faq" },
{ label: "Contact", href: "contact" },
{ label: "Community", href: "#" },
{ label: "Status Page", href: "#" },
],

80
src/app/features/page.tsx
View File

@@ -1,10 +1,10 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
import FeatureBorderGlow from "@/components/sections/feature/featureBorderGlow/FeatureBorderGlow";
import ProductCardOne from "@/components/sections/product/ProductCardOne";
import FooterBase from "@/components/sections/footer/FooterBase";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import FooterBase from '@/components/sections/footer/FooterBase';
import Link from "next/link";
import { Zap, Type, Globe, Palette, Music, Image as ImageIcon, Sparkles } from "lucide-react";
@@ -16,7 +16,7 @@ export default function FeaturesPage() {
borderRadius="pill"
contentWidth="smallMedium"
sizing="largeSizeMediumTitles"
background="noiseDiagonalGradient"
background="circleGradient"
cardStyle="subtle-shadow"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="solid"
@@ -27,14 +27,12 @@ export default function FeaturesPage() {
navItems={[
{ name: "Features", id: "features" },
{ name: "Pricing", id: "pricing" },
{ name: "How It Works", id: "how-it-works" },
{ name: "How It Works", id: "products" },
{ name: "Testimonials", id: "testimonials" },
{ name: "FAQ", id: "faq" },
]}
button={{
text: "Start Free Trial",
href: "/contact",
}}
text: "Start Free Trial", href: "contact"}}
brandName="ViralAI Studio"
/>
</div>
@@ -44,34 +42,22 @@ export default function FeaturesPage() {
features={[
{
icon: Zap,
title: "Long Video to Viral Shorts",
description: "Upload MP4/MOV files and automatically detect highlights. AI generates optimized 9:16, 16:9, and 1:1 formats with auto-zoom and transitions.",
},
title: "Long Video to Viral Shorts", description: "Upload MP4/MOV files and automatically detect highlights. AI generates optimized 9:16, 16:9, and 1:1 formats with auto-zoom and transitions."},
{
icon: Type,
title: "AI Auto Caption Generator",
description: "Speech-to-text transcription with animated TikTok-style captions. Multi-language subtitle support and customizable caption styles.",
},
title: "AI Auto Caption Generator", description: "Speech-to-text transcription with animated TikTok-style captions. Multi-language subtitle support and customizable caption styles."},
{
icon: Globe,
title: "Video Translation & Dubbing",
description: "Translate videos into any language with AI voice cloning and lip-sync support. Reach global audiences effortlessly.",
},
title: "Video Translation & Dubbing", description: "Translate videos into any language with AI voice cloning and lip-sync support. Reach global audiences effortlessly."},
{
icon: Palette,
title: "Cartoon & Animation Generator",
description: "Convert real video into 3D, Anime, or Sketch animation styles. Add AI avatar presenters for personalized content.",
},
title: "Cartoon & Animation Generator", description: "Convert real video into 3D, Anime, or Sketch animation styles. Add AI avatar presenters for personalized content."},
{
icon: Music,
title: "Beat Sync Editing",
description: "Upload music and auto-cut videos to beat drops. Add transitions synchronized perfectly to music tempo.",
},
title: "Beat Sync Editing", description: "Upload music and auto-cut videos to beat drops. Add transitions synchronized perfectly to music tempo."},
{
icon: ImageIcon,
title: "Auto Thumbnail Generator",
description: "AI face detection, viral YouTube templates, and bold text overlays. Generate thumbnails that maximize click-through rates.",
},
title: "Auto Thumbnail Generator", description: "AI face detection, viral YouTube templates, and bold text overlays. Generate thumbnails that maximize click-through rates."},
]}
title="Powerful AI-Driven Features"
description="Everything creators need to produce viral content at scale. From intelligent video analysis to automated editing, ViralAI Studio handles the heavy lifting."
@@ -83,30 +69,15 @@ export default function FeaturesPage() {
/>
</div>
<div id="how-it-works" data-section="how-it-works">
<div id="products" data-section="products">
<ProductCardOne
products={[
{
id: "1",
name: "Smart Highlight Detection",
price: "AI-Powered",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/visual-representation-of-video-conversio-1772497231109-892372a4.png?_wi=2",
imageAlt: "Video conversion to shorts",
},
id: "1", name: "Smart Highlight Detection", price: "AI-Powered", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/visual-representation-of-video-conversio-1772497231109-892372a4.png", imageAlt: "Video conversion to shorts"},
{
id: "2",
name: "Animated Captions",
price: "Multi-Language",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/modern-video-frame-showing-ai-generated--1772497231199-6a63da07.png?_wi=2",
imageAlt: "AI-generated animated captions",
},
id: "2", name: "Animated Captions", price: "Multi-Language", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/modern-video-frame-showing-ai-generated--1772497231199-6a63da07.png", imageAlt: "AI-generated animated captions"},
{
id: "3",
name: "Animation Styles",
price: "Multiple Formats",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/showcase-multiple-animation-style-conver-1772497231229-b973d03e.png?_wi=2",
imageAlt: "Animation style conversions",
},
id: "3", name: "Animation Styles", price: "Multiple Formats", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/showcase-multiple-animation-style-conver-1772497231229-b973d03e.png", imageAlt: "Animation style conversions"},
]}
title="Key Video Processing Features"
description="Comprehensive toolkit for modern content creators. Each feature is optimized for viral content generation and multi-platform publishing."
@@ -150,17 +121,15 @@ export default function FeaturesPage() {
<FooterBase
columns={[
{
title: "Product",
items: [
{ label: "Features", href: "/features" },
{ label: "Pricing", href: "/pricing" },
title: "Product", items: [
{ label: "Features", href: "features" },
{ label: "Pricing", href: "pricing" },
{ label: "API Docs", href: "https://docs.viralaistudio.com" },
{ label: "Roadmap", href: "#" },
],
},
{
title: "Company",
items: [
title: "Company", items: [
{ label: "About Us", href: "#" },
{ label: "Blog", href: "https://blog.viralaistudio.com" },
{ label: "Careers", href: "#" },
@@ -168,10 +137,9 @@ export default function FeaturesPage() {
],
},
{
title: "Support",
items: [
{ label: "Help Center", href: "#faq" },
{ label: "Contact", href: "/contact" },
title: "Support", items: [
{ label: "Help Center", href: "faq" },
{ label: "Contact", href: "contact" },
{ label: "Community", href: "#" },
{ label: "Status Page", href: "#" },
],

27
src/app/layout.tsx
View File

@@ -5,38 +5,23 @@ import { ServiceWrapper } from "@/components/ServiceWrapper";
import Tag from "@/tag/Tag";
const raleway = Raleway({
variable: "--font-raleway",
subsets: ["latin"],
variable: "--font-raleway", subsets: ["latin"],
});
export const metadata: Metadata = {
title: "ViralAI Studio - AI Video Editing for Creators",
description: "Transform long-form videos into viral shorts with AI. Auto-captions, animations, beat-sync, and multi-platform export. Start free today.",
keywords: "AI video editor, short form video, TikTok creator, video editing software, viral content creation",
robots: {
title: "ViralAI Studio - AI Video Editing for Creators", description: "Transform long-form videos into viral shorts with AI. Auto-captions, animations, beat-sync, and multi-platform export. Start free today.", keywords: "AI video editor, short form video, TikTok creator, video editing software, viral content creation", robots: {
index: true,
follow: true,
},
openGraph: {
title: "ViralAI Studio - Create Viral Videos with AI",
description: "AI-powered video editing platform for creators. Convert long videos to shorts, add captions, animations, and export to all platforms.",
url: "https://viralaistudio.com",
siteName: "ViralAI Studio",
type: "website",
images: [
title: "ViralAI Studio - Create Viral Videos with AI", description: "AI-powered video editing platform for creators. Convert long videos to shorts, add captions, animations, and export to all platforms.", url: "https://viralaistudio.com", siteName: "ViralAI Studio", type: "website", images: [
{
url: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/a-sleek-modern-video-editing-dashboard-i-1772497231603-8bde64ed.png",
alt: "ViralAI Studio Dashboard",
},
url: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/a-sleek-modern-video-editing-dashboard-i-1772497231603-8bde64ed.png", alt: "ViralAI Studio Dashboard"},
],
},
twitter: {
card: "summary_large_image",
title: "ViralAI Studio - Create Viral Videos with AI",
description: "AI-powered video editing. Short-form content creation made easy.",
images: [
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/a-sleek-modern-video-editing-dashboard-i-1772497231603-8bde64ed.png",
],
card: "summary_large_image", title: "ViralAI Studio - Create Viral Videos with AI", description: "AI-powered video editing. Short-form content creation made easy.", images: [
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/a-sleek-modern-video-editing-dashboard-i-1772497231603-8bde64ed.png"],
},
};

165
src/app/page.tsx
View File

@@ -1,15 +1,15 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
import HeroLogoBillboardSplit from "@/components/sections/hero/HeroLogoBillboardSplit";
import FeatureBorderGlow from "@/components/sections/feature/featureBorderGlow/FeatureBorderGlow";
import ProductCardOne from "@/components/sections/product/ProductCardOne";
import TestimonialCardSixteen from "@/components/sections/testimonial/TestimonialCardSixteen";
import ContactSplit from "@/components/sections/contact/ContactSplit";
import FooterBase from "@/components/sections/footer/FooterBase";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroLogoBillboardSplit from '@/components/sections/hero/HeroLogoBillboardSplit';
import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterBase from '@/components/sections/footer/FooterBase';
import Link from "next/link";
import { Zap, Type, Globe, Palette, Music, Image as ImageIcon, Sparkles, CreditCard, Heart, HelpCircle } from "lucide-react";
import { Zap, Type, Globe, Palette, Music, Image as ImageIcon, Sparkles, Heart, HelpCircle, CreditCard } from "lucide-react";
export default function HomePage() {
const handleNewsletterSubmit = (email: string) => {
@@ -23,7 +23,7 @@ export default function HomePage() {
borderRadius="pill"
contentWidth="smallMedium"
sizing="largeSizeMediumTitles"
background="noiseDiagonalGradient"
background="circleGradient"
cardStyle="subtle-shadow"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="solid"
@@ -34,14 +34,12 @@ export default function HomePage() {
navItems={[
{ name: "Features", id: "features" },
{ name: "Pricing", id: "pricing" },
{ name: "How It Works", id: "how-it-works" },
{ name: "How It Works", id: "products" },
{ name: "Testimonials", id: "testimonials" },
{ name: "FAQ", id: "faq" },
]}
button={{
text: "Start Free Trial",
href: "/contact",
}}
text: "Start Free Trial", href: "contact"}}
brandName="ViralAI Studio"
/>
</div>
@@ -50,9 +48,9 @@ export default function HomePage() {
<HeroLogoBillboardSplit
logoText="VIRAL AI STUDIO"
description="Transform long-form videos into viral shorts. AI-powered editing, auto-captions, beat-sync transitions, and multi-platform export in seconds. Create TikTok, Reels, and YouTube content automatically."
background={{ variant: "noiseDiagonalGradient" }}
background={{ variant: "radial-gradient" }}
buttons={[
{ text: "Start Free Trial", href: "/contact" },
{ text: "Start Free Trial", href: "contact" },
{ text: "View Demo", href: "https://example.com/demo" },
]}
layoutOrder="default"
@@ -69,34 +67,22 @@ export default function HomePage() {
features={[
{
icon: Zap,
title: "Long Video to Viral Shorts",
description: "Upload MP4/MOV files and automatically detect highlights. AI generates optimized 9:16, 16:9, and 1:1 formats with auto-zoom and transitions.",
},
title: "Long Video to Viral Shorts", description: "Upload MP4/MOV files and automatically detect highlights. AI generates optimized 9:16, 16:9, and 1:1 formats with auto-zoom and transitions."},
{
icon: Type,
title: "AI Auto Caption Generator",
description: "Speech-to-text transcription with animated TikTok-style captions. Multi-language subtitle support and customizable caption styles.",
},
title: "AI Auto Caption Generator", description: "Speech-to-text transcription with animated TikTok-style captions. Multi-language subtitle support and customizable caption styles."},
{
icon: Globe,
title: "Video Translation & Dubbing",
description: "Translate videos into any language with AI voice cloning and lip-sync support. Reach global audiences effortlessly.",
},
title: "Video Translation & Dubbing", description: "Translate videos into any language with AI voice cloning and lip-sync support. Reach global audiences effortlessly."},
{
icon: Palette,
title: "Cartoon & Animation Generator",
description: "Convert real video into 3D, Anime, or Sketch animation styles. Add AI avatar presenters for personalized content.",
},
title: "Cartoon & Animation Generator", description: "Convert real video into 3D, Anime, or Sketch animation styles. Add AI avatar presenters for personalized content."},
{
icon: Music,
title: "Beat Sync Editing",
description: "Upload music and auto-cut videos to beat drops. Add transitions synchronized perfectly to music tempo.",
},
title: "Beat Sync Editing", description: "Upload music and auto-cut videos to beat drops. Add transitions synchronized perfectly to music tempo."},
{
icon: ImageIcon,
title: "Auto Thumbnail Generator",
description: "AI face detection, viral YouTube templates, and bold text overlays. Generate thumbnails that maximize click-through rates.",
},
title: "Auto Thumbnail Generator", description: "AI face detection, viral YouTube templates, and bold text overlays. Generate thumbnails that maximize click-through rates."},
]}
title="Powerful AI-Driven Features"
description="Everything creators need to produce viral content at scale. From intelligent video analysis to automated editing, ViralAI Studio handles the heavy lifting."
@@ -108,51 +94,21 @@ export default function HomePage() {
/>
</div>
<div id="how-it-works" data-section="how-it-works">
<div id="products" data-section="products">
<ProductCardOne
products={[
{
id: "1",
name: "Smart Highlight Detection",
price: "AI-Powered",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/visual-representation-of-video-conversio-1772497231109-892372a4.png?_wi=1",
imageAlt: "Video conversion to shorts",
},
id: "1", name: "Smart Highlight Detection", price: "AI-Powered", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/visual-representation-of-video-conversio-1772497231109-892372a4.png", imageAlt: "Video conversion to shorts"},
{
id: "2",
name: "Animated Captions",
price: "Multi-Language",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/modern-video-frame-showing-ai-generated--1772497231199-6a63da07.png?_wi=1",
imageAlt: "AI-generated animated captions",
},
id: "2", name: "Animated Captions", price: "Multi-Language", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/modern-video-frame-showing-ai-generated--1772497231199-6a63da07.png", imageAlt: "AI-generated animated captions"},
{
id: "3",
name: "Animation Styles",
price: "Multiple Formats",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/showcase-multiple-animation-style-conver-1772497231229-b973d03e.png?_wi=1",
imageAlt: "Animation style conversions",
},
id: "3", name: "Animation Styles", price: "Multiple Formats", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/showcase-multiple-animation-style-conver-1772497231229-b973d03e.png", imageAlt: "Animation style conversions"},
{
id: "4",
name: "Beat Synchronization",
price: "Auto-Aligned",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/music-beat-sync-editing-visualization-sh-1772497231286-61822367.png",
imageAlt: "Music beat sync editing",
},
id: "4", name: "Beat Synchronization", price: "Auto-Aligned", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/music-beat-sync-editing-visualization-sh-1772497231286-61822367.png", imageAlt: "Music beat sync editing"},
{
id: "5",
name: "Smart Thumbnails",
price: "Face Detection",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/youtube-thumbnail-generator-interface-di-1772497232751-cf1f8bb8.png",
imageAlt: "YouTube thumbnail generator",
},
id: "5", name: "Smart Thumbnails", price: "Face Detection", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/youtube-thumbnail-generator-interface-di-1772497232751-cf1f8bb8.png", imageAlt: "YouTube thumbnail generator"},
{
id: "6",
name: "Multi-Platform Export",
price: "One Click",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/social-media-export-interface-showing-si-1772497231438-df4e3d62.png",
imageAlt: "Social media export interface",
},
id: "6", name: "Multi-Platform Export", price: "One Click", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/social-media-export-interface-showing-si-1772497231438-df4e3d62.png", imageAlt: "Social media export interface"},
]}
title="Key Video Processing Features"
description="Comprehensive toolkit for modern content creators. Each feature is optimized for viral content generation and multi-platform publishing."
@@ -165,41 +121,28 @@ export default function HomePage() {
/>
</div>
<div id="pricing" data-section="pricing">
<div className="mx-auto px-4 md:px-6 py-20">
<h2 className="text-4xl font-light mb-4">Flexible Subscription Plans</h2>
<p className="text-lg mb-12">Choose the perfect plan for your creative needs. Upgrade or downgrade anytime with no hidden fees.</p>
</div>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSixteen
testimonials={[
{
id: "1",
name: "Sarah Chen",
role: "Content Creator",
company: "SarahCreates",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/professional-headshot-of-a-content-creat-1772497229916-9dd35fab.png?_wi=1",
},
id: "1", name: "Sarah Chen", role: "Content Creator", company: "SarahCreates", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/professional-headshot-of-a-content-creat-1772497229916-9dd35fab.png"},
{
id: "2",
name: "Marcus Johnson",
role: "YouTube Producer",
company: "Epic Productions",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/young-female-video-editor-creator-in-a-c-1772497230751-a76dc93c.png?_wi=1",
},
id: "2", name: "Marcus Johnson", role: "YouTube Producer", company: "Epic Productions", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/young-female-video-editor-creator-in-a-c-1772497230751-a76dc93c.png"},
{
id: "3",
name: "Emma Rodriguez",
role: "TikTok Creator",
company: "ViralVibes",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/male-filmmaker-content-creator-in-casual-1772497230900-ce88c137.png?_wi=1",
},
id: "3", name: "Emma Rodriguez", role: "TikTok Creator", company: "ViralVibes", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/male-filmmaker-content-creator-in-casual-1772497230900-ce88c137.png"},
{
id: "4",
name: "Alex Kim",
role: "Video Director",
company: "Creative Studio Co",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/female-tiktok-social-media-creator-in-mo-1772497230988-d3cc123f.png",
},
id: "4", name: "Alex Kim", role: "Video Director", company: "Creative Studio Co", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/female-tiktok-social-media-creator-in-mo-1772497230988-d3cc123f.png"},
]}
kpiItems={[
{ value: "10x", label: "Faster video editing" },
@@ -216,13 +159,6 @@ export default function HomePage() {
/>
</div>
<div id="pricing" data-section="pricing">
<div className="mx-auto px-4 md:px-6">
<h2 className="text-4xl font-light mb-4">Flexible Subscription Plans</h2>
<p className="text-lg mb-12">Choose the perfect plan for your creative needs. Upgrade or downgrade anytime with no hidden fees.</p>
</div>
</div>
<div id="faq" data-section="faq">
<div className="mx-auto px-4 md:px-6 mb-12">
<h2 className="text-4xl font-light mb-4">Frequently Asked Questions</h2>
@@ -237,7 +173,7 @@ export default function HomePage() {
description="Get the latest features, tips, and best practices delivered to your inbox. Join our creator community and never miss an update."
background={{ variant: "sparkles-gradient" }}
useInvertedBackground={false}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/abstract-technology-background-with-warm-1772497231143-4baf05db.png?_wi=1"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/abstract-technology-background-with-warm-1772497231143-4baf05db.png"
imageAlt="ViralAI Studio technology background"
mediaAnimation="slide-up"
mediaPosition="left"
@@ -252,17 +188,15 @@ export default function HomePage() {
<FooterBase
columns={[
{
title: "Product",
items: [
{ label: "Features", href: "/features" },
{ label: "Pricing", href: "/pricing" },
title: "Product", items: [
{ label: "Features", href: "features" },
{ label: "Pricing", href: "pricing" },
{ label: "API Docs", href: "https://docs.viralaistudio.com" },
{ label: "Roadmap", href: "#" },
],
},
{
title: "Company",
items: [
title: "Company", items: [
{ label: "About Us", href: "#" },
{ label: "Blog", href: "https://blog.viralaistudio.com" },
{ label: "Careers", href: "#" },
@@ -270,10 +204,9 @@ export default function HomePage() {
],
},
{
title: "Support",
items: [
{ label: "Help Center", href: "#faq" },
{ label: "Contact", href: "/contact" },
title: "Support", items: [
{ label: "Help Center", href: "faq" },
{ label: "Contact", href: "contact" },
{ label: "Community", href: "#" },
{ label: "Status Page", href: "#" },
],

120
src/app/pricing/page.tsx
View File

@@ -1,10 +1,10 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
import PricingCardTwo from "@/components/sections/pricing/PricingCardTwo";
import TestimonialCardSixteen from "@/components/sections/testimonial/TestimonialCardSixteen";
import FooterBase from "@/components/sections/footer/FooterBase";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import FooterBase from '@/components/sections/footer/FooterBase';
import { Sparkles, Heart, CreditCard } from "lucide-react";
export default function PricingPage() {
@@ -15,7 +15,7 @@ export default function PricingPage() {
borderRadius="pill"
contentWidth="smallMedium"
sizing="largeSizeMediumTitles"
background="noiseDiagonalGradient"
background="circleGradient"
cardStyle="subtle-shadow"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="solid"
@@ -26,14 +26,12 @@ export default function PricingPage() {
navItems={[
{ name: "Features", id: "features" },
{ name: "Pricing", id: "pricing" },
{ name: "How It Works", id: "how-it-works" },
{ name: "How It Works", id: "products" },
{ name: "Testimonials", id: "testimonials" },
{ name: "FAQ", id: "faq" },
]}
button={{
text: "Start Free Trial",
href: "/contact",
}}
text: "Start Free Trial", href: "contact"}}
brandName="ViralAI Studio"
/>
</div>
@@ -42,63 +40,31 @@ export default function PricingPage() {
<PricingCardTwo
plans={[
{
id: "free",
badge: "Starter Plan",
badgeIcon: Sparkles,
price: "Free",
subtitle: "Perfect for trying out ViralAI Studio",
buttons: [
{ text: "Get Started", href: "/contact" },
id: "free", badge: "Starter Plan", badgeIcon: Sparkles,
price: "Free", subtitle: "Perfect for trying out ViralAI Studio", buttons: [
{ text: "Get Started", href: "contact" },
{ text: "Learn More", href: "/" },
],
features: [
"3 AI-generated shorts per month",
"Basic caption generation",
"Standard animation styles",
"720p export quality",
"Single platform export",
],
"3 AI-generated shorts per month", "Basic caption generation", "Standard animation styles", "720p export quality", "Single platform export"],
},
{
id: "pro",
badge: "Pro Plan",
badgeIcon: Sparkles,
price: "$29/month",
subtitle: "Ideal for active content creators",
buttons: [
{ text: "Start Pro Trial", href: "/contact" },
{ text: "Chat to Sales", href: "/contact" },
id: "pro", badge: "Pro Plan", badgeIcon: Sparkles,
price: "$29/month", subtitle: "Ideal for active content creators", buttons: [
{ text: "Start Pro Trial", href: "contact" },
{ text: "Chat to Sales", href: "contact" },
],
features: [
"Unlimited AI-generated shorts",
"Advanced animated captions",
"All animation styles (3D, Anime, Sketch)",
"4K export quality",
"Multi-platform simultaneous export",
"AI avatar presenter",
"Priority support",
],
"Unlimited AI-generated shorts", "Advanced animated captions", "All animation styles (3D, Anime, Sketch)", "4K export quality", "Multi-platform simultaneous export", "AI avatar presenter", "Priority support"],
},
{
id: "premium",
badge: "Premium Plan",
badgeIcon: Sparkles,
price: "$99/month",
subtitle: "For professional studios and agencies",
buttons: [
{ text: "Start Premium", href: "/contact" },
{ text: "Custom Quote", href: "/contact" },
id: "premium", badge: "Premium Plan", badgeIcon: Sparkles,
price: "$99/month", subtitle: "For professional studios and agencies", buttons: [
{ text: "Start Premium", href: "contact" },
{ text: "Custom Quote", href: "contact" },
],
features: [
"Unlimited everything",
"Video translation to 50+ languages",
"Advanced lip-sync technology",
"8K export quality",
"API access for integrations",
"White-label options",
"Dedicated account manager",
"Custom branding templates",
],
"Unlimited everything", "Video translation to 50+ languages", "Advanced lip-sync technology", "8K export quality", "API access for integrations", "White-label options", "Dedicated account manager", "Custom branding templates"],
},
]}
title="Flexible Subscription Plans"
@@ -115,29 +81,14 @@ export default function PricingPage() {
<TestimonialCardSixteen
testimonials={[
{
id: "1",
name: "Sarah Chen",
role: "Content Creator",
company: "SarahCreates",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/professional-headshot-of-a-content-creat-1772497229916-9dd35fab.png?_wi=2",
},
id: "1", name: "Sarah Chen", role: "Content Creator", company: "SarahCreates", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/professional-headshot-of-a-content-creat-1772497229916-9dd35fab.png"},
{
id: "2",
name: "Marcus Johnson",
role: "YouTube Producer",
company: "Epic Productions",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/young-female-video-editor-creator-in-a-c-1772497230751-a76dc93c.png?_wi=2",
},
id: "2", name: "Marcus Johnson", role: "YouTube Producer", company: "Epic Productions", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/young-female-video-editor-creator-in-a-c-1772497230751-a76dc93c.png"},
{
id: "3",
name: "Emma Rodriguez",
role: "TikTok Creator",
company: "ViralVibes",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/male-filmmaker-content-creator-in-casual-1772497230900-ce88c137.png?_wi=2",
},
id: "3", name: "Emma Rodriguez", role: "TikTok Creator", company: "ViralVibes", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APaxq631vx47XjqYF1A9jKfIGG/male-filmmaker-content-creator-in-casual-1772497230900-ce88c137.png"},
]}
kpiItems={[
{ value: "10x", label: "Faster video editing" },
@@ -182,17 +133,15 @@ export default function PricingPage() {
<FooterBase
columns={[
{
title: "Product",
items: [
{ label: "Features", href: "/features" },
{ label: "Pricing", href: "/pricing" },
title: "Product", items: [
{ label: "Features", href: "features" },
{ label: "Pricing", href: "pricing" },
{ label: "API Docs", href: "https://docs.viralaistudio.com" },
{ label: "Roadmap", href: "#" },
],
},
{
title: "Company",
items: [
title: "Company", items: [
{ label: "About Us", href: "#" },
{ label: "Blog", href: "https://blog.viralaistudio.com" },
{ label: "Careers", href: "#" },
@@ -200,10 +149,9 @@ export default function PricingPage() {
],
},
{
title: "Support",
items: [
{ label: "Help Center", href: "#faq" },
{ label: "Contact", href: "/contact" },
title: "Support", items: [
{ label: "Help Center", href: "faq" },
{ label: "Contact", href: "contact" },
{ label: "Community", href: "#" },
{ label: "Status Page", href: "#" },
],