223 lines
11 KiB
TypeScript
223 lines
11 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
|
import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
|
|
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
|
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
|
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
|
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
|
import TextAbout from '@/components/sections/about/TextAbout';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="expand-hover"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="rounded"
|
|
contentWidth="smallMedium"
|
|
sizing="mediumLargeSizeLargeTitles"
|
|
background="noise"
|
|
cardStyle="gradient-mesh"
|
|
primaryButtonStyle="primary-glow"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="medium"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
navItems={[
|
|
{
|
|
name: "Funcionalidades", id: "#features"},
|
|
{
|
|
name: "Planos", id: "#pricing"},
|
|
{
|
|
name: "Depoimentos", id: "#testimonials"},
|
|
{
|
|
name: "Contato", id: "#contact"},
|
|
]}
|
|
brandName="TumbGenerate.AI"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroLogoBillboard
|
|
background={{
|
|
variant: "glowing-orb"}}
|
|
logoText="TumbGenerate.AI"
|
|
description="Crie thumbnails com qualidade MrBeast em segundos. Otimização de IA para o máximo de cliques e engajamento viral."
|
|
buttons={[
|
|
{
|
|
text: "INICIAR AGORA", href: "#"},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/technician-employs-ai-chatbot-pc-monitor-executing-programming-code_482257-120774.jpg"
|
|
imageAlt="Interface do TumbGenerate.AI"
|
|
mediaAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextAbout
|
|
useInvertedBackground={false}
|
|
title="A Ciência Por Trás dos Cliques"
|
|
tag="Sobre Nós"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardMedia
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
id: "f1", title: "IA de Edição em Tempo Real", description: "Edite cada elemento com chat inteligente.", tag: "IA", imageSrc: "http://img.b2bpic.net/free-photo/phone-with-ai-chat_1268-21801.jpg"},
|
|
{
|
|
id: "f2", title: "Padrões de Thumbnails Virais", description: "IA que analisa e recria estilos que funcionam.", tag: "Viral", imageSrc: "http://img.b2bpic.net/free-photo/extremely-disappointed-furious-male-customer-swearing-show-thumbs-down-impulsive-gesture-yelling_1258-228687.jpg"},
|
|
{
|
|
id: "f3", title: "Design Otimizado para Texto", description: "Sugestões de fontes, cores e glitters para CTR.", tag: "Texto", imageSrc: "http://img.b2bpic.net/free-photo/artist-using-tablet-stylus-pen_23-2152007744.jpg"},
|
|
{
|
|
id: "f4", title: "Ajuste de Proporção", description: "Adaptação automática para YouTube, TikTok e Shorts.", tag: "Multi-plataforma", imageSrc: "http://img.b2bpic.net/free-photo/close-up-child-hands-holding-phone-with-dads-incoming-call-display_169016-43119.jpg"},
|
|
{
|
|
id: "f5", title: "Banco de Elementos", description: "Acesso a assets premium para compor suas artes.", tag: "Premium", imageSrc: "http://img.b2bpic.net/free-photo/bucharest-romania-july-30th-2024-ai-driven-chatgpt-mobile-app_482257-123151.jpg"},
|
|
]}
|
|
title="Funcionalidades Inteligentes"
|
|
description="Ferramentas desenvolvidas para criar o próximo conteúdo viral."
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="four-items-2x2-equal-grid"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{
|
|
id: "p1", brand: "Gaming", name: "Setup Gamer", price: "AI", rating: 5,
|
|
reviewCount: "12k", imageSrc: "http://img.b2bpic.net/free-photo/frustrated-streamer-losing-online-shooter-video-games-play-competition-computer-with-neon-lights-male-gamer-streaming-action-gameplay-feeling-sad-about-lost-shooting-championship_482257-46458.jpg"},
|
|
{
|
|
id: "p2", brand: "Vlog", name: "Viagem de Luxo", price: "AI", rating: 5,
|
|
reviewCount: "10k", imageSrc: "http://img.b2bpic.net/free-photo/cute-friendly-outgoing-woman-with-red-hair-holding-smartphone-messaging-waving-someone_1258-126271.jpg"},
|
|
{
|
|
id: "p3", brand: "Business", name: "Crescimento Financeiro", price: "AI", rating: 5,
|
|
reviewCount: "8k", imageSrc: "http://img.b2bpic.net/free-photo/image-clueless-middleaged-fitness-guy-holding-apple-cake-shrugging-shoulders-standing-work_1258-129257.jpg"},
|
|
{
|
|
id: "p4", brand: "Lifestyle", name: "Receita Viral", price: "AI", rating: 5,
|
|
reviewCount: "15k", imageSrc: "http://img.b2bpic.net/free-psd/colorful-festival-template-design_23-2150772760.jpg"},
|
|
{
|
|
id: "p5", brand: "Tech", name: "Review Gadget", price: "AI", rating: 5,
|
|
reviewCount: "9k", imageSrc: "http://img.b2bpic.net/free-photo/people-technology-concept-close-up-portrait-young-beautiful-attractive-tender-ginger-redhair-gir_1258-117913.jpg"},
|
|
{
|
|
id: "p6", brand: "Fitness", name: "Treino Pesado", price: "AI", rating: 5,
|
|
reviewCount: "11k", imageSrc: "http://img.b2bpic.net/free-photo/body-fitness_53876-95316.jpg"},
|
|
]}
|
|
title="Exemplos Gerados"
|
|
description="Thumbnails profissionais criadas com a nossa tecnologia."
|
|
/>
|
|
</div>
|
|
|
|
<div id="socialproof" data-section="socialproof">
|
|
<SocialProofOne
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
names={[
|
|
"YouTube", "TikTok", "Instagram", "Twitch", "Behance", "Adobe", "Dribbble"]}
|
|
title="Confira Nossos Parceiros"
|
|
description="Empresas que confiam na nossa IA."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwelve
|
|
useInvertedBackground={false}
|
|
buttons={[{ text: "Ver Mais", onClick: () => {} }]}
|
|
testimonials={[
|
|
{
|
|
id: "t1", name: "Sarah J.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-content-creator_23-2151912393.jpg"},
|
|
{
|
|
id: "t2", name: "Michael K.", imageSrc: "http://img.b2bpic.net/free-photo/afro-american-business-woman-medium-shot_23-2148336866.jpg"},
|
|
{
|
|
id: "t3", name: "Jessica R.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-with-smartphone_23-2149439878.jpg"},
|
|
{
|
|
id: "t4", name: "David L.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-beautiful-brunette-girl-black-hat-smiling_176420-8505.jpg"},
|
|
{
|
|
id: "t5", name: "Emma M.", imageSrc: "http://img.b2bpic.net/free-photo/drawings-social-media-s-concepts_1134-72.jpg"},
|
|
]}
|
|
cardTitle="O Que Dizem Nossos Usuários"
|
|
cardTag="Avaliações"
|
|
cardAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqDouble
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
buttons={[{ text: "Falar com Suporte", onClick: () => {} }]}
|
|
faqs={[
|
|
{
|
|
id: "q1", title: "Como funciona o chat de edição?", content: "Nosso chat de IA permite editar elementos em tempo real com comandos simples: basta selecionar o objeto e descrever o ajuste desejado."},
|
|
{
|
|
id: "q2", title: "Posso baixar em alta definição?", content: "Sim, todas as imagens são exportadas em até 4K (3840x2160) nos formatos PNG e JPG otimizados."},
|
|
{
|
|
id: "q3", title: "É compatível com TikTok?", content: "Sim, nossa IA adapta automaticamente a proporção para YouTube (16:9), TikTok e Shorts (9:16) em segundos."},
|
|
{
|
|
id: "q4", title: "Quais os planos de assinatura?", content: "Oferecemos planos mensais e anuais para criadores de todos os tamanhos, com gerações ilimitadas no plano Pro."},
|
|
{
|
|
id: "q5", title: "Existe suporte técnico?", content: "Sim, nosso time está disponível 24/7 via chat ou e-mail para resolver qualquer dúvida técnica ou de design."},
|
|
]}
|
|
title="Perguntas Frequentes"
|
|
description="Tire suas dúvidas sobre a plataforma."
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
useInvertedBackground={false}
|
|
onSubmit={(email) => console.log(email)}
|
|
background={{
|
|
variant: "radial-gradient"}}
|
|
tag="Contato"
|
|
title="Entre em Contato"
|
|
description="Quer uma parceria ou tem dúvidas?"
|
|
imageSrc="http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169844.jpg"
|
|
mediaAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterMedia
|
|
onPrivacyClick={() => {}}
|
|
imageSrc="http://img.b2bpic.net/free-photo/3d-render-modern-network-communications-low-poly-plexus-design_1048-13390.jpg"
|
|
logoText="TumbGenerate.AI"
|
|
columns={[
|
|
{
|
|
title: "Produto", items: [
|
|
{
|
|
label: "IA", href: "#"},
|
|
{
|
|
label: "Preços", href: "#"},
|
|
],
|
|
},
|
|
{
|
|
title: "Social", items: [
|
|
{
|
|
label: "Instagram", href: "#"},
|
|
{
|
|
label: "Twitter", href: "#"},
|
|
],
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|