Update src/app/page.tsx

This commit is contained in:
2026-03-03 15:31:15 +00:00
parent e48f400fcd
commit c51e594b7e

View File

@@ -44,10 +44,15 @@ export default function LandingPage() {
title="Ship your MVP in weeks, not months"
description="We turn your product vision into market-ready software. Transparent process, experienced team, startup-focused delivery."
background={{ variant: "plain" }}
tag="MVP Development"
tagIcon={Zap}
buttons={[
{ text: "Start your project", href: "contact" },
{ text: "View our work", href: "testimonials" }
]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/a-modern-clean-mvp-development-dashboard-1772549675828-98387a7e.png"
imageAlt="MVP development platform dashboard"
mediaAnimation="slide-up"
avatars={[
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/a-professional-headshot-of-a-confident-m-1772549677631-fe254b42.png", alt: "Founder testimonial" },
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/a-professional-headshot-of-a-female-cto--1772549675414-bd393948.png", alt: "Startup founder" },
@@ -61,14 +66,19 @@ export default function LandingPage() {
<div id="about" data-section="about">
<MetricSplitMediaAbout
title="Our proven process gets your product to market fast"
description="End-to-end development services designed for early-stage founders and startup CTOs who need speed without sacrificing quality."
description="End-to-end methodology designed for early-stage founders"
metrics={[
{ value: "50+", title: "MVPs Launched" },
{ value: "4-8 weeks", title: "Average Delivery" }
{ label: "50+", value: "MVPs Launched" },
{ label: "4-8 weeks", value: "Average Delivery" },
{ label: "98%", value: "On-Time Delivery" }
]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/a-professional-badge-or-stamp-design-rep-1772549676901-195261fb.png"
imageAlt="Process methodology"
useInvertedBackground={false}
mediaAnimation="slide-up"
metricsAnimation="slide-up"
buttons={[
{ text: "Learn about our process", href: "#" }
]}
buttonAnimation="slide-up"
/>
</div>
@@ -80,30 +90,26 @@ export default function LandingPage() {
tagIcon={Sparkles}
features={[
{
id: 1,
tag: "Development", title: "Full-Stack Development", subtitle: "Complete Solutions", description: "From backend architecture to responsive frontend, we build complete, scalable MVPs using modern tech stacks.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/an-illustration-showing-full-stack-web-d-1772549676836-f67fe53a.png"
id: "1", title: "Full-Stack Development", description: "From backend architecture to responsive frontend, we build complete, scalable MVPs using modern tech stacks.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/an-illustration-showing-full-stack-web-d-1772549676836-f67fe53a.png", imageAlt: "Full-Stack Development"
},
{
id: 2,
tag: "Speed", title: "Rapid Prototyping", subtitle: "Quick Iteration", description: "Validate your concept in weeks. We iterate quickly based on feedback to ensure product-market fit.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/an-illustration-depicting-rapid-prototyp-1772549676043-790dc1a3.png"
id: "2", title: "Rapid Prototyping", description: "Validate your concept in weeks. We iterate quickly based on feedback to ensure product-market fit.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/an-illustration-depicting-rapid-prototyp-1772549676043-790dc1a3.png", imageAlt: "Rapid Prototyping"
},
{
id: 3,
tag: "Communication", title: "Transparent Process", subtitle: "Clear Updates", description: "Regular updates, clear communication, and predictable timelines. You're never left wondering where your project stands.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/an-illustration-representing-transparent-1772549676346-0ef468aa.png"
id: "3", title: "Transparent Process", description: "Regular updates, clear communication, and predictable timelines. You're never left wondering where your project stands.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/an-illustration-representing-transparent-1772549676346-0ef468aa.png", imageAlt: "Transparent Process"
},
{
id: 4,
tag: "Experience", title: "Startup Expertise", subtitle: "Industry Knowledge", description: "We've built 50+ MVPs for founders just like you. We understand your constraints and priorities.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/an-illustration-showing-startup-expertis-1772549678299-71f4942e.png"
id: "4", title: "Startup Expertise", description: "We've built 50+ MVPs for founders just like you. We understand your constraints and priorities.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/an-illustration-showing-startup-expertis-1772549678299-71f4942e.png", imageAlt: "Startup Expertise"
},
{
id: 5,
tag: "Support", title: "Post-Launch Support", subtitle: "Ongoing Help", description: "Your MVP success doesn't end at launch. We provide onboarding support and optimization guidance.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/an-illustration-representing-post-launch-1772549676364-c7ea749f.png"
id: "5", title: "Post-Launch Support", description: "Your MVP success doesn't end at launch. We provide onboarding support and optimization guidance.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/an-illustration-representing-post-launch-1772549676364-c7ea749f.png", imageAlt: "Post-Launch Support"
},
{
id: 6,
tag: "Value", title: "Cost-Effective Solutions", subtitle: "Budget Friendly", description: "Fixed pricing models and optimized workflows mean you get maximum value for your development budget.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/an-illustration-depicting-cost-effective-1772549676605-358044db.png"
id: "6", title: "Cost-Effective Solutions", description: "Fixed pricing models and optimized workflows mean you get maximum value for your development budget.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/an-illustration-depicting-cost-effective-1772549676605-358044db.png", imageAlt: "Cost-Effective Solutions"
}
]}
gridVariant="two-items-per-row"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
buttons={[
@@ -115,27 +121,37 @@ export default function LandingPage() {
<div id="pricing" data-section="pricing">
<PricingCardFive
title="Pricing Plans"
description="Transparent, fixed pricing for your MVP development needs."
title="Simple, Transparent Pricing"
description="Choose the perfect plan for your MVP development needs."
tag="Pricing"
tagIcon={Zap}
tagIcon={TrendingUp}
plans={[
{
id: "starter", tag: "Starter", price: "$50K", period: "fixed", description: "4-week timeline with core features", featuresTitle: "Includes", features: ["4-week timeline", "Up to 5 core features", "Basic design", "Testing & QA", "30 days support"],
button: { text: "Get Started", href: "contact" }
id: "1", name: "Starter", description: "Perfect for validating your concept", price: "$50K", features: [
"4-week delivery timeline", "Up to 5 core features", "Basic responsive design", "Standard tech stack", "30 days post-launch support"
],
button: { text: "Get Started", href: "#" }
},
{
id: "professional", tag: "Professional", price: "$100K", period: "fixed", description: "6-week timeline with advanced features", featuresTitle: "Includes", features: ["6-week timeline", "Up to 10 core features", "Advanced design", "Full testing & QA", "60 days support"],
button: { text: "Get Started", href: "contact" }
id: "2", name: "Growth", description: "Ideal for funded startups", price: "$100K", features: [
"6-week delivery timeline", "Up to 12 core features", "Advanced UI/UX design", "Custom integrations", "60 days post-launch support", "Database optimization"
],
button: { text: "Get Started", href: "#" },
highlighted: true
},
{
id: "enterprise", tag: "Enterprise", price: "$150K", period: "fixed", description: "8-week timeline with unlimited features", featuresTitle: "Includes", features: ["8-week timeline", "Unlimited features", "Premium design", "Comprehensive testing", "90 days support"],
button: { text: "Contact Sales", href: "contact" }
id: "3", name: "Enterprise", description: "For complex, scalable solutions", price: "$150K", features: [
"8-week delivery timeline", "Unlimited features", "Premium design & UX", "Advanced integrations", "90 days post-launch support", "Performance optimization", "Technical architecture consultation"
],
button: { text: "Get Started", href: "#" }
}
]}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
buttons={[
{ text: "View detailed pricing", href: "#" }
]}
buttonAnimation="slide-up"
/>
</div>
@@ -148,16 +164,16 @@ export default function LandingPage() {
tagIcon={TrendingUp}
metrics={[
{
id: "1", value: "50+", title: "MVPs launched for startups", description: "From seed to Series A funding across multiple industries with 98% on-time delivery"
id: "1", value: "50+", title: "MVPs launched for startups", description: "From seed to Series A funding"
},
{
id: "2", value: "4-8 weeks", title: "Average MVP delivery time", description: "40% faster than industry average with 2 iteration cycles included"
id: "2", value: "4-8 weeks", title: "Average MVP delivery time", description: "40% faster than industry average"
},
{
id: "3", value: "$50K-$150K", title: "Typical MVP investment range", description: "Cost-effective vs in-house hiring with no long-term employment costs"
id: "3", value: "$50K-$150K", title: "Typical MVP investment range", description: "Cost-effective vs. in-house hiring"
},
{
id: "4", value: "92%", title: "Client satisfaction rating", description: "Founders recommend us to peers with 70% repeat business rate"
id: "4", value: "92%", title: "Client satisfaction rating", description: "Founders recommend us to peers"
}
]}
animationType="slide-up"
@@ -171,28 +187,13 @@ export default function LandingPage() {
</div>
<div id="testimonials" data-section="testimonials">
<div className="w-full">
<h2 className="text-4xl font-bold text-center mb-12">Founder Love</h2>
<p className="text-center text-lg mb-8">What early-stage founders and startup CTOs have to say about working with us.</p>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
{[
{
name: "Alex Chen", role: "Founder & CEO", testimonial: "Webild turned our idea into a fully functional MVP in just 6 weeks. Their transparent process made us feel like true partners, not just another client.", image: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/a-professional-headshot-of-a-confident-m-1772549677631-fe254b42.png"
},
{
name: "Sarah Martinez", role: "CTO", testimonial: "We tried hiring developers locally but the costs were astronomical. Webild delivered better quality code at 60% of the cost.", image: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/a-professional-headshot-of-a-female-cto--1772549675414-bd393948.png"
},
{
name: "James Wilson", role: "Product Manager", testimonial: "The communication was exceptional. We had weekly updates, quick turnarounds on feedback, and they guided us on product decisions.", image: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/a-professional-headshot-of-a-male-produc-1772549675516-58be5645.png"
}
].map((testimonial, index) => (
<div key={index} className="bg-white rounded-lg p-6 shadow-md">
<img src={testimonial.image} alt={testimonial.name} className="w-12 h-12 rounded-full mb-4" />
<p className="text-sm text-gray-600 mb-4">"{testimonial.testimonial}"</p>
<p className="font-semibold">{testimonial.name}</p>
<p className="text-sm text-gray-500">{testimonial.role}</p>
</div>
))}
<div className="py-20">
<div className="mx-auto w-content-width">
<div className="mb-12 text-center">
<p className="text-sm font-medium text-accent mb-2">Reviews</p>
<h2 className="text-4xl font-bold mb-4">Founder Love</h2>
<p className="text-foreground/70">What early-stage founders and startup CTOs have to say about working with us.</p>
</div>
</div>
</div>
</div>
@@ -205,22 +206,22 @@ export default function LandingPage() {
tagIcon={HelpCircle}
faqs={[
{
id: "1", title: "How long does an MVP typically take?", content: "Most MVPs take 4-8 weeks from kickoff to launch. This includes requirements gathering, design, development, testing, and 2 iteration cycles. Timeline can be adjusted based on scope and complexity."
id: "1", title: "How long does an MVP typically take?", content: "Most MVPs take 4-8 weeks from kickoff to launch. This includes requirements gathering, design, development, testing, and 2 iteration cycles. Timeline can be adjusted based on scope and complexity. We provide fixed timelines upfront so there are no surprises."
},
{
id: "2", title: "What's your pricing model?", content: "We offer fixed-price packages for standard MVP scopes, typically ranging from $50K-$150K. This includes the full development lifecycle, not just code."
id: "2", title: "What's your pricing model?", content: "We offer fixed-price packages for standard MVP scopes, typically ranging from $50K-$150K. This includes the full development lifecycle, not just code. We also offer time-and-materials engagement for more complex or exploratory projects. Transparent pricing with no hidden fees."
},
{
id: "3", title: "What tech stack do you use?", content: "We build modern, scalable applications using React/Next.js for frontend, Node.js/Python for backend, and cloud infrastructure like AWS or GCP."
id: "3", title: "What tech stack do you use?", content: "We build modern, scalable applications using React/Next.js for frontend, Node.js/Python for backend, and cloud infrastructure like AWS or GCP. We choose the best tools for your specific use case. All codebases follow industry best practices and are production-ready."
},
{
id: "4", title: "Can you help with fundraising?", content: "Absolutely. We have experience working with founders during fundraising rounds. We can help prepare technical documentation and demo environments that impress investors."
id: "4", title: "Can you help with fundraising?", content: "Absolutely. We have experience working with founders during fundraising rounds. We can help prepare technical documentation, architecture diagrams, and demo environments that impress investors. Many of our clients have successfully raised seed and Series A funding with MVPs we built."
},
{
id: "5", title: "What if I need to pivot or make changes?", content: "Iteration is built into our process. We schedule 2 major iteration cycles into every project. We're agile and responsive to feedback."
id: "5", title: "What if I need to pivot or make changes?", content: "Iteration is built into our process. We schedule 2 major iteration cycles into every project. We're agile and responsive to feedback. Changes within scope are handled during these cycles; significant scope expansions can be managed via project extensions."
},
{
id: "6", title: "Do you provide post-launch support?", content: "Yes. We offer 30 days of post-launch support included with every project, covering bug fixes and minor optimizations."
id: "6", title: "Do you provide post-launch support?", content: "Yes. We offer 30 days of post-launch support included with every project, covering bug fixes and minor optimizations. Beyond that, we offer ongoing support packages for continued feature development, scaling, and optimization as your user base grows."
}
]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/an-illustration-showing-a-diverse-team-c-1772549676060-783dcc25.png"
@@ -235,8 +236,41 @@ export default function LandingPage() {
<div id="footer" data-section="footer">
<FooterCard
logoText="Webild"
copyrightText="© 2025 Webild. All rights reserved."
columns={[
{
title: "Product", items: [
{ label: "Services", href: "#services" },
{ label: "Process", href: "#about" },
{ label: "Pricing", href: "#pricing" },
{ label: "Case Studies", href: "#" }
]
},
{
title: "Company", items: [
{ label: "About", href: "#" },
{ label: "Team", href: "#" },
{ label: "Blog", href: "#" },
{ label: "Contact", href: "#" }
]
},
{
title: "Resources", items: [
{ label: "FAQ", href: "#faq" },
{ label: "Documentation", href: "#" },
{ label: "Support", href: "#" },
{ label: "Status", href: "#" }
]
},
{
title: "Legal", items: [
{ label: "Privacy", href: "#" },
{ label: "Terms", href: "#" },
{ label: "Security", href: "#" }
]
}
]}
bottomLeftText="© 2025 Webild. All rights reserved."
bottomRightText="Shipping MVPs that matter"
/>
</div>
</ThemeProvider>