Update src/app/page.tsx
This commit is contained in:
139
src/app/page.tsx
139
src/app/page.tsx
@@ -2,14 +2,13 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
||||
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
|
||||
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
|
||||
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
|
||||
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
||||
import HeroCentered from '@/components/sections/hero/HeroCentered';
|
||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
|
||||
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
|
||||
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
||||
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
||||
import ContactText from '@/components/sections/contact/ContactText';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
import FooterCard from '@/components/sections/footer/FooterCard';
|
||||
import { Zap, Sparkles, TrendingUp, Heart, HelpCircle } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
@@ -41,7 +40,7 @@ export default function LandingPage() {
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
<HeroCentered
|
||||
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" }}
|
||||
@@ -65,7 +64,7 @@ export default function LandingPage() {
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<InlineImageSplitTextAbout
|
||||
<MetricSplitMediaAbout
|
||||
heading={[
|
||||
{ type: "text", content: "Our proven" },
|
||||
{ type: "image", src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/a-professional-badge-or-stamp-design-rep-1772549676901-195261fb.png", alt: "Process methodology" },
|
||||
@@ -80,7 +79,7 @@ export default function LandingPage() {
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardOne
|
||||
<FeatureCardNineteen
|
||||
title="MVP Development Services"
|
||||
description="End-to-end development services designed for early-stage founders and startup CTOs who need speed without sacrificing quality."
|
||||
tag="What We Deliver"
|
||||
@@ -116,8 +115,38 @@ export default function LandingPage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardFive
|
||||
title="Pricing Plans"
|
||||
description="Transparent, fixed pricing for your MVP development needs."
|
||||
tag="Pricing"
|
||||
tagIcon={Zap}
|
||||
plans={[
|
||||
{
|
||||
id: "starter", title: "Starter", price: "$50K", period: "fixed", features: ["4-week timeline", "Up to 5 core features", "Basic design", "Testing & QA", "30 days support"],
|
||||
button: { text: "Get Started", href: "contact" },
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/a-modern-clean-mvp-development-dashboard-1772549675828-98387a7e.png"
|
||||
},
|
||||
{
|
||||
id: "professional", title: "Professional", price: "$100K", period: "fixed", features: ["6-week timeline", "Up to 10 core features", "Advanced design", "Full testing & QA", "60 days support"],
|
||||
button: { text: "Get Started", href: "contact" },
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/a-modern-clean-mvp-development-dashboard-1772549675828-98387a7e.png"
|
||||
},
|
||||
{
|
||||
id: "enterprise", title: "Enterprise", price: "$150K", period: "fixed", features: ["8-week timeline", "Unlimited features", "Premium design", "Comprehensive testing", "90 days support"],
|
||||
button: { text: "Contact Sales", href: "contact" },
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/a-modern-clean-mvp-development-dashboard-1772549675828-98387a7e.png"
|
||||
}
|
||||
]}
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
buttonAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardSeven
|
||||
<MetricCardEleven
|
||||
title="Our Track Record"
|
||||
description="Proven results backed by real numbers and early-stage founder success stories."
|
||||
tag="By the Numbers"
|
||||
@@ -134,9 +163,6 @@ export default function LandingPage() {
|
||||
},
|
||||
{
|
||||
id: "4", value: "92%", title: "Client satisfaction rating", items: ["Founders recommend us to peers", "Repeat business from 70% of clients", "Average engagement duration 6+ months"]
|
||||
},
|
||||
{
|
||||
id: "5", value: "$X+M", title: "Total funding raised by our clients", items: ["Cumulative investor success stories", "Clients securing Series A rounds", "Founders achieving profitability"]
|
||||
}
|
||||
]}
|
||||
animationType="slide-up"
|
||||
@@ -150,36 +176,30 @@ export default function LandingPage() {
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwo
|
||||
title="Founder Love"
|
||||
description="What early-stage founders and startup CTOs have to say about working with us."
|
||||
tag="Reviews"
|
||||
tagIcon={Heart}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", 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. We've already secured seed funding with the product they built.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/a-professional-headshot-of-a-confident-m-1772549677631-fe254b42.png"
|
||||
},
|
||||
{
|
||||
id: "2", 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. Their startup expertise meant they understood our constraints and shipped exactly what we needed.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/a-professional-headshot-of-a-female-cto--1772549675414-bd393948.png"
|
||||
},
|
||||
{
|
||||
id: "3", name: "James Wilson", role: "Product Manager", testimonial: "The communication was exceptional. We had weekly updates, quick turnarounds on feedback, and they actually guided us on product decisions. That level of partnership is rare in dev agencies.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/a-professional-headshot-of-a-male-produc-1772549675516-58be5645.png"
|
||||
},
|
||||
{
|
||||
id: "4", name: "Priya Patel", role: "Co-Founder", testimonial: "Shipping a healthcare MVP is complex with compliance requirements. Webild not only built a solid product but advised us on technical architecture that scaled with our growth. Worth every penny.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/a-professional-headshot-of-a-female-co-f-1772549677551-372c31dc.png"
|
||||
},
|
||||
{
|
||||
id: "5", name: "Michael Torres", role: "Founder", testimonial: "They delivered early and under budget. We reinvested the savings into marketing. Best decision we made during our pre-launch phase.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/a-professional-headshot-of-a-male-founde-1772549675299-af3a6443.png"
|
||||
},
|
||||
{
|
||||
id: "6", name: "Emma Gottlieb", role: "Startup Advisor", testimonial: "I recommend Webild to founders in our portfolio. They consistently deliver quality MVPs that impress investors and validate business models quickly.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/a-professional-headshot-of-a-female-vent-1772549676940-91b7d9b5.png"
|
||||
}
|
||||
]}
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
buttonAnimation="slide-up"
|
||||
/>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
@@ -190,22 +210,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. We provide fixed timelines upfront so there are no surprises."
|
||||
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: "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: "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: "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: "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: "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: "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: "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: "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: "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."
|
||||
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."
|
||||
}
|
||||
]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ARJeYX8Eds8VZQrJWHsamdmY5p/an-illustration-showing-a-diverse-team-c-1772549676060-783dcc25.png"
|
||||
@@ -218,27 +238,14 @@ export default function LandingPage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
text="Ready to ship your MVP faster? Let's talk about your product vision and timeline."
|
||||
animationType="entrance-slide"
|
||||
buttons={[
|
||||
{ text: "Schedule a call", href: "#" },
|
||||
{ text: "Send us details", href: "#" }
|
||||
]}
|
||||
background={{ variant: "plain" }}
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
<FooterCard
|
||||
columns={[
|
||||
{
|
||||
title: "Product", items: [
|
||||
{ label: "Services", href: "#services" },
|
||||
{ label: "Process", href: "#about" },
|
||||
{ label: "Pricing", href: "#" },
|
||||
{ label: "Pricing", href: "#pricing" },
|
||||
{ label: "Case Studies", href: "#" }
|
||||
]
|
||||
},
|
||||
@@ -272,4 +279,4 @@ export default function LandingPage() {
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user