2025-09-01 18:16:11 +05:30
import React from "react" ;
import { Navigation } from "../components/Navigation" ;
import { Footer } from "../components/Footer" ;
import { Button } from "../components/ui/button" ;
import { Badge } from "../components/ui/badge" ;
2026-03-27 11:13:52 +05:30
import amozImg from "../assets/amoz.jpg"
2025-09-01 18:16:11 +05:30
import { Card , CardContent } from "../components/ui/card" ;
import { ArrowRight , Calendar , Users , Smartphone , Globe , Check , Star , TrendingUp , ShoppingBag , Brain , Zap , MessageCircle , Target , AlertCircle , Clock , DollarSign , Play , Shield , CreditCard } from "lucide-react" ;
import { ImageWithFallback } from "../components/figma/ImageWithFallback" ;
2025-09-23 20:13:31 +05:30
import { useNavigate } from "react-router-dom" ;
2025-09-01 18:16:11 +05:30
export const AmozProject = ( ) = > {
2025-09-23 20:13:31 +05:30
const navigate = useNavigate ( ) ;
2025-09-01 18:16:11 +05:30
return (
< div className = "dark min-h-screen bg-background" >
2025-09-23 20:13:31 +05:30
{ /* <Navigation /> */ }
2026-03-27 11:13:52 +05:30
2025-09-01 18:16:11 +05:30
{ /* Hero Section */ }
< section className = "pt-24 pb-16 bg-background relative overflow-hidden" >
< div className = "absolute inset-0 bg-gradient-to-br from-[#E5195E]/5 via-transparent to-transparent" / >
< div className = "container mx-auto px-6 lg:px-8 relative" >
< div className = "grid lg:grid-cols-2 gap-12 items-center" >
< div >
< div className = "flex items-center gap-2 mb-6" >
< Badge className = "bg-[#E5195E]/10 text-[#E5195E] border border-[#E5195E]/20 font-manrope" >
< Brain className = "w-4 h-4 mr-2" / >
AI Social Commerce Case Study
< / Badge >
< / div >
2026-03-27 11:13:52 +05:30
2025-09-01 18:16:11 +05:30
< h1 className = "text-4xl md:text-5xl lg:text-6xl font-bold mb-6 text-white font-manrope" >
Amoz Platform
< / h1 >
2026-03-27 11:13:52 +05:30
2025-09-01 18:16:11 +05:30
< p className = "text-xl text-muted-foreground mb-8 font-manrope" >
AI - Powered Social Commerce Platform - Merging social networking and e - commerce with AI - driven recommendations and influencer monetization capabilities
< / p >
{ /* Tech Stack */ }
< div className = "flex flex-wrap gap-2 mb-8" >
{ [ "React Native" , "Next.js" , "Node.js" , "PostgreSQL" , "TensorFlow" , "AWS" ] . map ( ( tech ) = > (
< Badge key = { tech } variant = "outline" className = "border-white/20 text-white font-manrope" >
{ tech }
< / Badge >
) ) }
< / div >
{ /* Key Metrics */ }
< div className = "grid grid-cols-2 md:grid-cols-4 gap-4 mb-8" >
< div className = "text-center p-3 bg-card/30 rounded-lg border border-white/10" >
< Calendar className = "w-5 h-5 text-[#E5195E] mx-auto mb-2" / >
< div className = "text-lg font-bold text-white font-manrope" > 6 months < / div >
< div className = "text-xs text-muted-foreground font-manrope" > Duration < / div >
< / div >
< div className = "text-center p-3 bg-card/30 rounded-lg border border-white/10" >
< Users className = "w-5 h-5 text-[#E5195E] mx-auto mb-2" / >
< div className = "text-lg font-bold text-white font-manrope" > 8 experts < / div >
< div className = "text-xs text-muted-foreground font-manrope" > Team Size < / div >
< / div >
2026-03-27 11:13:52 +05:30
{ / * < d i v c l a s s N a m e = " t e x t - c e n t e r p - 3 b g - c a r d / 3 0 r o u n d e d - l g b o r d e r b o r d e r - w h i t e / 1 0 " >
2025-09-01 18:16:11 +05:30
< Globe className = "w-5 h-5 text-[#E5195E] mx-auto mb-2" / >
< div className = "text-lg font-bold text-white font-manrope" > iOS / Android / Web < / div >
< div className = "text-xs text-muted-foreground font-manrope" > Platforms < / div >
2026-03-27 11:13:52 +05:30
< / div > * / }
< div className = "text-center p-3 bg-card/30 rounded-lg border border-white/10" >
< Globe className = "w-5 h-5 text-[#E5195E] mx-auto mb-2" / >
< div className = "text-lg font-bold text-white font-manrope break-words" >
iOS / Android / Web
< / div >
< div className = "text-xs text-muted-foreground font-manrope" >
Platforms
< / div >
2025-09-01 18:16:11 +05:30
< / div >
< div className = "text-center p-3 bg-card/30 rounded-lg border border-white/10" >
< DollarSign className = "w-5 h-5 text-[#E5195E] mx-auto mb-2" / >
< div className = "text-lg font-bold text-white font-manrope" > $1 . 2 M < / div >
< div className = "text-xs text-muted-foreground font-manrope" > Q1 Transactions < / div >
< / div >
< / div >
{ /* Key Achievements */ }
< div className = "space-y-3 mb-8" >
< h3 className = "text-lg font-semibold text-white mb-4 font-manrope" > Key Achievements : < / h3 >
{ [
"Onboarded 5,000+ merchants in first 2 months post-launch" ,
"AI recommendation engine achieved 28% increase in user engagement" ,
"Processed $1.2M in transactions within first quarter" ,
"Built unified social + shopping platform with AI-driven personalization"
] . map ( ( achievement , index ) = > (
< div key = { index } className = "flex items-center gap-3" >
< Check className = "w-5 h-5 text-[#E5195E] flex-shrink-0" / >
< span className = "text-muted-foreground font-manrope" > { achievement } < / span >
< / div >
) ) }
< / div >
{ /* CTA Buttons */ }
< div className = "flex flex-col sm:flex-row gap-4" >
2026-03-27 11:13:52 +05:30
< Button
2025-09-01 18:16:11 +05:30
size = "lg"
className = "bg-[#E5195E] hover:bg-[#E5195E]/90 text-white font-manrope"
2025-09-23 20:13:31 +05:30
onClick = { ( ) = > navigate ( '/start-a-project' ) }
2025-09-01 18:16:11 +05:30
>
Build Your AI Commerce Platform
< ArrowRight className = "w-5 h-5 ml-2" / >
< / Button >
2026-03-27 11:13:52 +05:30
< Button
2025-09-01 18:16:11 +05:30
size = "lg"
variant = "outline"
className = "border-white/20 text-white hover:bg-white/10 font-manrope"
2025-09-23 20:13:31 +05:30
onClick = { ( ) = > navigate ( '/case-studies' ) }
2025-09-01 18:16:11 +05:30
>
View More Cases
< / Button >
< / div >
< / div >
< div className = "relative" >
< div className = "aspect-square bg-gradient-to-br from-[#E5195E]/20 to-transparent rounded-2xl p-8 border border-white/10" >
2026-03-27 11:13:52 +05:30
< ImageWithFallback
src = { amozImg }
2025-09-01 18:16:11 +05:30
alt = "Amoz AI-Powered Social Commerce Platform"
className = "w-full h-full object-cover rounded-lg"
/ >
< / div >
< / div >
< / div >
< / div >
< / section >
{ /* Executive Summary */ }
< section className = "py-16 bg-card/30" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-4xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-6 font-manrope" > Executive Summary < / h2 >
< p className = "text-lg text-muted-foreground leading-relaxed font-manrope mb-6" >
Amoz merges social networking and e - commerce into a single platform , enabling influencers , small businesses , and users to connect , showcase products , and transact seamlessly . AI - driven recommendations enhance product discovery , while built - in messaging and content creation tools drive community engagement .
< / p >
< p className = "text-lg text-muted-foreground leading-relaxed font-manrope" >
The comprehensive platform bridges the gap between content and transactions , integrating influencer marketing , live product showcases , and frictionless purchasing to create the preferred shopping experience for younger demographics seeking social commerce solutions .
< / p >
< / div >
< / div >
< / section >
{ /* Project Overview */ }
< section className = "py-16 bg-background" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-6xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-12 text-center font-manrope" > Project Overview < / h2 >
2026-03-27 11:13:52 +05:30
2025-09-01 18:16:11 +05:30
< div className = "grid md:grid-cols-3 gap-8" >
< Card className = "bg-card/50 border-white/10" >
< CardContent className = "p-6" >
< Target className = "w-8 h-8 text-[#E5195E] mb-4" / >
< h3 className = "text-xl font-semibold text-white mb-3 font-manrope" > Background & Context < / h3 >
< p className = "text-muted-foreground font-manrope" >
Social commerce is rapidly becoming the preferred shopping experience for younger demographics , but existing solutions often split content and transactions across multiple apps . Amoz bridges this gap with a unified social + shopping platform , integrating influencer marketing , live product showcases , and frictionless purchasing .
< / p >
< / CardContent >
< / Card >
< Card className = "bg-card/50 border-white/10" >
< CardContent className = "p-6" >
< Users className = "w-8 h-8 text-[#E5195E] mb-4" / >
< h3 className = "text-xl font-semibold text-white mb-3 font-manrope" > Target Audience < / h3 >
< p className = "text-muted-foreground font-manrope" >
Influencers & content creators looking to monetize their audience , small - to - medium online merchants seeking social selling platforms , and young consumers seeking social shopping experiences with integrated content discovery and purchasing capabilities .
< / p >
< / CardContent >
< / Card >
< Card className = "bg-card/50 border-white/10" >
< CardContent className = "p-6" >
< TrendingUp className = "w-8 h-8 text-[#E5195E] mb-4" / >
< h3 className = "text-xl font-semibold text-white mb-3 font-manrope" > Business Objectives < / h3 >
< p className = "text-muted-foreground font-manrope" >
Create a mobile - first platform combining content and commerce , provide AI - driven personalized product recommendations , enable secure , fast , and user - friendly checkout experience , and offer built - in tools for influencers to monetize their audience effectively .
< / p >
< / CardContent >
< / Card >
< / div >
< / div >
< / div >
< / section >
{ /* Project Scope */ }
< section className = "py-16 bg-card/30" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-6xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-12 text-center font-manrope" > Project Scope < / h2 >
2026-03-27 11:13:52 +05:30
2025-09-01 18:16:11 +05:30
< div className = "grid md:grid-cols-2 gap-12" >
< div >
< h3 className = "text-xl font-semibold text-white mb-6 font-manrope" > Core Features < / h3 >
< div className = "space-y-4" >
{ [
"AI-Powered Product Recommendations based on browsing, social interactions, and purchase history" ,
"Influencer Storefronts allowing creators to sell directly via profiles" ,
"Live Product Showcases with integrated purchase options" ,
"In-App Messaging for buyer-seller and community engagement" ,
"Secure Payments with Stripe and multiple local payment gateways" ,
"Order Tracking with push notifications and delivery updates"
] . map ( ( feature , index ) = > (
< div key = { index } className = "flex items-start gap-3 p-3 bg-background/50 rounded-lg border border-white/10" >
< Check className = "w-5 h-5 text-[#E5195E] flex-shrink-0 mt-0.5" / >
< span className = "text-muted-foreground font-manrope text-sm" > { feature } < / span >
< / div >
) ) }
< / div >
< / div >
< div >
< h3 className = "text-xl font-semibold text-white mb-6 font-manrope" > Technical Requirements < / h3 >
< div className = "space-y-4" >
{ [
"Scalable microservices backend" ,
"Real-time chat and live streaming capability" ,
"AI/ML integration for recommendation algorithms" ,
"Payment gateway compliance with PCI DSS standards" ,
"AWS-based cloud infrastructure for hosting and media storage"
] . map ( ( requirement , index ) = > (
< div key = { index } className = "flex items-start gap-3 p-3 bg-background/50 rounded-lg border border-white/10" >
< Shield className = "w-5 h-5 text-[#E5195E] flex-shrink-0 mt-0.5" / >
< span className = "text-muted-foreground font-manrope text-sm" > { requirement } < / span >
< / div >
) ) }
< / div >
< / div >
< / div >
< / div >
< / div >
< / section >
{ /* Challenges & Solution Architecture */ }
< section className = "py-16 bg-background" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-6xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-12 text-center font-manrope" > Challenges & Solution Architecture < / h2 >
2026-03-27 11:13:52 +05:30
2025-09-01 18:16:11 +05:30
< div className = "grid md:grid-cols-2 gap-12 mb-16" >
< div >
< h3 className = "text-xl font-semibold text-white mb-6 font-manrope" > Technical Challenges < / h3 >
< div className = "space-y-4" >
{ [
"Balancing performance with heavy image/video content" ,
"Building a real-time recommendation system with low latency" ,
"Implementing seamless live shopping experiences without lag"
] . map ( ( challenge , index ) = > (
< div key = { index } className = "flex items-start gap-3" >
< AlertCircle className = "w-5 h-5 text-[#E5195E] flex-shrink-0 mt-0.5" / >
< span className = "text-muted-foreground font-manrope" > { challenge } < / span >
< / div >
) ) }
< / div >
< / div >
< div >
< h3 className = "text-xl font-semibold text-white mb-6 font-manrope" > Project Management Challenges < / h3 >
< div className = "space-y-4" >
{ [
"Coordinating between AI, frontend, and payment teams" ,
"Managing content moderation for a social platform" ,
"Handling rapid feature iterations while maintaining stability"
] . map ( ( challenge , index ) = > (
< div key = { index } className = "flex items-start gap-3" >
< AlertCircle className = "w-5 h-5 text-[#E5195E] flex-shrink-0 mt-0.5" / >
< span className = "text-muted-foreground font-manrope" > { challenge } < / span >
< / div >
) ) }
< / div >
< / div >
< / div >
< div className = "bg-card/50 p-8 rounded-xl border border-white/10" >
< h3 className = "text-xl font-semibold text-white mb-6 font-manrope" > Technical Architecture < / h3 >
< div className = "grid md:grid-cols-2 gap-8" >
< div >
< h4 className = "text-lg font-semibold text-white mb-4 font-manrope" > Technology Stack < / h4 >
< div className = "space-y-3" >
{ [
{ label : "Frontend" , value : "React Native, Next.js" } ,
{ label : "Backend" , value : "Node.js, Express.js" } ,
{ label : "Database" , value : "PostgreSQL, Redis" } ,
{ label : "AI/ML" , value : "TensorFlow for recommendation engine" } ,
{ label : "Payments" , value : "Stripe Payments" } ,
{ label : "Infrastructure" , value : "AWS S3, Firebase Cloud Messaging" }
] . map ( ( item , index ) = > (
< div key = { index } className = "flex justify-between items-center p-3 bg-background/50 rounded-lg border border-white/10" >
< span className = "text-muted-foreground font-manrope" > { item . label } : < / span >
< span className = "text-white font-medium font-manrope text-sm" > { item . value } < / span >
< / div >
) ) }
< / div >
< / div >
< div >
< h4 className = "text-lg font-semibold text-white mb-4 font-manrope" > Architecture Highlights < / h4 >
< div className = "space-y-3" >
{ [
"Hybrid cloud deployment leveraging AWS EC2, S3, and CloudFront for media delivery" ,
"AI microservice for recommendations and personalization" ,
"Event-driven architecture using Redis Pub/Sub for real-time updates" ,
"Multi-tier security with encryption at rest and in transit" ,
"Optimized media compression pipeline for faster load times"
] . map ( ( highlight , index ) = > (
< div key = { index } className = "flex items-center gap-3" >
< Check className = "w-5 h-5 text-[#E5195E] flex-shrink-0" / >
< span className = "text-muted-foreground text-sm font-manrope" > { highlight } < / span >
< / div >
) ) }
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / section >
{ /* Development Process */ }
< section className = "py-16 bg-card/30" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-6xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-12 text-center font-manrope" > Development Process & Methodology < / h2 >
2026-03-27 11:13:52 +05:30
2025-09-01 18:16:11 +05:30
< div className = "mb-12" >
< div className = "text-center mb-8" >
< p className = "text-lg text-muted-foreground font-manrope" >
< strong > Agile < / strong > ( 2 - week sprints ) with feature prioritization with merchant and influencer input , weekly demos for stakeholders , continuous integration with automated deployments to staging
< / p >
< / div >
2026-03-27 11:13:52 +05:30
2025-09-01 18:16:11 +05:30
< div className = "grid md:grid-cols-2 lg:grid-cols-3 gap-6" >
{ [
2026-03-27 11:13:52 +05:30
{
phase : "Discovery & Planning" ,
2025-09-01 18:16:11 +05:30
duration : "3 weeks" ,
description : "Market analysis of social commerce trends, AI recommendation system design, payment integration planning"
} ,
2026-03-27 11:13:52 +05:30
{
phase : "Design & Prototyping" ,
2025-09-01 18:16:11 +05:30
duration : "5 weeks" ,
description : "Wireframes for influencer storefronts & live shopping pages, AI model training on sample product datasets"
} ,
2026-03-27 11:13:52 +05:30
{
phase : "Core Development" ,
2025-09-01 18:16:11 +05:30
duration : "10 weeks" ,
description : "Social feed & product catalog integration, influencer tools & storefronts, recommendation engine integration"
} ,
2026-03-27 11:13:52 +05:30
{
phase : "Live Shopping & Messaging" ,
2025-09-01 18:16:11 +05:30
duration : "5 weeks" ,
description : "Real-time video streaming module, in-app chat and engagement features"
} ,
2026-03-27 11:13:52 +05:30
{
phase : "Testing & Optimization" ,
2025-09-01 18:16:11 +05:30
duration : "3 weeks" ,
description : "Load & stress testing for peak events, AI accuracy tuning"
} ,
2026-03-27 11:13:52 +05:30
{
phase : "Launch & Scaling" ,
2025-09-01 18:16:11 +05:30
duration : "2 weeks" ,
description : "Beta rollout to select merchants & influencers, marketing support and onboarding sessions"
}
] . map ( ( item , index ) = > (
< Card key = { index } className = "bg-background/50 border-white/10" >
< CardContent className = "p-6" >
< div className = "flex items-center justify-between mb-3" >
< div className = "w-8 h-8 bg-[#E5195E] rounded-full flex items-center justify-center text-white font-bold text-sm font-manrope" >
{ index + 1 }
< / div >
< Badge variant = "outline" className = "border-[#E5195E]/30 text-[#E5195E] font-manrope" >
{ item . duration }
< / Badge >
< / div >
< h3 className = "text-lg font-semibold text-white mb-2 font-manrope" > { item . phase } < / h3 >
< p className = "text-sm text-muted-foreground font-manrope" > { item . description } < / p >
< / CardContent >
< / Card >
) ) }
< / div >
< / div >
< / div >
< / div >
< / section >
{ /* Key Features */ }
< section className = "py-16 bg-background" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-6xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-12 text-center font-manrope" > Key Features & Functionality < / h2 >
2026-03-27 11:13:52 +05:30
2025-09-01 18:16:11 +05:30
< div className = "grid md:grid-cols-2 lg:grid-cols-3 gap-6 mb-12" >
{ [
{
icon : TrendingUp ,
title : "Social Feed" ,
description : "Curated content from influencers & merchants"
} ,
{
icon : Brain ,
title : "Personalized Recommendations" ,
description : "AI-driven product suggestions"
} ,
{
icon : Play ,
title : "Live Shopping" ,
description : "Real-time events with integrated checkout"
} ,
{
icon : MessageCircle ,
title : "Direct Messaging" ,
description : "Buyer-seller communication within the app"
} ,
{
icon : CreditCard ,
title : "Multi-Channel Payments" ,
description : "Stripe, local wallets, and COD options"
} ,
{
icon : ShoppingBag ,
title : "Influencer Storefronts" ,
description : "Creator-driven product showcases and sales"
}
] . map ( ( feature , index ) = > (
< Card key = { index } className = "bg-card/50 border-white/10 hover:border-[#E5195E]/30 transition-all duration-300" >
< CardContent className = "p-6 text-center" >
< feature.icon className = "w-8 h-8 text-[#E5195E] mx-auto mb-4" / >
< h3 className = "text-lg font-semibold text-white mb-3 font-manrope" > { feature . title } < / h3 >
< p className = "text-muted-foreground text-sm font-manrope" > { feature . description } < / p >
< / CardContent >
< / Card >
) ) }
< / div >
< / div >
< / div >
< / section >
{ /* Results & Impact */ }
< section className = "py-16 bg-card/30" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-6xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-12 text-center font-manrope" > Results & Impact < / h2 >
2026-03-27 11:13:52 +05:30
2025-09-01 18:16:11 +05:30
< div className = "grid md:grid-cols-2 lg:grid-cols-4 gap-6 mb-12" >
{ [
{ label : "Merchant Onboarding" , value : "5,000+" , icon : Users , desc : "first 2 months" } ,
{ label : "Engagement Increase" , value : "28%" , icon : TrendingUp , desc : "AI recommendations" } ,
{ label : "Q1 Transactions" , value : "$1.2M" , icon : DollarSign , desc : "processed" } ,
{ label : "AI Response Time" , value : "180ms" , icon : Zap , desc : "average" }
] . map ( ( metric , index ) = > (
< Card key = { index } className = "bg-background/50 border-white/10 text-center" >
< CardContent className = "p-6" >
< metric.icon className = "w-8 h-8 text-[#E5195E] mx-auto mb-3" / >
< div className = "text-2xl font-bold text-white mb-1 font-manrope" > { metric . value } < / div >
< div className = "text-muted-foreground text-sm font-manrope" > { metric . label } < / div >
< div className = "text-xs text-muted-foreground font-manrope" > { metric . desc } < / div >
< / CardContent >
< / Card >
) ) }
< / div >
< div className = "grid md:grid-cols-2 gap-8" >
< div >
< h3 className = "text-xl font-semibold text-white mb-4 font-manrope" > Business Impact < / h3 >
< ul className = "space-y-3" >
{ [
"28% higher engagement from personalized recommendations" ,
"Increased merchant sales through influencer storefronts" ,
"Faster product discovery and higher repeat purchase rates"
] . map ( ( impact , index ) = > (
< li key = { index } className = "flex items-center gap-3" >
< Check className = "w-5 h-5 text-[#E5195E] flex-shrink-0" / >
< span className = "text-muted-foreground font-manrope" > { impact } < / span >
< / li >
) ) }
< / ul >
< / div >
< div >
< h3 className = "text-xl font-semibold text-white mb-4 font-manrope" > Technical Performance < / h3 >
< ul className = "space-y-3" >
{ [
"Average AI recommendation response time: 180ms" ,
"Live stream latency: < 2 seconds" ,
"99.9% uptime in first 90 days"
] . map ( ( performance , index ) = > (
< li key = { index } className = "flex items-center gap-3" >
< Check className = "w-5 h-5 text-[#E5195E] flex-shrink-0" / >
< span className = "text-muted-foreground font-manrope" > { performance } < / span >
< / li >
) ) }
< / ul >
< / div >
< / div >
< / div >
< / div >
< / section >
{ /* Lessons Learned */ }
< section className = "py-16 bg-background" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-4xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-12 text-center font-manrope" > Lessons Learned & Best Practices < / h2 >
2026-03-27 11:13:52 +05:30
2025-09-01 18:16:11 +05:30
< div className = "grid md:grid-cols-2 gap-8" >
< Card className = "bg-card/50 border-white/10" >
< CardContent className = "p-6" >
< h3 className = "text-lg font-semibold text-white mb-4 font-manrope" > What Worked Well < / h3 >
< ul className = "space-y-2" >
{ [
"AI-first design approach improved engagement from day one" ,
"Early influencer partnerships boosted platform credibility"
] . map ( ( item , index ) = > (
< li key = { index } className = "flex items-center gap-3" >
< Check className = "w-4 h-4 text-[#E5195E] flex-shrink-0" / >
< span className = "text-muted-foreground font-manrope" > { item } < / span >
< / li >
) ) }
< / ul >
< / CardContent >
< / Card >
< Card className = "bg-card/50 border-white/10" >
< CardContent className = "p-6" >
< h3 className = "text-lg font-semibold text-white mb-4 font-manrope" > Key Learnings < / h3 >
< ul className = "space-y-2" >
{ [
"Live shopping events require extensive pre-launch testing" ,
"Merchant onboarding must include content quality training"
] . map ( ( item , index ) = > (
< li key = { index } className = "flex items-center gap-3" >
< TrendingUp className = "w-4 h-4 text-[#E5195E] flex-shrink-0" / >
< span className = "text-muted-foreground font-manrope" > { item } < / span >
< / li >
) ) }
< / ul >
< / CardContent >
< / Card >
< / div >
< / div >
< / div >
< / section >
{ /* Client Testimonial */ }
< section className = "py-16 bg-card/30" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-4xl mx-auto text-center" >
< div className = "flex justify-center mb-6" >
{ [ . . . Array ( 5 ) ] . map ( ( _ , i ) = > (
< Star key = { i } className = "w-6 h-6 text-[#E5195E] fill-current" / >
) ) }
< / div >
< blockquote className = "text-xl md:text-2xl text-white mb-6 font-manrope italic" >
"WDI understood the vision for Amoz perfectly — merging social and commerce in a seamless experience. The AI recommendations have been a game changer for engagement and sales."
< / blockquote >
< div className = "text-muted-foreground font-manrope" >
< div className = "font-semibold text-white" > Founders , Amoz < / div >
< div > Social Commerce Platform Client < / div >
< / div >
< / div >
< / div >
< / section >
{ /* Future Roadmap */ }
< section className = "py-16 bg-background" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-4xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-8 text-center font-manrope" > Future Roadmap < / h2 >
2026-03-27 11:13:52 +05:30
2025-09-01 18:16:11 +05:30
< div className = "grid md:grid-cols-2 gap-8" >
< Card className = "bg-card/50 border-white/10" >
< CardContent className = "p-6" >
< h3 className = "text-lg font-semibold text-white mb-4 font-manrope" > Next 6 Months < / h3 >
< ul className = "space-y-2" >
{ [
"AI-driven influencer matching for merchants" ,
"Multi-language support for broader market reach"
] . map ( ( feature , index ) = > (
< li key = { index } className = "flex items-center gap-3" >
< Clock className = "w-4 h-4 text-[#E5195E] flex-shrink-0" / >
< span className = "text-muted-foreground font-manrope" > { feature } < / span >
< / li >
) ) }
< / ul >
< / CardContent >
< / Card >
< Card className = "bg-card/50 border-white/10" >
< CardContent className = "p-6" >
< h3 className = "text-lg font-semibold text-white mb-4 font-manrope" > Next 12 Months < / h3 >
< ul className = "space-y-2" >
{ [
"Augmented reality (AR) product previews" ,
"Cross-border merchant onboarding and international payment integration"
] . map ( ( vision , index ) = > (
< li key = { index } className = "flex items-center gap-3" >
< Target className = "w-4 h-4 text-[#E5195E] flex-shrink-0" / >
< span className = "text-muted-foreground font-manrope" > { vision } < / span >
< / li >
) ) }
< / ul >
< / CardContent >
< / Card >
< / div >
< / div >
< / div >
< / section >
{ /* CTA Section */ }
< section className = "py-16 bg-gradient-to-r from-[#E5195E]/10 via-background to-[#E5195E]/10" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-4xl mx-auto text-center" >
< h2 className = "text-3xl md:text-4xl font-bold text-white mb-6 font-manrope" >
Ready to Build Your AI Commerce Platform ?
< / h2 >
< p className = "text-lg text-muted-foreground mb-8 font-manrope" >
Create innovative social commerce solutions that merge AI - powered recommendations with seamless shopping experiences for the next generation of consumers .
< / p >
< div className = "flex flex-col sm:flex-row gap-4 justify-center" >
2026-03-27 11:13:52 +05:30
< Button
2025-09-01 18:16:11 +05:30
size = "lg"
className = "bg-[#E5195E] hover:bg-[#E5195E]/90 text-white px-8 py-3 font-manrope"
2025-09-23 20:13:31 +05:30
onClick = { ( ) = > navigate ( '/start-a-project' ) }
2025-09-01 18:16:11 +05:30
>
Start Your Project
< ArrowRight className = "w-5 h-5 ml-2" / >
< / Button >
2026-03-27 11:13:52 +05:30
< Button
2025-09-01 18:16:11 +05:30
size = "lg"
variant = "outline"
className = "border-white/20 text-white hover:bg-white/10 px-8 py-3 font-manrope"
2025-09-23 20:13:31 +05:30
onClick = { ( ) = > navigate ( '/case-studies' ) }
2025-09-01 18:16:11 +05:30
>
View More Cases
< / Button >
< / div >
< / div >
< / div >
< / section >
2025-09-23 20:13:31 +05:30
{ /* <Footer /> */ }
2025-09-01 18:16:11 +05:30
< / div >
) ;
} ;
