156 Commits

Author SHA1 Message Date
6c9cb6767a Update src/app/page.tsx 2026-03-09 23:54:24 +00:00
3117bfa553 Update src/app/page.tsx 2026-03-09 23:53:33 +00:00
fcbc5d79e3 Update src/app/page.tsx 2026-03-09 23:52:24 +00:00
83784db2d4 Merge version_30 into main
Merge version_30 into main
2026-03-09 15:53:18 +00:00
bb036a71c1 Update src/app/layout.tsx 2026-03-09 15:53:14 +00:00
f805b5f5da Merge version_30 into main
Merge version_30 into main
2026-03-09 15:52:13 +00:00
e3cfb26532 Update src/app/page.tsx 2026-03-09 15:52:09 +00:00
ae02074a75 Update src/app/layout.tsx 2026-03-09 15:52:09 +00:00
cce55dc6d8 Merge version_29 into main
Merge version_29 into main
2026-03-09 13:53:57 +00:00
60de093eed Update src/app/page.tsx 2026-03-09 13:53:53 +00:00
51fea41093 Merge version_28 into main
Merge version_28 into main
2026-03-09 13:47:37 +00:00
0caadc2db6 Update src/app/page.tsx 2026-03-09 13:47:33 +00:00
60041290b4 Merge version_27 into main
Merge version_27 into main
2026-03-09 13:40:21 +00:00
662dde5c2e Update src/app/page.tsx 2026-03-09 13:40:17 +00:00
75fc83bab8 Update src/app/layout.tsx 2026-03-09 13:40:16 +00:00
1576cdc334 Merge version_26 into main
Merge version_26 into main
2026-03-09 13:36:42 +00:00
0b3045eda6 Update src/app/page.tsx 2026-03-09 13:36:38 +00:00
8ddb5d7b64 Update src/app/layout.tsx 2026-03-09 13:36:37 +00:00
dedf4b0752 Merge version_25 into main
Merge version_25 into main
2026-03-07 07:29:09 +00:00
f33b1d8ff5 Update src/app/page.tsx 2026-03-07 07:29:05 +00:00
8060f0dc6f Update src/app/layout.tsx 2026-03-07 07:29:04 +00:00
033937a08c Switch to version 23: modified src/app/page.tsx 2026-03-07 07:26:21 +00:00
1b63d1b19b Switch to version 23: modified src/app/layout.tsx 2026-03-07 07:26:20 +00:00
fc373efcec Merge version_24 into main
Merge version_24 into main
2026-03-07 07:23:55 +00:00
1df41c0c1e Update src/app/page.tsx 2026-03-07 07:23:50 +00:00
342d16373c Update src/app/layout.tsx 2026-03-07 07:23:50 +00:00
fa55e77820 Merge version_23 into main
Merge version_23 into main
2026-03-07 02:32:56 +00:00
1930d06fe2 Update src/app/page.tsx 2026-03-07 02:32:52 +00:00
9e8c6e67d1 Merge version_23 into main
Merge version_23 into main
2026-03-07 02:31:06 +00:00
6093c0b799 Update src/app/page.tsx 2026-03-07 02:31:02 +00:00
a2f8453fe9 Merge version_22 into main
Merge version_22 into main
2026-03-07 02:25:28 +00:00
73efafef66 Update src/app/page.tsx 2026-03-07 02:25:18 +00:00
3e77d4ef4e Merge version_21 into main
Merge version_21 into main
2026-03-07 02:20:55 +00:00
67c3e23ddd Update theme colors 2026-03-07 02:20:48 +00:00
1582bd7bfc Merge version_21 into main
Merge version_21 into main
2026-03-06 05:33:31 +00:00
ac78910b26 Update theme colors 2026-03-06 05:33:25 +00:00
768bfa6ce3 Merge version_21 into main
Merge version_21 into main
2026-03-06 05:32:46 +00:00
f884879659 Update theme colors 2026-03-06 05:32:40 +00:00
4764ffea99 Merge version_21 into main
Merge version_21 into main
2026-03-05 13:54:12 +00:00
cc382f7a71 Update src/app/page.tsx 2026-03-05 13:54:05 +00:00
cfe6423a01 Merge version_20 into main
Merge version_20 into main
2026-03-05 13:47:37 +00:00
9708909a0c Update src/app/page.tsx 2026-03-05 13:47:32 +00:00
234de6419c Update src/app/layout.tsx 2026-03-05 13:47:32 +00:00
83414f666a Merge version_19 into main
Merge version_19 into main
2026-03-05 13:42:53 +00:00
b0210d44ff Update src/app/thank-you/page.tsx 2026-03-05 13:42:49 +00:00
4ddd0fae64 Update src/app/page.tsx 2026-03-05 13:42:48 +00:00
96cf8fe822 Update src/app/layout.tsx 2026-03-05 13:42:48 +00:00
3c46b37f19 Merge version_18 into main
Merge version_18 into main
2026-03-05 13:35:39 +00:00
343dc3aa4b Update src/app/page.tsx 2026-03-05 13:35:35 +00:00
fa739da65f Update src/app/layout.tsx 2026-03-05 13:35:34 +00:00
dd9f8dd11b Merge version_17 into main
Merge version_17 into main
2026-03-05 13:31:46 +00:00
de7921dcf2 Update src/app/page.tsx 2026-03-05 13:31:42 +00:00
aaa107a8f2 Update src/app/layout.tsx 2026-03-05 13:31:41 +00:00
d58e0f6db4 Switch to version 15: modified src/app/styles/variables.css 2026-03-05 13:06:25 +00:00
09f71fe071 Switch to version 15: modified src/app/page.tsx 2026-03-05 13:06:25 +00:00
f741842e42 Switch to version 15: modified src/app/layout.tsx 2026-03-05 13:06:24 +00:00
e71f68d950 Switch to version 16: modified src/app/styles/variables.css 2026-03-05 13:01:59 +00:00
b29a136927 Switch to version 16: modified src/app/page.tsx 2026-03-05 13:01:58 +00:00
a334e75d98 Switch to version 16: modified src/app/layout.tsx 2026-03-05 13:01:58 +00:00
4cd4563a81 Switch to version 15: modified src/app/styles/variables.css 2026-03-05 12:59:05 +00:00
a2b7ffccfd Switch to version 15: modified src/app/page.tsx 2026-03-05 12:59:04 +00:00
e7dd8cffb4 Switch to version 15: modified src/app/layout.tsx 2026-03-05 12:59:03 +00:00
158598b397 Switch to version 16: modified src/app/styles/variables.css 2026-03-05 12:57:12 +00:00
4f288a7aa8 Switch to version 16: modified src/app/page.tsx 2026-03-05 12:57:11 +00:00
f7957f64d5 Switch to version 16: modified src/app/layout.tsx 2026-03-05 12:57:10 +00:00
7725cff7ee Switch to version 15: modified src/app/styles/variables.css 2026-03-05 12:56:26 +00:00
92a2671031 Switch to version 15: modified src/app/page.tsx 2026-03-05 12:56:26 +00:00
762a6b788d Switch to version 15: modified src/app/layout.tsx 2026-03-05 12:56:25 +00:00
8c13acb37e Switch to version 16: modified src/app/styles/variables.css 2026-03-05 12:56:13 +00:00
e654873cc1 Switch to version 16: modified src/app/page.tsx 2026-03-05 12:56:12 +00:00
582e372208 Switch to version 16: modified src/app/layout.tsx 2026-03-05 12:56:11 +00:00
b920d66603 Switch to version 15: added src/app/thank-you/page.tsx 2026-03-05 12:55:52 +00:00
28ea541a07 Switch to version 15: modified src/app/page.tsx 2026-03-05 12:55:52 +00:00
ecb51cf35c Switch to version 15: modified src/app/layout.tsx 2026-03-05 12:55:51 +00:00
1d1cb3e25e Switch to version 14: remove src/app/thank-you/page.tsx 2026-03-05 12:21:26 +00:00
cd43b2423c Switch to version 14: modified src/app/page.tsx 2026-03-05 12:21:25 +00:00
bf14dde886 Switch to version 14: modified src/app/layout.tsx 2026-03-05 12:21:25 +00:00
775c58dd5f Switch to version 15: modified src/app/styles/variables.css 2026-03-05 12:21:12 +00:00
ca54c45148 Switch to version 15: modified src/app/page.tsx 2026-03-05 12:21:12 +00:00
b8a60846fa Switch to version 15: modified src/app/layout.tsx 2026-03-05 12:21:11 +00:00
7df6cb9adc Merge version_16 into main
Merge version_16 into main
2026-03-05 12:20:42 +00:00
92ed70cb51 Update theme colors 2026-03-05 12:20:35 +00:00
2022cff594 Switch to version 16: modified src/app/styles/variables.css 2026-03-05 12:19:29 +00:00
a3fb84396d Switch to version 16: modified src/app/page.tsx 2026-03-05 12:19:28 +00:00
3c2670e684 Switch to version 16: modified src/app/layout.tsx 2026-03-05 12:19:28 +00:00
ff5e4fc53b Switch to version 15: added src/app/thank-you/page.tsx 2026-03-05 12:19:18 +00:00
9b56793461 Switch to version 15: modified src/app/page.tsx 2026-03-05 12:19:17 +00:00
761cea35b5 Switch to version 15: modified src/app/layout.tsx 2026-03-05 12:19:17 +00:00
a9dd4797f0 Switch to version 14: modified src/app/page.tsx 2026-03-05 12:19:00 +00:00
1f8dcc0d2f Switch to version 13: modified src/app/page.tsx 2026-03-05 12:18:17 +00:00
4b299fa5eb Switch to version 12: modified src/app/page.tsx 2026-03-05 12:17:31 +00:00
1364284317 Switch to version 13: modified src/app/page.tsx 2026-03-05 12:17:14 +00:00
6ed9bf2554 Switch to version 14: remove src/app/thank-you/page.tsx 2026-03-05 12:16:50 +00:00
27c0ba48c9 Switch to version 14: modified src/app/page.tsx 2026-03-05 12:16:49 +00:00
b5f1ed8f9e Switch to version 14: modified src/app/layout.tsx 2026-03-05 12:16:48 +00:00
327c83d2c6 Switch to version 15: added src/app/thank-you/page.tsx 2026-03-05 12:15:53 +00:00
47798547bb Switch to version 15: modified src/app/page.tsx 2026-03-05 12:15:53 +00:00
bb0610599e Switch to version 15: modified src/app/layout.tsx 2026-03-05 12:15:52 +00:00
b74202f2b1 Switch to version 14: remove src/app/thank-you/page.tsx 2026-03-05 12:15:42 +00:00
2e2b93e65c Switch to version 14: modified src/app/page.tsx 2026-03-05 12:15:42 +00:00
e9f886752a Switch to version 14: modified src/app/layout.tsx 2026-03-05 12:15:42 +00:00
cbdd5bd21a Switch to version 15: modified src/app/styles/variables.css 2026-03-05 12:15:37 +00:00
5b0ad54dc3 Switch to version 15: modified src/app/page.tsx 2026-03-05 12:15:36 +00:00
f0d015ede5 Switch to version 15: modified src/app/layout.tsx 2026-03-05 12:15:36 +00:00
3c53b25ead Merge version_16 into main
Merge version_16 into main
2026-03-05 12:15:13 +00:00
1727e38d3c Update theme colors 2026-03-05 12:15:07 +00:00
3e7815f595 Merge version_16 into main
Merge version_16 into main
2026-03-05 12:14:23 +00:00
0894ecbe8c Update theme colors 2026-03-05 12:14:16 +00:00
07badd52e6 Merge version_16 into main
Merge version_16 into main
2026-03-05 12:14:06 +00:00
ab1b99a53f Update theme colors 2026-03-05 12:13:59 +00:00
98102d181f Merge version_16 into main
Merge version_16 into main
2026-03-05 12:11:51 +00:00
9b9f3354a8 Update src/app/page.tsx 2026-03-05 12:11:46 +00:00
0b12075419 Update src/app/layout.tsx 2026-03-05 12:11:46 +00:00
dad477b06e Merge version_15 into main
Merge version_15 into main
2026-03-05 06:39:59 +00:00
ed40fec024 Add src/app/thank-you/page.tsx 2026-03-05 06:39:55 +00:00
34db2ddbf0 Update src/app/page.tsx 2026-03-05 06:39:54 +00:00
c08bfd11f8 Update src/app/layout.tsx 2026-03-05 06:39:54 +00:00
681266e374 Merge version_14 into main
Merge version_14 into main
2026-03-05 05:15:06 +00:00
df52fd53a5 Update src/app/page.tsx 2026-03-05 05:15:01 +00:00
7967ae572b Merge version_14 into main
Merge version_14 into main
2026-03-05 05:13:34 +00:00
b4deea5982 Update src/app/page.tsx 2026-03-05 05:13:30 +00:00
e489f74440 Merge version_13 into main
Merge version_13 into main
2026-03-05 05:10:36 +00:00
9a89f7be97 Update src/app/page.tsx 2026-03-05 05:10:32 +00:00
5548158ae2 Merge version_12 into main
Merge version_12 into main
2026-03-05 05:07:09 +00:00
6f11ebac09 Update src/app/page.tsx 2026-03-05 05:07:05 +00:00
45e956d16a Update src/app/layout.tsx 2026-03-05 05:07:05 +00:00
ff8938ec0f Merge version_11 into main
Merge version_11 into main
2026-03-05 05:04:11 +00:00
98f7cb8ba6 Update src/app/page.tsx 2026-03-05 05:04:07 +00:00
fe1b84e4d2 Update src/app/layout.tsx 2026-03-05 05:04:07 +00:00
2a8616b144 Merge version_10 into main
Merge version_10 into main
2026-03-05 05:01:16 +00:00
7105de1607 Update src/app/page.tsx 2026-03-05 05:01:12 +00:00
f09f245b63 Update src/app/layout.tsx 2026-03-05 05:01:12 +00:00
d77c1249bb Merge version_9 into main
Merge version_9 into main
2026-03-05 01:42:55 +00:00
f032927a66 Update src/app/page.tsx 2026-03-05 01:42:51 +00:00
6e76762078 Merge version_9 into main
Merge version_9 into main
2026-03-05 01:41:21 +00:00
9abc6caa07 Update src/app/page.tsx 2026-03-05 01:41:17 +00:00
d79fff57f6 Update src/app/layout.tsx 2026-03-05 01:41:17 +00:00
cef806d5ee Merge version_8 into main
Merge version_8 into main
2026-03-05 01:32:28 +00:00
1d7bdc8f07 Update src/app/page.tsx 2026-03-05 01:32:24 +00:00
3249eead64 Update src/app/layout.tsx 2026-03-05 01:32:24 +00:00
453c66bf08 Merge version_7 into main
Merge version_7 into main
2026-03-05 01:26:50 +00:00
1df8d4652a Update src/app/page.tsx 2026-03-05 01:26:46 +00:00
a9da569845 Merge version_6 into main
Merge version_6 into main
2026-03-04 23:32:35 +00:00
30e9ac1de5 Update src/app/page.tsx 2026-03-04 23:32:31 +00:00
8212671c23 Merge version_5 into main
Merge version_5 into main
2026-03-04 13:27:16 +00:00
92b0b4b577 Update src/app/page.tsx 2026-03-04 13:27:11 +00:00
5d022c1da4 Update src/app/layout.tsx 2026-03-04 13:27:10 +00:00
8b8e88ab3e Merge version_4 into main
Merge version_4 into main
2026-03-04 12:56:17 +00:00
0f18b0fd5a Update src/app/page.tsx 2026-03-04 12:56:13 +00:00
388971e9ea Update src/app/layout.tsx 2026-03-04 12:56:12 +00:00
37c2b0b325 Merge version_3 into main
Merge version_3 into main
2026-03-04 12:51:40 +00:00
9856a25ee6 Update src/app/page.tsx 2026-03-04 12:51:35 +00:00
f5191a2e57 Update src/app/layout.tsx 2026-03-04 12:51:35 +00:00
2fbfa93c9b Merge version_2 into main
Merge version_2 into main
2026-03-04 12:37:27 +00:00
218d9bda4e Merge version_2 into main
Merge version_2 into main
2026-03-04 12:36:21 +00:00
acf15ca953 Merge version_2 into main
Merge version_2 into main
2026-03-04 12:34:34 +00:00
4 changed files with 376 additions and 405 deletions

View File

@@ -1,14 +1,19 @@
import type { Metadata } from "next";
import { Inter } from "next/font/google";
import "./styles/variables.css";
import { Lora, Inter } from "next/font/google";
import "./globals.css";
const lora = Lora({
variable: "--font-lora", subsets: ["latin"],
weight: ["400", "500", "600", "700"],
});
const inter = Inter({
variable: "--font-inter", subsets: ["latin"],
weight: ["400", "500", "600", "700"],
});
export const metadata: Metadata = {
title: "Quick Creatives - Agency-Quality Ad Creatives in 48 Hours", description: "Get professional ad creatives delivered in 48 hours. Video ads, static creatives, and full-funnel packs for your brand."};
title: "studio ads - Agency-Quality Ad Creatives in 48 Hours", description: "Get professional video ads and static creatives delivered in 48 hours. 40% average ROAS increase. Half the cost of traditional agencies."};
export default function RootLayout({
children,
@@ -16,9 +21,37 @@ export default function RootLayout({
children: React.ReactNode;
}) {
return (
<html lang="en">
<body className={inter.variable}>
<html lang="en" suppressHydrationWarning>
<body
className={`${lora.variable} ${inter.variable} antialiased`}
suppressHydrationWarning
>
{children}
<script
async
src="https://cdn.jsdelivr.net/npm/lenis@1.1.13/dist/lenis.min.js"
></script>
<script>
{`
const lenis = new Lenis({
duration: 1.2,
easing: (t) => Math.min(1, 1.001 - Math.pow(2, -10 * t)),
direction: 'vertical',
gestureDirection: 'vertical',
smooth: true,
mouseMultiplier: 1,
smoothTouch: false,
touchMultiplier: 2,
infinite: false,
});
function raf(time) {
lenis.raf(time);
requestAnimationFrame(raf);
}
requestAnimationFrame(raf);
`}
</script>
<script
dangerouslySetInnerHTML={{

View File

@@ -2,411 +2,224 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroCentered from "@/components/sections/hero/HeroCentered";
import FeatureBento from "@/components/sections/feature/FeatureBento";
import FeatureBorderGlow from "@/components/sections/feature/featureBorderGlow/FeatureBorderGlow";
import TestimonialCardFifteen from "@/components/sections/testimonial/TestimonialCardFifteen";
import PricingCardEight from "@/components/sections/pricing/PricingCardEight";
import ContactCenter from "@/components/sections/contact/ContactCenter";
import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
import { BarChart3, Briefcase, CreditCard, Mail, Package, Palette, Shield, ShoppingCart, TrendingUp, Users, Zap, Sparkles, Database, Crown, Play, Image, Layers, Clock, CheckCircle, HelpCircle } from "lucide-react";
import HeroBillboardScroll from "@/components/sections/hero/HeroBillboardScroll";
import SplitAbout from "@/components/sections/about/SplitAbout";
import FeatureCardTwentySeven from "@/components/sections/feature/FeatureCardTwentySeven";
import PricingCardTwo from "@/components/sections/pricing/PricingCardTwo";
import ContactCTA from "@/components/sections/contact/ContactCTA";
import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
import { Sparkles, CheckCircle, Zap, Target } from "lucide-react";
import Image from "next/image";
export default function LandingPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Features", id: "#features" },
{ name: "Pricing", id: "#pricing" },
{ name: "Contact", id: "#contact" },
];
const heroButtons = [
{ text: "Claim Free Ads", href: "#claim-free" },
{ text: "See Samples", href: "#samples" },
];
const aboutBulletPoints = [
{
title: "Professional Quality", description: "Agency-caliber video ads and static creatives that stand out", icon: Sparkles,
},
{
title: "48-Hour Delivery", description: "Fast turnaround without compromising on quality or results", icon: Zap,
},
{
title: "40% Average ROAS Increase", description: "Proven results that drive measurable business growth", icon: Target,
},
{
title: "50% Cost Savings", description: "Half the cost of traditional agencies while maintaining excellence", icon: CheckCircle,
},
];
const features = [
{
id: "1", title: "Video Ad Creation", description: "Compelling video ads optimized for all platforms with proven engagement metrics", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/uploaded-1773100314435-vddenqu9.png?_wi=1", imageAlt: "Video ad creation"},
{
id: "2", title: "Static Creative Design", description: "Eye-catching static images and banners that convert viewers into customers", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/uploaded-1773100314435-vddenqu9.png?_wi=2", imageAlt: "Static creative design"},
{
id: "3", title: "Platform Optimization", description: "Creatives tailored for Facebook, Instagram, Google, and TikTok with format expertise", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/uploaded-1773100314435-vddenqu9.png?_wi=3", imageAlt: "Platform optimization"},
{
id: "4", title: "A/B Testing Ready", description: "Multiple variations for each creative to maximize your testing and learning", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/uploaded-1773100314435-vddenqu9.png?_wi=4", imageAlt: "A/B testing ready"},
];
const pricingPlans = [
{
id: "1", badge: "Starter", badgeIcon: Sparkles,
price: "$299", subtitle: "Perfect for small businesses testing paid ads", buttons: [
{ text: "Get Started", onClick: () => console.log("Starter selected") },
{ text: "Learn More", href: "#" },
],
features: [
"3 video ad variations", "5 static creatives", "One platform optimization", "48-hour delivery", "Email support"],
},
{
id: "2", badge: "Professional", badgeIcon: Zap,
price: "$599", subtitle: "Best for growing businesses scaling campaigns", buttons: [
{ text: "Get Started", onClick: () => console.log("Professional selected") },
{ text: "Learn More", href: "#" },
],
features: [
"6 video ad variations", "10 static creatives", "Multi-platform optimization", "48-hour delivery", "Priority support", "Monthly strategy call"],
},
{
id: "3", badge: "Enterprise", badgeIcon: Target,
price: "Custom", subtitle: "For large teams with complex needs", buttons: [
{ text: "Contact Sales", onClick: () => console.log("Enterprise contact") },
{ text: "View Details", href: "#" },
],
features: [
"Unlimited creatives", "All platforms covered", "Custom delivery timeline", "Dedicated account manager", "24/7 support", "Quarterly business reviews"],
},
];
const contactButtons = [
{ text: "Start Your Free Ads", href: "#claim-free" },
{ text: "Schedule a Call", onClick: () => console.log("Schedule call") },
];
const footerColumns = [
{
items: [
{ label: "Features", href: "#features" },
{ label: "Pricing", href: "#pricing" },
{ label: "About", href: "#about" },
],
},
{
items: [
{ label: "Contact", href: "#contact" },
{ label: "Support", href: "#support" },
{ label: "Terms", href: "#terms" },
],
},
];
export default function Home() {
return (
<ThemeProvider
defaultButtonVariant="hover-bubble"
defaultButtonVariant="hover-magnetic"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
borderRadius="rounded"
contentWidth="medium"
sizing="medium"
background="none"
cardStyle="gradient-bordered"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="layered"
headingFontWeight="medium"
background="aurora"
cardStyle="glass-elevated"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Quick Creatives"
navItems={[
{ name: "How it Works", id: "how-it-works" },
{ name: "Pricing", id: "pricing" },
{ name: "Testimonials", id: "testimonials" },
{ name: "FAQ", id: "faq" },
{ name: "Contact", id: "contact" }
]}
button={{
text: "Get 3 Free Creatives", href: "#contact"
}}
animateOnLoad={true}
/>
</div>
<div className="w-full">
<nav className="sticky top-0 z-50">
<NavbarLayoutFloatingInline
navItems={navItems}
brandName="studio ads"
button={{
text: "Get Started", onClick: () => console.log("navbar cta clicked"),
}}
animateOnLoad={true}
/>
</nav>
<div id="hero" data-section="hero">
<HeroCentered
title="Agency-Quality Ad Creatives. Delivered in 48 Hours."
description="Skip the lengthy production cycles. Get stunning video ads, static creatives, and full-funnel packs faster than ever. Perfect for agencies, brands, and creators who refuse to compromise on quality."
background={{ variant: "downward-rays-animated" }}
avatars={[
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-young-marketi-1772624560922-a81a2ec0.png", alt: "Marketing professional 1"
},
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-female-creati-1772624560954-fe3f44ea.png", alt: "Creative director"
},
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-male-entrepre-1772624561085-2e00132e.png", alt: "Business owner"
}
]}
avatarText="Trusted by 100+ agencies and brands"
buttons={[
{ text: "Get 3 Free Creatives", href: "#contact" },
{ text: "See Our Work", href: "#features" }
]}
buttonAnimation="slide-up"
ariaLabel="Hero section - Quick Creatives agency-quality ads in 48 hours"
/>
</div>
<main className="w-full">
<div id="hero" data-section="hero">
<HeroBillboardScroll
background={{ variant: "sparkles-gradient" }}
title="Agency-Quality Ad Creatives in 48 Hours"
description="Get professional video ads and static creatives delivered fast. 40% average ROAS increase. Half the cost of traditional agencies."
tag="Premium Creatives"
tagIcon={Sparkles}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/uploaded-1773100314435-vddenqu9.png?_wi=5"
imageAlt="Hero showcase"
buttons={heroButtons}
/>
</div>
<div id="social-proof" data-section="social-proof">
<SocialProofOne
title="Proven Results for Growing Brands"
description="Real numbers from real clients achieving real results"
tag="Social Proof"
tagIcon={TrendingUp}
names={["200+ Ad Variations", "48-Hour Turnaround", "95% Client Satisfaction", "10M+ Impressions Generated", "3x Faster Production"]}
textboxLayout="default"
useInvertedBackground={true}
speed={40}
showCard={true}
buttons={[
{ text: "View Success Stories", href: "#testimonials" }
]}
buttonAnimation="blur-reveal"
/>
</div>
<div id="about" data-section="about">
<SplitAbout
title="Why Choose Studio Ads"
description="We combine speed, quality, and affordability to deliver results that matter"
tag="Our Approach"
tagIcon={CheckCircle}
bulletPoints={aboutBulletPoints}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/uploaded-1773100314435-vddenqu9.png?_wi=6"
imageAlt="About showcase"
textboxLayout="default"
useInvertedBackground={false}
mediaAnimation="slide-up"
imagePosition="right"
/>
</div>
<div id="pain-points" data-section="pain-points">
<FeatureBorderGlow
title="The Old Way vs. The Quick Creatives Way"
description="Stop wasting weeks on ad production. Here's how we're different."
tag="Why Switch"
tagIcon={Zap}
features={[
{
icon: Clock,
title: "Weeks of Back-and-Forth", description: "Traditional agencies take weeks for approvals and revisions. We deliver in 48 hours."
},
{
icon: Users,
title: "Managing Multiple Vendors", description: "Juggling designers, videographers, and copywriters. We handle everything under one roof."
},
{
icon: Palette,
title: "Limited Creative Variations", description: "You get one option and hope it works. We create 10+ variations to maximize ROI."
},
{
icon: TrendingUp,
title: "Unknown Performance", description: "Guessing which creatives will perform best. We optimize based on real data insights."
},
{
icon: CreditCard,
title: "Unpredictable Costs", description: "Hidden fees and scope creep add up fast. Our pricing is transparent and fixed."
},
{
icon: Sparkles,
title: "Poor Quality at Scale", description: "Agencies cut corners when scaling. We maintain premium quality every single time."
}
]}
animationType="blur-reveal"
textboxLayout="default"
useInvertedBackground={false}
buttons={[
{ text: "Experience the Difference", href: "#features" }
]}
/>
</div>
<div id="features" data-section="features">
<FeatureCardTwentySeven
features={features}
gridVariant="four-items-2x2-equal-grid"
animationType="slide-up"
title="Our Services"
description="Comprehensive creative solutions tailored to your advertising needs"
tag="Services"
tagIcon={Sparkles}
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
<div id="features" data-section="features">
<FeatureBento
title="Our Complete Creative Solutions"
description="Everything you need to build winning ad campaigns, all in one platform."
tag="Capabilities"
tagIcon={Sparkles}
features={[
{
title: "Video Ads", description: "Professional 15-60 second video ads optimized for every platform. Cinematic, conversion-focused, and brand-consistent.", bentoComponent: "media-stack", items: [
{ videoSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-young-marketi-1772624560922-a81a2ec0.png?_wi=1" },
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-female-creati-1772624560954-fe3f44ea.png", imageAlt: "Creative sample" },
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-male-entrepre-1772624561085-2e00132e.png", imageAlt: "Creative sample" }
]
},
{
title: "Static Ad Creatives", description: "High-converting Instagram, Facebook, and Google Ads. Multiple sizes and formats ready to deploy.", bentoComponent: "reveal-icon", icon: Image
},
{
title: "Full-Funnel Packs", description: "Complete creative suites covering awareness, consideration, and conversion. Cohesive storytelling across all stages.", bentoComponent: "3d-stack-cards", items: [
{ icon: Layers, title: "Awareness", subtitle: "Top of Funnel", detail: "Build brand recognition with impact" },
{ icon: Play, title: "Consideration", subtitle: "Mid Funnel", detail: "Showcase value and benefits" },
{ icon: CheckCircle, title: "Conversion", subtitle: "Bottom Funnel", detail: "Drive action and sales" }
]
},
{
title: "Brand Consistency", description: "All creatives maintain your brand guidelines. Colors, fonts, messaging—perfectly aligned every time.", bentoComponent: "marquee", centerIcon: Shield,
variant: "text", texts: ["Your Brand", "Every Time", "Consistent Style", "Perfect Fit"]
},
{
title: "Multi-Category Support", description: "We create ads for SaaS, E-commerce, Real Estate, Services, and any industry you're in.", bentoComponent: "orbiting-icons", centerIcon: Zap,
items: [
{ icon: ShoppingCart, ring: 1 },
{ icon: Package, ring: 1 },
{ icon: BarChart3, ring: 2 },
{ icon: Briefcase, ring: 2 }
]
}
]}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
buttons={[
{ text: "View All Features", href: "#how-it-works" }
]}
buttonAnimation="blur-reveal"
/>
</div>
<div id="claim-free" data-section="claim-free">
<ContactCTA
tag="Limited Time"
title="Claim Your Free Ad Creatives"
description="Get started with a free sample package. See the quality and speed that sets us apart. No credit card required."
buttons={[
{ text: "Get Free Ads Now", onClick: () => console.log("claim free ads") },
{
text: "Book a Consultation", onClick: () => console.log("book consultation"),
},
]}
background={{ variant: "plain" }}
useInvertedBackground={false}
/>
</div>
<div id="how-it-works" data-section="how-it-works">
<FeatureBento
title="How It Works: 4 Simple Steps"
description="From brief to finished creatives in just 48 hours. No complexity, no delays."
tag="Process"
tagIcon={Clock}
features={[
{
title: "Step 1: Share Your Brief", description: "Tell us about your product, audience, and goals. Upload references and any brand assets.", bentoComponent: "reveal-icon", icon: Mail
},
{
title: "Step 2: Creative Strategy", description: "Our team develops concepts and creative directions tailored to your objectives.", bentoComponent: "reveal-icon", icon: Palette
},
{
title: "Step 3: Production & Revisions", description: "We produce high-quality creatives and incorporate your feedback within 24 hours.", bentoComponent: "reveal-icon", icon: Play
},
{
title: "Step 4: Launch & Optimize", description: "Receive final files in all formats. Deploy across channels and watch them perform.", bentoComponent: "reveal-icon", icon: CheckCircle
}
]}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
buttons={[
{ text: "Start Your First Project", href: "#pricing" }
]}
buttonAnimation="opacity"
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardTwo
plans={pricingPlans}
animationType="slide-up"
title="Transparent Pricing"
description="Choose the plan that fits your business needs. All plans include 48-hour delivery and proven results."
tag="Pricing"
tagIcon={Target}
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardEight
title="Simple, Transparent Pricing"
description="Choose the plan that fits your creative needs. Upgrade anytime."
tag="Plans"
tagIcon={CreditCard}
plans={[
{
id: "starter", badge: "Starter", badgeIcon: Sparkles,
price: "$1,500", subtitle: "Per Month", buttons: [
{ text: "Get Started", href: "#contact" }
],
features: [
"4 ad projects per month", "Video ads (up to 3 variations each)", "Static creatives (10+ variations)", "Full-funnel packs", "48-hour turnaround", "Brand consistency maintained", "Email support"
]
},
{
id: "growth", badge: "Most Popular", badgeIcon: Zap,
price: "$3,000", subtitle: "Per Month", buttons: [
{ text: "Get Started", href: "#contact" }
],
features: [
"Unlimited ad projects", "Video ads with unlimited variations", "Static creatives (unlimited)", "Full-funnel packs included", "24-hour turnaround available", "A/B testing variations", "Performance analytics", "Priority support", "Dedicated account manager"
]
},
{
id: "scale", badge: "Scale", badgeIcon: Crown,
price: "$5,500", subtitle: "Per Month", buttons: [
{ text: "Contact Sales", href: "#contact" }
],
features: [
"Everything in Growth +", "Custom creative strategy sessions", "Unlimited team members", "API access", "White-label options", "Custom integrations", "24/7 dedicated support", "Quarterly strategy reviews", "Enterprise SLA"
]
}
]}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
buttons={[
{ text: "Compare All Plans", href: "#features" }
]}
buttonAnimation="opacity"
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
tag="Ready to Start?"
tagIcon={Zap}
title="Let's Create Your Next Campaign"
description="Our team is ready to deliver professional, high-converting ad creatives in 48 hours. Join hundreds of satisfied clients."
buttons={contactButtons}
background={{ variant: "plain" }}
useInvertedBackground={false}
/>
</div>
<div id="free-offer" data-section="free-offer">
<ContactCenter
tag="Free Trial"
title="Get 3 Free Creatives to Test Drive Our Quality"
description="No credit card required. No strings attached. See exactly what we deliver in 48 hours with three custom ad creatives for your business."
tagIcon={Sparkles}
background={{ variant: "downward-rays-static-grid" }}
useInvertedBackground={true}
inputPlaceholder="Enter your email address"
buttonText="Claim Your Free Creatives"
termsText="By claiming your free creatives, you agree to our Terms and Conditions. We'll send you everything via email."
ariaLabel="Free creative offer signup"
/>
</div>
<div id="who-its-for" data-section="who-its-for">
<FeatureBorderGlow
title="Who We Help"
description="Whether you're a growing brand, creative agency, or in-house marketing team, we've got the perfect solution."
tag="Ideal For"
tagIcon={Users}
features={[
{
icon: ShoppingCart,
title: "E-commerce Brands", description: "Product ads, promotional content, and conversion-focused creatives that drive sales."
},
{
icon: Package,
title: "SaaS Companies", description: "Feature demonstrations, benefit-focused ads, and explainer videos that educate and convert."
},
{
icon: Briefcase,
title: "Marketing Agencies", description: "Scale your creative output without hiring. Deliver more to your clients faster."
},
{
icon: Users,
title: "Digital Creators", description: "Professional ad content, sponsorship pitches, and promotional materials for your audience."
},
{
icon: Palette,
title: "Startups & Brands", description: "Launch campaigns quickly. Build brand presence with polished, professional ads."
},
{
icon: TrendingUp,
title: "Growth Teams", description: "Test campaigns faster. Optimize with unlimited variations and performance insights."
}
]}
animationType="blur-reveal"
textboxLayout="default"
useInvertedBackground={false}
carouselMode="buttons"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardFifteen
testimonial="We went from spending 3 weeks on ad production to 48 hours. The quality is exceptional and our ROAS improved by 40%. Quick Creatives is a game-changer for our agency."
rating={5}
author="Emma Rodriguez, Creative Director"
avatars={[
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-young-marketi-1772624560922-a81a2ec0.png", alt: "Emma Rodriguez"
},
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-female-creati-1772624560954-fe3f44ea.png", alt: "Team member"
}
]}
ratingAnimation="slide-up"
avatarsAnimation="blur-reveal"
useInvertedBackground={true}
ariaLabel="Customer testimonial from Emma Rodriguez"
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
faqs={[
{
id: "1", title: "How do you deliver in 48 hours?", content: "Our streamlined workflow combines creative strategy, production, and revisions into a single efficient process. We have dedicated creative teams working around the clock to ensure your project gets the attention it deserves while meeting our 48-hour promise."
},
{
id: "2", title: "What if I need revisions?", content: "Revisions are part of our process. We build in time for feedback and iterations within your 48-hour window. For changes after delivery, we have a simple revision policy—typically one round of revisions is included in your plan."
},
{
id: "3", title: "Do you work with all industries?", content: "Absolutely. We work with e-commerce, SaaS, real estate, services, finance, healthcare, nonprofits, and everything in between. Every project gets customized strategy based on your industry, audience, and objectives."
},
{
id: "4", title: "What formats and specs do you deliver?", content: "We deliver files optimized for Instagram, Facebook, TikTok, LinkedIn, YouTube, Google Ads, and more. All formats include proper sizing, aspect ratios, captions, and platform-specific optimization. You get everything ready to post."
},
{
id: "5", title: "Can I get unlimited revisions?", content: "Revision allowances vary by plan. Our Growth and Scale plans include comprehensive revision options. We work with you until you're happy with the results—we succeed when you succeed."
},
{
id: "6", title: "What's included in the free 3 creatives offer?", content: "You get three custom ad creatives tailored to your business. This might be a mix of video ads, static creatives, or a full-funnel sample. No credit card needed, no follow-up sales calls—just quality work to show what we can do."
}
]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-young-marketi-1772624560922-a81a2ec0.png?_wi=2"
imageAlt="FAQ support team"
title="Frequently Asked Questions"
description="Everything you need to know about working with Quick Creatives."
tag="Help"
tagIcon={HelpCircle}
mediaAnimation="slide-up"
faqsAnimation="blur-reveal"
textboxLayout="default"
useInvertedBackground={false}
mediaPosition="left"
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
tag="Get Started"
title="Ready to Scale Your Creative Output?"
description="Join 100+ brands and agencies already transforming their ad production with Quick Creatives. Start with your free 3 creatives today."
tagIcon={Mail}
background={{ variant: "downward-rays-static-grid" }}
useInvertedBackground={true}
inputPlaceholder="Enter your email address"
buttonText="Get Your 3 Free Creatives"
termsText="By clicking Get Your 3 Free Creatives, you're confirming that you agree with our Terms and Conditions. We'll send you a confirmation email shortly with next steps."
ariaLabel="Contact form and creative offer signup"
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseReveal
columns={[
{
title: "Product", items: [
{ label: "Features", href: "#features" },
{ label: "Pricing", href: "#pricing" },
{ label: "How It Works", href: "#how-it-works" },
{ label: "Testimonials", href: "#testimonials" }
]
},
{
title: "Company", items: [
{ label: "About Us", href: "#" },
{ label: "Blog", href: "#" },
{ label: "Careers", href: "#" },
{ label: "Contact", href: "#contact" }
]
},
{
title: "Legal", items: [
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" },
{ label: "Cookie Policy", href: "#" }
]
}
]}
copyrightText="© 2025 Quick Creatives. All rights reserved."
ariaLabel="Footer navigation and company information"
/>
<footer id="footer" data-section="footer">
<FooterLogoEmphasis columns={footerColumns} logoText="studio ads" />
</footer>
</main>
</div>
</ThemeProvider>
);

View File

@@ -10,15 +10,15 @@
--accent: #684f7b;;
--background-accent: #65417c;; */
--background: #050012;;
--card: #040121;;
--foreground: #f0e6ff;;
--primary-cta: #c89bff;;
--primary-cta-text: #050012;;
--secondary-cta: #1d123b;;
--secondary-cta-text: #f0e6ff;;
--accent: #684f7b;;
--background-accent: #65417c;;
--background: #f5faff;;
--card: #f1f8ff;;
--foreground: #001122;;
--primary-cta: #15479c;;
--primary-cta-text: #f5faff;;
--secondary-cta: #ffffff;;
--secondary-cta-text: #001122;;
--accent: #a8cce8;;
--background-accent: #7ba3cf;;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);

125
src/app/thank-you/page.tsx Normal file
View File

@@ -0,0 +1,125 @@
"use client";
import { useSearchParams } from "next/navigation";
import { CheckCircle, ArrowRight } from "lucide-react";
import Link from "next/link";
export default function ThankYouPage() {
const searchParams = useSearchParams();
const url = searchParams.get("url") || "";
return (
<div className="min-h-screen bg-background flex items-center justify-center px-4 py-20">
<div className="max-w-2xl w-full">
<div className="text-center mb-8">
<div className="inline-flex items-center justify-center w-16 h-16 rounded-full bg-primary-cta/20 mb-6">
<CheckCircle size={32} className="text-primary-cta" />
</div>
<h1 className="text-4xl md:text-5xl font-bold text-foreground mb-4">
Thank You!
</h1>
<p className="text-lg text-foreground/70 mb-2">
Your free 3 ad creatives are on the way.
</p>
{url && (
<p className="text-base text-foreground/60 mb-8">
We've received your website: <span className="font-semibold text-foreground">{url}</span>
</p>
)}
</div>
<div className="bg-card border border-accent/20 rounded-lg p-8 mb-8">
<h2 className="text-2xl font-bold text-foreground mb-6">What's Next?</h2>
<div className="space-y-6">
<div className="flex gap-4">
<div className="flex-shrink-0">
<div className="flex items-center justify-center h-10 w-10 rounded-full bg-primary-cta text-primary-cta-text font-bold">
1
</div>
</div>
<div>
<h3 className="font-semibold text-foreground mb-1">Check Your Email</h3>
<p className="text-foreground/70">
Within 1-2 hours, you'll receive a welcome email with next steps and our creative brief form.
</p>
</div>
</div>
<div className="flex gap-4">
<div className="flex-shrink-0">
<div className="flex items-center justify-center h-10 w-10 rounded-full bg-primary-cta text-primary-cta-text font-bold">
2
</div>
</div>
<div>
<h3 className="font-semibold text-foreground mb-1">Fill Out the Brief</h3>
<p className="text-foreground/70">
Tell us about your product, target audience, and campaign goals. Upload any brand guidelines or reference materials.
</p>
</div>
</div>
<div className="flex gap-4">
<div className="flex-shrink-0">
<div className="flex items-center justify-center h-10 w-10 rounded-full bg-primary-cta text-primary-cta-text font-bold">
3
</div>
</div>
<div>
<h3 className="font-semibold text-foreground mb-1">Sit Back & Relax</h3>
<p className="text-foreground/70">
Our creative team will craft 3 premium ad creatives optimized for your platforms. You'll have them in 48 hours.
</p>
</div>
</div>
<div className="flex gap-4">
<div className="flex-shrink-0">
<div className="flex items-center justify-center h-10 w-10 rounded-full bg-primary-cta text-primary-cta-text font-bold">
4
</div>
</div>
<div>
<h3 className="font-semibold text-foreground mb-1">Review & Iterate</h3>
<p className="text-foreground/70">
Get your creatives and review them. We'll incorporate feedback within 24 hours. Once happy, deploy and start seeing results.
</p>
</div>
</div>
</div>
</div>
<div className="bg-gradient-to-br from-primary-cta/10 to-accent/10 border border-primary-cta/20 rounded-lg p-6 mb-8">
<h3 className="font-semibold text-foreground mb-3">💡 Pro Tips:</h3>
<ul className="space-y-2 text-foreground/70">
<li> Be specific about your target audience demographics and interests</li>
<li> Share examples of ads you like (from competitors or other brands)</li>
<li> Provide clear brand guidelines and any assets you want us to use</li>
<li> Let us know your primary conversion goal (clicks, sales, signups, etc.)</li>
</ul>
</div>
<div className="flex flex-col md:flex-row gap-4 justify-center">
<Link
href="/"
className="inline-flex items-center justify-center gap-2 px-8 py-4 bg-card border border-accent/20 text-foreground font-semibold rounded-full hover:bg-accent/5 transition-colors"
>
Back to Home
</Link>
<a
href="https://wa.me/1234567890"
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center justify-center gap-2 px-8 py-4 bg-primary-cta text-primary-cta-text font-semibold rounded-full hover:opacity-90 transition-opacity"
>
Chat with Us <ArrowRight size={18} />
</a>
</div>
<p className="text-center text-foreground/60 text-sm mt-8">
Questions? Chat with us on WhatsApp or reply to your confirmation email.
</p>
</div>
</div>
);
}