Update src/app/page.tsx
This commit is contained in:
454
src/app/page.tsx
454
src/app/page.tsx
@@ -34,45 +34,30 @@ export default function LandingPage() {
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "#hero",
|
||||
},
|
||||
name: "Home", id: "#hero"},
|
||||
{
|
||||
name: "Features",
|
||||
id: "#features",
|
||||
},
|
||||
name: "Features", id: "#features"},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "#pricing",
|
||||
},
|
||||
name: "Pricing", id: "#pricing"},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "#testimonials",
|
||||
},
|
||||
name: "Testimonials", id: "#testimonials"},
|
||||
{
|
||||
name: "FAQ",
|
||||
id: "#faq",
|
||||
},
|
||||
name: "FAQ", id: "#faq"},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
name: "Contact", id: "#contact"},
|
||||
]}
|
||||
logoSrc="http://img.b2bpic.net/free-vector/gradient-abstract-logo-template_23-2148158860.jpg"
|
||||
logoAlt="WireGen AI Logo"
|
||||
brandName="WireGen AI"
|
||||
button={{
|
||||
text: "Sign Up Free",
|
||||
href: "#contact",
|
||||
}}
|
||||
text: "Sign Up Free", href: "#contact"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplit
|
||||
background={{
|
||||
variant: "animated-grid",
|
||||
}}
|
||||
variant: "animated-grid"}}
|
||||
imagePosition="right"
|
||||
title="Generate Stunning Website Wireframes with AI"
|
||||
description="Transform your ideas into fully editable, multi-page wireframes in seconds. WireGen AI leverages advanced AI to plan, design, and build your site's foundation effortlessly."
|
||||
@@ -80,67 +65,43 @@ export default function LandingPage() {
|
||||
tagAnimation="slide-up"
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Started Free",
|
||||
href: "#contact",
|
||||
},
|
||||
text: "Get Started Free", href: "#contact"},
|
||||
{
|
||||
text: "See How It Works",
|
||||
href: "#features",
|
||||
},
|
||||
text: "See How It Works", href: "#features"},
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/smiling-man_1098-15443.jpg",
|
||||
alt: "User avatar 1",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/smiling-man_1098-15443.jpg", alt: "User avatar 1"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/interested-black-man-woolen-elegant-jacket-close-up-portrait-handsome-guy-with-dark-skin-wears-headphones_197531-21842.jpg",
|
||||
alt: "User avatar 2",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/interested-black-man-woolen-elegant-jacket-close-up-portrait-handsome-guy-with-dark-skin-wears-headphones_197531-21842.jpg", alt: "User avatar 2"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/authentic-small-youthful-marketing-agency_23-2150167349.jpg",
|
||||
alt: "User avatar 3",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/authentic-small-youthful-marketing-agency_23-2150167349.jpg", alt: "User avatar 3"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-vector/flat-design-profile-icon-set_23-2149499286.jpg",
|
||||
alt: "User avatar 4",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-vector/flat-design-profile-icon-set_23-2149499286.jpg", alt: "User avatar 4"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/smiley-girl-with-pink-hair-hoodie_23-2148629699.jpg",
|
||||
alt: "Smiley girl with pink hair and hoodie",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/smiley-girl-with-pink-hair-hoodie_23-2148629699.jpg", alt: "Smiley girl with pink hair and hoodie"},
|
||||
]}
|
||||
avatarText="Join 10,000+ designers & developers"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/female-web-designer-office_23-2149749873.jpg?_wi=1"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/female-web-designer-office_23-2149749873.jpg"
|
||||
imageAlt="WireGen AI Dashboard Preview"
|
||||
mediaAnimation="slide-up"
|
||||
fixedMediaHeight={true}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "AI Powered Design",
|
||||
icon: Sparkles,
|
||||
type: "text-icon", text: "AI Powered Design", icon: Sparkles,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Code Export Ready",
|
||||
icon: Code,
|
||||
type: "text-icon", text: "Code Export Ready", icon: Code,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Drag & Drop Editor",
|
||||
icon: Move,
|
||||
type: "text-icon", text: "Drag & Drop Editor", icon: Move,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Multi-Page Support",
|
||||
icon: Layers,
|
||||
type: "text-icon", text: "Multi-Page Support", icon: Layers,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Intuitive Workflow",
|
||||
icon: Star,
|
||||
type: "text-icon", text: "Intuitive Workflow", icon: Star,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
@@ -151,14 +112,10 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
title="Design Faster, Build Smarter with AI"
|
||||
description={[
|
||||
"WireGen AI revolutionizes the way you conceptualize and build websites. Gone are the days of tedious manual wireframing. Simply describe your vision in natural language, and our advanced AI engine instantly generates complete, editable wireframes tailored to your needs.",
|
||||
"Our platform goes beyond basic layout. It understands your intent, suggests optimal page structures, recommends relevant sections, and even proposes compelling CTAs. You get a solid foundation in seconds, allowing you to focus on refining the creative details and bringing your projects to life faster than ever before.",
|
||||
]}
|
||||
"WireGen AI revolutionizes the way you conceptualize and build websites. Gone are the days of tedious manual wireframing. Simply describe your vision in natural language, and our advanced AI engine instantly generates complete, editable wireframes tailored to your needs.", "Our platform goes beyond basic layout. It understands your intent, suggests optimal page structures, recommends relevant sections, and even proposes compelling CTAs. You get a solid foundation in seconds, allowing you to focus on refining the creative details and bringing your projects to life faster than ever before."]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Explore AI Capabilities",
|
||||
href: "#features",
|
||||
},
|
||||
text: "Explore AI Capabilities", href: "#features"},
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
/>
|
||||
@@ -171,107 +128,59 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "AI Prompt Input",
|
||||
description: "Describe your website in plain English and watch AI generate a full wireframe instantly.",
|
||||
icon: MessageSquare,
|
||||
title: "AI Prompt Input", description: "Describe your website in plain English and watch AI generate a full wireframe instantly.", icon: MessageSquare,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-engaging-with-intelligent-ai-chatbot-complete-work-related-tasks_482257-119190.jpg",
|
||||
imageAlt: "AI prompt input UI",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-engaging-with-intelligent-ai-chatbot-complete-work-related-tasks_482257-119190.jpg", imageAlt: "AI prompt input UI"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-web-designer-office-with-notebook_23-2149749870.jpg",
|
||||
imageAlt: "AI text to wireframe conversion",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/gradient-abstract-logo-template_23-2148158860.jpg?_wi=1",
|
||||
imageAlt: "AI prompt input UI",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-web-designer-office-with-notebook_23-2149749870.jpg", imageAlt: "AI text to wireframe conversion"},
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Intelligent Website Planning",
|
||||
description: "The AI analyzes your prompt to suggest optimal pages, sections, hierarchy, and CTAs for maximum conversion.",
|
||||
icon: Lightbulb,
|
||||
title: "Intelligent Website Planning", description: "The AI analyzes your prompt to suggest optimal pages, sections, hierarchy, and CTAs for maximum conversion.", icon: Lightbulb,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-illustration-golgi-apparatus-processing-proteins-german_183364-124013.jpg",
|
||||
imageAlt: "AI website planning algorithm",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-illustration-golgi-apparatus-processing-proteins-german_183364-124013.jpg", imageAlt: "AI website planning algorithm"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/expert-engineer-designs-complex-circuit-board-connections-generated-by-ai_188544-24553.jpg",
|
||||
imageAlt: "AI generated website plan JSON",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-web-designer-office_23-2149749873.jpg?_wi=2",
|
||||
imageAlt: "AI prompt input UI",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/expert-engineer-designs-complex-circuit-board-connections-generated-by-ai_188544-24553.jpg", imageAlt: "AI generated website plan JSON"},
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Intuitive Drag-and-Drop Editor",
|
||||
description: "Customize every aspect of your wireframe with a flexible, easy-to-use drag-and-drop interface.",
|
||||
icon: Move,
|
||||
title: "Intuitive Drag-and-Drop Editor", description: "Customize every aspect of your wireframe with a flexible, easy-to-use drag-and-drop interface.", icon: Move,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-web-designer-with-papers-notes-office_23-2149749912.jpg",
|
||||
imageAlt: "Drag and drop wireframe editor",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-web-designer-with-papers-notes-office_23-2149749912.jpg", imageAlt: "Drag and drop wireframe editor"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-multi-ethnic-women-working-together-design-construction-blueprints-building-model-colleagues-analyzing-layout-print-plan-designing-urban-architectural-project_482257-40263.jpg",
|
||||
imageAlt: "Modular wireframe design editor",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-man_1098-15443.jpg",
|
||||
imageAlt: "AI prompt input UI",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-multi-ethnic-women-working-together-design-construction-blueprints-building-model-colleagues-analyzing-layout-print-plan-designing-urban-architectural-project_482257-40263.jpg", imageAlt: "Modular wireframe design editor"},
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Comprehensive Multi-Page Support",
|
||||
description: "Build complex websites with ease, organizing pages, sections, and navigation for a complete user journey.",
|
||||
icon: Layers,
|
||||
title: "Comprehensive Multi-Page Support", description: "Build complex websites with ease, organizing pages, sections, and navigation for a complete user journey.", icon: Layers,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/laptop-with-financial-diagrams-graphs-display-startup-company-office-business-people-using-documents-with-sales-reports-analysis-working-partnership-growth-close-up_482257-37382.jpg",
|
||||
imageAlt: "Multi-page website builder UI",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/laptop-with-financial-diagrams-graphs-display-startup-company-office-business-people-using-documents-with-sales-reports-analysis-working-partnership-growth-close-up_482257-37382.jpg", imageAlt: "Multi-page website builder UI"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/interconnected-screens-collage-showing-modern-social-media-feed-clips_482257-129691.jpg",
|
||||
imageAlt: "AI sitemap generation visualization",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/interested-black-man-woolen-elegant-jacket-close-up-portrait-handsome-guy-with-dark-skin-wears-headphones_197531-21842.jpg",
|
||||
imageAlt: "AI prompt input UI",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/interconnected-screens-collage-showing-modern-social-media-feed-clips_482257-129691.jpg", imageAlt: "AI sitemap generation visualization"},
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Seamless Code Export",
|
||||
description: "Export your wireframes to clean JSON, React components, or a complete Next.js project structure, ready for development.",
|
||||
icon: Code,
|
||||
title: "Seamless Code Export", description: "Export your wireframes to clean JSON, React components, or a complete Next.js project structure, ready for development.", icon: Code,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-typing-prompts-into-ai-powered-chat-system-her-computer_482257-124123.jpg",
|
||||
imageAlt: "Export wireframe to code",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-typing-prompts-into-ai-powered-chat-system-her-computer_482257-124123.jpg", imageAlt: "Export wireframe to code"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-it-professional-using-tablet-building-ai-algorithms_482257-92639.jpg",
|
||||
imageAlt: "Next.js project export structure",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/authentic-small-youthful-marketing-agency_23-2150167349.jpg",
|
||||
imageAlt: "AI prompt input UI",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-it-professional-using-tablet-building-ai-algorithms_482257-92639.jpg", imageAlt: "Next.js project export structure"},
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Intelligent AI Suggestions & Optimization",
|
||||
description: "Receive AI-powered recommendations for missing sections, improved CTAs, and UX enhancements.",
|
||||
icon: Sparkles,
|
||||
title: "Intelligent AI Suggestions & Optimization", description: "Receive AI-powered recommendations for missing sections, improved CTAs, and UX enhancements.", icon: Sparkles,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150104471.jpg",
|
||||
imageAlt: "AI suggestions for UX improvements",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150104471.jpg", imageAlt: "AI suggestions for UX improvements"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/ideas-creation-design-process-icon_53876-132253.jpg",
|
||||
imageAlt: "AI recommending better CTAs",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/flat-design-profile-icon-set_23-2149499286.jpg",
|
||||
imageAlt: "AI prompt input UI",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/ideas-creation-design-process-icon_53876-132253.jpg", imageAlt: "AI recommending better CTAs"},
|
||||
]
|
||||
}
|
||||
]}
|
||||
title="Unleash Your Creativity with Powerful AI Features"
|
||||
description="From natural language prompts to seamless drag-and-drop editing and code export, WireGen AI supercharges every step of your design process."
|
||||
@@ -283,17 +192,7 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"AI Innovators",
|
||||
"Design Studios",
|
||||
"Tech Startups",
|
||||
"Web Agencies",
|
||||
"Creative Hubs",
|
||||
"Digital Architects",
|
||||
"Product Teams",
|
||||
"SaaS Companies",
|
||||
"Freelance Designers",
|
||||
"Enterprise Solutions",
|
||||
]}
|
||||
"AI Innovators", "Design Studios", "Tech Startups", "Web Agencies", "Creative Hubs", "Digital Architects", "Product Teams", "SaaS Companies", "Freelance Designers", "Enterprise Solutions"]}
|
||||
title="Trusted by Innovators Worldwide"
|
||||
description="Fueling the next generation of web design and development with intelligent automation."
|
||||
/>
|
||||
@@ -306,44 +205,20 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "1.2M+",
|
||||
title: "Wireframes Generated",
|
||||
items: [
|
||||
"Rapid prototyping",
|
||||
"Creative freedom",
|
||||
"Diverse layouts",
|
||||
],
|
||||
id: "m1", value: "1.2M+", title: "Wireframes Generated", items: [
|
||||
"Rapid prototyping", "Creative freedom", "Diverse layouts"],
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "100K+",
|
||||
title: "Design Hours Saved",
|
||||
items: [
|
||||
"Automated initial drafts",
|
||||
"Faster iterations",
|
||||
"Reduced manual effort",
|
||||
],
|
||||
id: "m2", value: "100K+", title: "Design Hours Saved", items: [
|
||||
"Automated initial drafts", "Faster iterations", "Reduced manual effort"],
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "98%",
|
||||
title: "User Satisfaction",
|
||||
items: [
|
||||
"Intuitive interface",
|
||||
"Powerful AI engine",
|
||||
"Excellent support",
|
||||
],
|
||||
id: "m3", value: "98%", title: "User Satisfaction", items: [
|
||||
"Intuitive interface", "Powerful AI engine", "Excellent support"],
|
||||
},
|
||||
{
|
||||
id: "m4",
|
||||
value: "500K+",
|
||||
title: "Projects Exported",
|
||||
items: [
|
||||
"Seamless developer handoff",
|
||||
"Multiple export formats",
|
||||
"Ready-to-use code",
|
||||
],
|
||||
id: "m4", value: "500K+", title: "Projects Exported", items: [
|
||||
"Seamless developer handoff", "Multiple export formats", "Ready-to-use code"],
|
||||
},
|
||||
]}
|
||||
title="Impact in Numbers"
|
||||
@@ -358,61 +233,23 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "free",
|
||||
title: "Free",
|
||||
price: "$0",
|
||||
period: "per month",
|
||||
features: [
|
||||
"5 AI Wireframes/mo",
|
||||
"Basic Drag & Drop",
|
||||
"Single Page Export",
|
||||
"Community Support",
|
||||
],
|
||||
id: "free", title: "Free", price: "$0", period: "per month", features: [
|
||||
"5 AI Wireframes/mo", "Basic Drag & Drop", "Single Page Export", "Community Support"],
|
||||
button: {
|
||||
text: "Get Started",
|
||||
href: "#contact",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/mystical-geometric-shape_1017-2697.jpg",
|
||||
imageAlt: "Mystical geometric shape",
|
||||
},
|
||||
text: "Get Started", href: "#contact"},
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/mystical-geometric-shape_1017-2697.jpg", imageAlt: "Mystical geometric shape"},
|
||||
{
|
||||
id: "pro",
|
||||
title: "Pro",
|
||||
price: "$29",
|
||||
period: "per month",
|
||||
features: [
|
||||
"Unlimited AI Wireframes",
|
||||
"Advanced Editor Features",
|
||||
"Multi-Page Export (JSON/React)",
|
||||
"Priority Support",
|
||||
"Project Saving & History",
|
||||
],
|
||||
id: "pro", title: "Pro", price: "$29", period: "per month", features: [
|
||||
"Unlimited AI Wireframes", "Advanced Editor Features", "Multi-Page Export (JSON/React)", "Priority Support", "Project Saving & History"],
|
||||
button: {
|
||||
text: "Choose Pro",
|
||||
href: "#contact",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/gradient-abstract-logo-template_23-2148158860.jpg?_wi=2",
|
||||
imageAlt: "Mystical geometric shape",
|
||||
},
|
||||
text: "Choose Pro", href: "#contact"},
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/gradient-abstract-logo-template_23-2148158860.jpg", imageAlt: "Mystical geometric shape"},
|
||||
{
|
||||
id: "business",
|
||||
title: "Business",
|
||||
price: "$99",
|
||||
period: "per month",
|
||||
features: [
|
||||
"All Pro Features",
|
||||
"Team Collaboration",
|
||||
"Next.js Project Export",
|
||||
"Dedicated Account Manager",
|
||||
"URL/Screenshot Analyzer",
|
||||
],
|
||||
id: "business", title: "Business", price: "$99", period: "per month", features: [
|
||||
"All Pro Features", "Team Collaboration", "Next.js Project Export", "Dedicated Account Manager", "URL/Screenshot Analyzer"],
|
||||
button: {
|
||||
text: "Contact Sales",
|
||||
href: "#contact",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-web-designer-office_23-2149749873.jpg?_wi=3",
|
||||
imageAlt: "Mystical geometric shape",
|
||||
},
|
||||
text: "Contact Sales", href: "#contact"},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-web-designer-office_23-2149749873.jpg", imageAlt: "Mystical geometric shape"},
|
||||
]}
|
||||
title="Simple Pricing for Every Vision"
|
||||
description="Choose the plan that fits your design workflow, from individual projects to large-scale agency solutions."
|
||||
@@ -426,53 +263,17 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah Johnson",
|
||||
handle: "@sarah_j",
|
||||
testimonial: "WireGen AI has transformed my workflow! I can go from concept to a full wireframe in minutes. The AI suggestions are incredibly helpful.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-jolly-media-star-telling-viewers-facts-about-himself-close-up_482257-116639.jpg",
|
||||
imageAlt: "Sarah Johnson, CTO",
|
||||
},
|
||||
id: "t1", name: "Sarah Johnson", handle: "@sarah_j", testimonial: "WireGen AI has transformed my workflow! I can go from concept to a full wireframe in minutes. The AI suggestions are incredibly helpful.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-jolly-media-star-telling-viewers-facts-about-himself-close-up_482257-116639.jpg", imageAlt: "Sarah Johnson, CTO"},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Michael Chen",
|
||||
handle: "@mike_designs",
|
||||
testimonial: "The drag-and-drop editor is so intuitive, and the export to Next.js has saved my team countless hours. A game-changer for agencies!",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/urban-portrait-young-man-with-orange-hair_23-2149122916.jpg",
|
||||
imageAlt: "Michael Chen, Lead Designer",
|
||||
},
|
||||
id: "t2", name: "Michael Chen", handle: "@mike_designs", testimonial: "The drag-and-drop editor is so intuitive, and the export to Next.js has saved my team countless hours. A game-changer for agencies!", imageSrc: "http://img.b2bpic.net/free-photo/urban-portrait-young-man-with-orange-hair_23-2149122916.jpg", imageAlt: "Michael Chen, Lead Designer"},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Emily Rodriguez",
|
||||
handle: "@emily_r",
|
||||
testimonial: "As a product manager, getting quick visual prototypes is crucial. WireGen AI delivers exactly that, helping us iterate faster than ever.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/business-team-cooperating-while-making-new-plans-whiteboard-office-focus-is-businesswoman-writing-notes_637285-7032.jpg",
|
||||
imageAlt: "Emily Rodriguez, Product Manager",
|
||||
},
|
||||
id: "t3", name: "Emily Rodriguez", handle: "@emily_r", testimonial: "As a product manager, getting quick visual prototypes is crucial. WireGen AI delivers exactly that, helping us iterate faster than ever.", imageSrc: "http://img.b2bpic.net/free-photo/business-team-cooperating-while-making-new-plans-whiteboard-office-focus-is-businesswoman-writing-notes_637285-7032.jpg", imageAlt: "Emily Rodriguez, Product Manager"},
|
||||
{
|
||||
id: "t4",
|
||||
name: "David Kim",
|
||||
handle: "@david_k",
|
||||
testimonial: "I love the multi-page support. Building complex site architectures is no longer a headache. The AI truly understands my needs.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/male-graphic-designer-using-digital-tablet_1170-1092.jpg",
|
||||
imageAlt: "David Kim, Startup Founder",
|
||||
},
|
||||
id: "t4", name: "David Kim", handle: "@david_k", testimonial: "I love the multi-page support. Building complex site architectures is no longer a headache. The AI truly understands my needs.", imageSrc: "http://img.b2bpic.net/free-photo/male-graphic-designer-using-digital-tablet_1170-1092.jpg", imageAlt: "David Kim, Startup Founder"},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Jessica Lee",
|
||||
handle: "@jessica_l",
|
||||
testimonial: "The URL analyzer is pure magic! Analyzing competitors and generating wireframes from existing sites is a huge competitive advantage.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/manager-analyzing-financial-growth-report-with-coworker_482257-77593.jpg",
|
||||
imageAlt: "Jessica Lee, Marketing Director",
|
||||
},
|
||||
id: "t5", name: "Jessica Lee", handle: "@jessica_l", testimonial: "The URL analyzer is pure magic! Analyzing competitors and generating wireframes from existing sites is a huge competitive advantage.", imageSrc: "http://img.b2bpic.net/free-photo/manager-analyzing-financial-growth-report-with-coworker_482257-77593.jpg", imageAlt: "Jessica Lee, Marketing Director"},
|
||||
{
|
||||
id: "t6",
|
||||
name: "Robert Green",
|
||||
handle: "@robert_g",
|
||||
testimonial: "The AI suggestions for UX are brilliant. It's like having a co-designer who never sleeps!",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-wearing-apron_23-2149007471.jpg",
|
||||
imageAlt: "Close up man wearing apron",
|
||||
},
|
||||
id: "t6", name: "Robert Green", handle: "@robert_g", testimonial: "The AI suggestions for UX are brilliant. It's like having a co-designer who never sleeps!", imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-wearing-apron_23-2149007471.jpg", imageAlt: "Close up man wearing apron"},
|
||||
]}
|
||||
title="What Our Users Are Saying"
|
||||
description="See how WireGen AI empowers designers and developers to bring their ideas to life, faster and more efficiently."
|
||||
@@ -485,35 +286,17 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "faq1",
|
||||
title: "What is WireGen AI?",
|
||||
content: "WireGen AI is an AI-powered platform that generates editable website wireframes from natural language prompts. It helps designers and developers rapidly prototype and build web applications.",
|
||||
},
|
||||
id: "faq1", title: "What is WireGen AI?", content: "WireGen AI is an AI-powered platform that generates editable website wireframes from natural language prompts. It helps designers and developers rapidly prototype and build web applications."},
|
||||
{
|
||||
id: "faq2",
|
||||
title: "How does the AI work?",
|
||||
content: "Our AI leverages advanced large language models to interpret your prompt, understand your website's purpose, target audience, and content, then generates a structured plan and visual wireframes accordingly.",
|
||||
},
|
||||
id: "faq2", title: "How does the AI work?", content: "Our AI leverages advanced large language models to interpret your prompt, understand your website's purpose, target audience, and content, then generates a structured plan and visual wireframes accordingly."},
|
||||
{
|
||||
id: "faq3",
|
||||
title: "Can I edit the generated wireframes?",
|
||||
content: "Yes! All generated wireframes are fully editable using our intuitive drag-and-drop editor. You can reorder sections, customize content, and change layouts to fit your exact vision.",
|
||||
},
|
||||
id: "faq3", title: "Can I edit the generated wireframes?", content: "Yes! All generated wireframes are fully editable using our intuitive drag-and-drop editor. You can reorder sections, customize content, and change layouts to fit your exact vision."},
|
||||
{
|
||||
id: "faq4",
|
||||
title: "What export options are available?",
|
||||
content: "You can export your wireframes as structured JSON, reusable React components, or a complete, production-ready Next.js project structure, making developer handoff seamless.",
|
||||
},
|
||||
id: "faq4", title: "What export options are available?", content: "You can export your wireframes as structured JSON, reusable React components, or a complete, production-ready Next.js project structure, making developer handoff seamless."},
|
||||
{
|
||||
id: "faq5",
|
||||
title: "Is there a free plan available?",
|
||||
content: "Yes, we offer a generous Free plan that allows you to generate a limited number of AI wireframes per month, with access to basic editing and single-page export features.",
|
||||
},
|
||||
id: "faq5", title: "Is there a free plan available?", content: "Yes, we offer a generous Free plan that allows you to generate a limited number of AI wireframes per month, with access to basic editing and single-page export features."},
|
||||
{
|
||||
id: "faq6",
|
||||
title: "Do you offer team collaboration features?",
|
||||
content: "Yes, our Business plan includes comprehensive team collaboration features, allowing multiple users to work on projects simultaneously, share feedback, and manage roles.",
|
||||
},
|
||||
id: "faq6", title: "Do you offer team collaboration features?", content: "Yes, our Business plan includes comprehensive team collaboration features, allowing multiple users to work on projects simultaneously, share feedback, and manage roles."},
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Find quick answers to common questions about WireGen AI, its features, and how it can benefit your design process."
|
||||
@@ -525,8 +308,7 @@ export default function LandingPage() {
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
variant: "sparkles-gradient"}}
|
||||
tag="Ready to Build?"
|
||||
title="Start Your Free Wireframe Generation"
|
||||
description="Join thousands of designers and developers accelerating their workflow. Get started with WireGen AI today!"
|
||||
@@ -541,83 +323,49 @@ export default function LandingPage() {
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Product",
|
||||
items: [
|
||||
title: "Product", items: [
|
||||
{
|
||||
label: "Features",
|
||||
href: "#features",
|
||||
},
|
||||
label: "Features", href: "#features"},
|
||||
{
|
||||
label: "Pricing",
|
||||
href: "#pricing",
|
||||
},
|
||||
label: "Pricing", href: "#pricing"},
|
||||
{
|
||||
label: "AI Capabilities",
|
||||
href: "#",
|
||||
},
|
||||
label: "AI Capabilities", href: "#"},
|
||||
{
|
||||
label: "Roadmap",
|
||||
href: "#",
|
||||
},
|
||||
label: "Roadmap", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
title: "Company", items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
},
|
||||
label: "About Us", href: "#about"},
|
||||
{
|
||||
label: "Careers",
|
||||
href: "#",
|
||||
},
|
||||
label: "Careers", href: "#"},
|
||||
{
|
||||
label: "Blog",
|
||||
href: "#",
|
||||
},
|
||||
label: "Blog", href: "#"},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
label: "Contact", href: "#contact"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Resources",
|
||||
items: [
|
||||
title: "Resources", items: [
|
||||
{
|
||||
label: "Documentation",
|
||||
href: "#",
|
||||
},
|
||||
label: "Documentation", href: "#"},
|
||||
{
|
||||
label: "Support",
|
||||
href: "#",
|
||||
},
|
||||
label: "Support", href: "#"},
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#faq",
|
||||
},
|
||||
label: "FAQ", href: "#faq"},
|
||||
{
|
||||
label: "Community",
|
||||
href: "#",
|
||||
},
|
||||
label: "Community", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
title: "Legal", items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
label: "Privacy Policy", href: "#"},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
label: "Terms of Service", href: "#"},
|
||||
{
|
||||
label: "Cookie Policy",
|
||||
href: "#",
|
||||
},
|
||||
label: "Cookie Policy", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
Reference in New Issue
Block a user