diff --git a/assets/images/Tanami.webp b/assets/images/Tanami.webp new file mode 100644 index 0000000..ddfa556 Binary files /dev/null and b/assets/images/Tanami.webp differ diff --git a/assets/images/clutch-logo.png b/assets/images/clutch-logo.png new file mode 100644 index 0000000..994dbbb Binary files /dev/null and b/assets/images/clutch-logo.png differ diff --git a/assets/images/mobile-app-banner.webp b/assets/images/mobile-app-banner.webp new file mode 100644 index 0000000..52d4ad3 Binary files /dev/null and b/assets/images/mobile-app-banner.webp differ diff --git a/assets/images/ranoutof.webp b/assets/images/ranoutof.webp new file mode 100644 index 0000000..f88585b Binary files /dev/null and b/assets/images/ranoutof.webp differ diff --git a/assets/images/regroup.webp b/assets/images/regroup.webp new file mode 100644 index 0000000..8caebe3 Binary files /dev/null and b/assets/images/regroup.webp differ diff --git a/assets/images/sd.png b/assets/images/sd.png new file mode 100644 index 0000000..57e732f Binary files /dev/null and b/assets/images/sd.png differ diff --git a/assets/images/seezun.webp b/assets/images/seezun.webp new file mode 100644 index 0000000..9226702 Binary files /dev/null and b/assets/images/seezun.webp differ diff --git a/assets/images/woka.webp b/assets/images/woka.webp new file mode 100644 index 0000000..81f93bb Binary files /dev/null and b/assets/images/woka.webp differ diff --git a/components/CarouselTestimonials.tsx b/components/CarouselTestimonials.tsx index 3a448d1..f543c3c 100644 --- a/components/CarouselTestimonials.tsx +++ b/components/CarouselTestimonials.tsx @@ -1,291 +1,449 @@ -import React, { useState, useEffect, useRef } from "react"; -import { motion, AnimatePresence } from "framer-motion"; -import { ChevronLeft, ChevronRight } from "lucide-react"; -import { Card, CardContent } from "./ui/card"; -import { Button } from "./ui/button"; +import { motion, useAnimationControls } from "framer-motion"; import { Star } from "lucide-react"; import { ImageWithFallback } from "./figma/ImageWithFallback"; - -// High-quality Clutch logo placeholder -const clutchLogo = "https://images.unsplash.com/photo-1560472354-b33ff0c44a43?w=120&h=60&fit=crop&auto=format"; - +import clutchLogo from '../assets/images/clutch-logo.png'; +import { useState, useEffect, useRef } from "react"; +import React from "react"; const testimonials = [ { - id: 1, - name: "Sarah Chen", - position: "CTO", - company: "FinTech Innovations", - image: "https://images.unsplash.com/photo-1494790108755-2616b332c5cd?w=150&h=150&fit=crop&auto=format", + quote: "WDI brought SimpliTend to life with precision. A complex MVP, flawlessly executed and beautifully designed.", + author: "Sayeed Saachi", + title: "Founder, SimpliTend", rating: 5, - text: "WDI transformed our legacy banking system into a modern, scalable platform. Their expertise in financial technology is unmatched.", - projectType: "Banking Platform Modernization" + projectName: "SimpliTend", + projectLogo: "https://images.unsplash.com/photo-1559757148-5c350d0d3c56?w=60&h=60&fit=crop&auto=format" }, { - id: 2, - name: "Michael Rodriguez", - position: "Founder & CEO", - company: "HealthTech Solutions", - image: "https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=150&h=150&fit=crop&auto=format", + quote: "WDI turned a complex, multi-layered vision into a streamlined digital product. A highly capable and responsive team.", + author: "Aimee Zoho", + title: "Founder, Lean In World", rating: 5, - text: "The mobile health app WDI developed has revolutionized patient care delivery. Exceptional attention to healthcare compliance and user experience.", - projectType: "Healthcare Mobile App" + projectName: "Lean In World", + projectLogo: "https://images.unsplash.com/photo-1551434678-e076c223a692?w=60&h=60&fit=crop&auto=format" }, { - id: 3, - name: "Emily Watson", - position: "VP of Digital Strategy", - company: "RetailMax Corp", - image: "https://images.unsplash.com/photo-1580489944761-15a19d654956?w=150&h=150&fit=crop&auto=format", + quote: "WDI guided us from hybrid frustration to native transformation. Rock-solid delivery, scalable systems, and impressive uptime.", + author: "Akarsh K Hebbar", + title: "Founder, WOKA", rating: 5, - text: "Our e-commerce platform's performance improved by 300% after WDI's optimization. Their technical expertise is outstanding.", - projectType: "E-commerce Platform Enhancement" + projectName: "WOKA", + projectLogo: "https://images.unsplash.com/photo-1518186285589-2f7649de83e0?w=60&h=60&fit=crop&auto=format" }, { - id: 4, - name: "James Thompson", - position: "Chief Innovation Officer", - company: "EduTech Pioneers", - image: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=150&h=150&fit=crop&auto=format", + quote: "WDI executed our vision perfectly. The design, user flow, and admin controls are just what we needed.", + author: "Al Yusuf-Humaira", + title: "Founder, SSA", rating: 5, - text: "WDI's AI-powered learning platform has transformed how our students engage with content. Incredible innovation and execution.", - projectType: "AI-Powered EdTech Platform" + projectName: "SSA", + projectLogo: "https://images.unsplash.com/photo-1503676260728-1c00da094a0b?w=60&h=60&fit=crop&auto=format" }, { - id: 5, - name: "Lisa Park", - position: "Operations Director", - company: "LogiFlow Systems", - image: "https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=150&h=150&fit=crop&auto=format", + quote: "WDI delivered exactly what we needed—a scalable, secure, and smart RFQ engine.", + author: "Amol Kasar", + title: "Manager, Dorf Ketal", rating: 5, - text: "The supply chain management system WDI built has streamlined our operations and reduced costs by 40%. Highly recommended.", - projectType: "Supply Chain Management System" + projectName: "Dorf Ketal", + projectLogo: "https://images.unsplash.com/photo-1556742049-0cfed4f6a45d?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "WDI helped us modernize our digital presence quickly—professional, responsive, and pixel-perfect.", + author: "Anesh Kavle", + title: "Founder, Dayal Tours & Travel", + rating: 5, + projectName: "Dayal Tours & Travel", + projectLogo: "https://images.unsplash.com/photo-1571019613454-1cb2f99b2d8b?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "WDI delivered beyond expectations. Their speed, structure, and collaborative energy made this complex platform a reality.", + author: "Edward", + title: "Founder, ReGroup", + rating: 5, + projectName: "ReGroup", + projectLogo: "https://images.unsplash.com/photo-1611224923853-80b023f02d71?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "WDI translated a complex financial vision into a user-friendly app. Their execution was on point.", + author: "Faisal", + title: "Founder, Tanami Capital", + rating: 5, + projectName: "Tanami Capital", + projectLogo: "https://images.unsplash.com/photo-1590283603385-17ffb3a7f29f?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "WDI's CRM gave us an exhibition edge—OCR scanning changed the game.", + author: "Hiten Dedhia", + title: "Director, Exhibition CRM System", + rating: 5, + projectName: "Exhibition CRM System", + projectLogo: "https://images.unsplash.com/photo-1560472354-b33ff0c44a43?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "WDI made fintech frictionless. From onboarding to investment, it flows like a smart conversation.", + author: "Rakesh Bunathar", + title: "Founder, SuperMoney Advisor App", + rating: 5, + projectName: "SuperMoney Advisor App", + projectLogo: "https://images.unsplash.com/photo-1579621970563-ebec7560ff3e?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "WDI helped us turn complex property cycles into an intuitive digital experience.", + author: "Team Prosperty", + title: "Team, Prosperty Platform", + rating: 5, + projectName: "Prosperty Platform", + projectLogo: "https://images.unsplash.com/photo-1560518883-ce09059eeffa?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "WDI executed my multi-phase platform with confidence and clarity. They turned ideas into an integrated system faster than expected.", + author: "Mr. Oja Paul", + title: "Founder, Angel-Driven Marketplace Platform", + rating: 5, + projectName: "Angel-Driven Marketplace Platform", + projectLogo: "https://images.unsplash.com/photo-1611224923853-80b023f02d71?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "WDI helped bring Moving Cargo to life—from vision to delivery, the process was smooth and professional.", + author: "Mr Nicholas Shaak", + title: "Founder, Moving Cargo", + rating: 5, + projectName: "Moving Cargo", + projectLogo: "https://images.unsplash.com/photo-1586528116311-ad8dd3c8310d?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "WDI transformed our leadership vision into a smart, scalable platform our teams love.", + author: "KLC", + title: "Team, KLC Learning and Content Management Platform", + rating: 5, + projectName: "KLC Learning and Content Management Platform", + projectLogo: "https://images.unsplash.com/photo-1503676260728-1c00da094a0b?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "WDI delivered a full-stack health-tech solution with precision and transparency.", + author: "Priyank Mehta", + title: "Founder, GSF Mobie App", + rating: 5, + projectName: "GSF Mobie App", + projectLogo: "https://images.unsplash.com/photo-1559757148-5c350d0d3c56?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "WDI built more than an app—they engineered a habit-forming digital solution with beautiful UX and great scalability.", + author: "Rishabh Jain", + title: "Founder, Grocery List Mobile Application", + rating: 5, + projectName: "Grocery List Mobile Application", + projectLogo: "https://images.unsplash.com/photo-1556742049-0cfed4f6a45d?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "WDI built more than an app—they digitized our entire feed ecosystem.", + author: "Kevin", + title: "Founder, Farm Feeder App", + rating: 5, + projectName: "Farm Feeder App", + projectLogo: "https://images.unsplash.com/photo-1518186285589-2f7649de83e0?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "WDI didn't just deliver code—they delivered a digital transformation. Scalable, stable, and beautifully engineered.", + author: "Jay Ruparel", + title: "Founder, Melbourne City Card", + rating: 5, + projectName: "Melbourne City Card", + projectLogo: "https://images.unsplash.com/photo-1571019613454-1cb2f99b2d8b?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "WDI turned our idea into a highly usable mobile platform—sleek, stable, and scalable.", + author: "Shannon", + title: "Founder, Cheers to the Season Mobile App Redesign", + rating: 5, + projectName: "Cheers to the Season Mobile App Redesign", + projectLogo: "https://images.unsplash.com/photo-1580489944761-15a19d654956?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "WDI gave us a high-performance platform to blend financial learning with fun. Seamless and smart.", + author: "Ravi Sharma", + title: "Founder, Nifty Eleven Fantasy Trading App", + rating: 5, + projectName: "Nifty Eleven Fantasy Trading App", + projectLogo: "https://images.unsplash.com/photo-1579621970563-ebec7560ff3e?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "The new Amble App makes heritage immersive, intuitive, and scalable—exactly what we envisioned.", + author: "RPG Foundation", + title: "Team, Amble App - New Version", + rating: 5, + projectName: "Amble App - New Version", + projectLogo: "https://images.unsplash.com/photo-1611224923853-80b023f02d71?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "WDI delivered a deeply integrated, future-ready system that cut our admin overheads drastically.", + author: "Ravi Bajaj", + title: "Manager, Travel Portal Module Addition to ZingHR System", + rating: 5, + projectName: "Travel Portal Module Addition to ZingHR System", + projectLogo: "https://images.unsplash.com/photo-1586528116311-ad8dd3c8310d?w=60&h=60&fit=crop&auto=format" + }, + { + quote: "WDI executed my multi-phase platform with confidence and clarity. They turned ideas into an integrated system faster than expected.", + author: "Matt Weightman", + title: "Founder, MOT & Vehicle Management Portal", + rating: 5, + projectName: "MOT & Vehicle Management Portal", + projectLogo: "https://images.unsplash.com/photo-1560472354-b33ff0c44a43?w=60&h=60&fit=crop&auto=format" } ]; -export const CarouselTestimonials = () => { - const [currentIndex, setCurrentIndex] = useState(0); - const [isAutoPlaying, setIsAutoPlaying] = useState(true); - const intervalRef = useRef(null); +// Star rating component +const StarRating = ({ rating }: { rating: number }) => { + return ( +
+ {Array.from({ length: 5 }).map((_, i) => ( + + ))} +
+ ); +}; - // Auto-play functionality - useEffect(() => { - if (isAutoPlaying) { - intervalRef.current = setInterval(() => { - setCurrentIndex((prevIndex) => - prevIndex === testimonials.length - 1 ? 0 : prevIndex + 1 - ); - }, 5000); +// Individual testimonial card +const TestimonialCard = ({ + testimonial, + onHover, + onLeave +}: { + testimonial: typeof testimonials[0]; + onHover?: () => void; + onLeave?: () => void; +}) => { + return ( +
+ {/* Project Header - Image removed, text-only project name */} +
+
+ + {testimonial.projectName} + +
+ +
+ + {/* Quote */} +

+ "{testimonial.quote}" +

+ + {/* Author Info - Without Avatar */} +
+
+ {testimonial.author} +
+
+ {testimonial.title} +
+
+
+ ); +}; + +// Single marquee component +const MarqueeRow = ({ testimonials: rowTestimonials }: { testimonials: typeof testimonials }) => { + const [isPaused, setIsPaused] = useState(false); + const controls = useAnimationControls(); + const currentPositionRef = useRef(0); + const animationRef = useRef(null); + const startTimeRef = useRef(0); + const pauseTimeRef = useRef(0); + + const ANIMATION_DURATION = 60; // seconds + const TOTAL_DISTANCE = -100 * rowTestimonials.length; // total distance to travel + + const startAnimation = async (fromPosition: number = 0) => { + const remainingDistance = TOTAL_DISTANCE - fromPosition; + const remainingDuration = (Math.abs(remainingDistance) / Math.abs(TOTAL_DISTANCE)) * ANIMATION_DURATION; + + startTimeRef.current = Date.now(); + + try { + await controls.start({ + x: [fromPosition, TOTAL_DISTANCE], + transition: { + duration: remainingDuration, + ease: "linear", + repeat: Infinity, + repeatType: "loop", + repeatDelay: 0, + } + }); + } catch (error) { + // Animation was interrupted (paused) } + }; + const pauseAnimation = () => { + controls.stop(); + pauseTimeRef.current = Date.now(); + + // Calculate current position based on elapsed time + const elapsedTime = (pauseTimeRef.current - startTimeRef.current) / 1000; + const progress = (elapsedTime % ANIMATION_DURATION) / ANIMATION_DURATION; + currentPositionRef.current = TOTAL_DISTANCE * progress; + }; + + const resumeAnimation = () => { + startAnimation(currentPositionRef.current); + }; + + // Start initial animation + useEffect(() => { + startAnimation(); return () => { - if (intervalRef.current) { - clearInterval(intervalRef.current); - } + controls.stop(); }; - }, [isAutoPlaying]); + }, []); - const goToPrevious = () => { - setIsAutoPlaying(false); - setCurrentIndex(currentIndex === 0 ? testimonials.length - 1 : currentIndex - 1); - }; - - const goToNext = () => { - setIsAutoPlaying(false); - setCurrentIndex(currentIndex === testimonials.length - 1 ? 0 : currentIndex + 1); - }; - - const goToSlide = (index: number) => { - setIsAutoPlaying(false); - setCurrentIndex(index); - }; - - // Resume auto-play after user interaction + // Handle pause/resume useEffect(() => { - if (!isAutoPlaying) { - const resumeTimer = setTimeout(() => { - setIsAutoPlaying(true); - }, 10000); // Resume after 10 seconds - - return () => clearTimeout(resumeTimer); + if (isPaused) { + pauseAnimation(); + } else { + resumeAnimation(); } - }, [isAutoPlaying]); + }, [isPaused]); + + const handleCardHover = () => { + setIsPaused(true); + }; + + const handleCardLeave = () => { + setIsPaused(false); + }; return ( -
-
- -

- What Our Clients Say -

-

- Hear from industry leaders who have transformed their businesses with our innovative solutions. -

- +
+ + {/* First set */} + {rowTestimonials.map((testimonial, index) => ( + + ))} + {/* Duplicate set for seamless loop */} + {rowTestimonials.map((testimonial, index) => ( + + ))} + +
+ ); +}; -
- {/* Main Testimonial Display */} -
- - - - -
- {/* Client Photo and Info */} -
-
-
- -
- {/* Rating Stars */} -
- {[...Array(testimonials[currentIndex].rating)].map((_, i) => ( - - ))} -
-
- -
-

- {testimonials[currentIndex].name} -

-

- {testimonials[currentIndex].position} -

-

- {testimonials[currentIndex].company} -

-
- - {testimonials[currentIndex].projectType} - -
-
-
- - {/* Testimonial Content */} -
-
- {/* Quote Icon */} -
"
- -
- {testimonials[currentIndex].text} -
- - {/* Clutch Logo */} -
-
- Verified Review on -
- -
-
-
-
- - - - -
- - {/* Navigation Controls */} -
- {/* Previous Button */} - - - {/* Dots Indicator */} -
- {testimonials.map((_, index) => ( -
- - {/* Next Button */} - -
- - {/* Auto-play Indicator */} -
- -
+// Clutch rating component +const ClutchRating = () => { + return ( + + {/* Clutch Logo */} +
+ +
+ + {/* Rating Info */} +
+
+ 4.9 +
+
+ (47 reviews) +
+
+ Top Web Development Company on Clutch +
+
+ + ); +}; - {/* Additional Social Proof */} - -
-
-
98%
-
Client Satisfaction
-
-
-
150+
-
Projects Delivered
-
-
-
5.0
-
Average Rating
-
-
-
24/7
-
Support Available
-
-
- +export const CarouselTestimonials = () => { + return ( +
+
+ {/* Centered Header */} +
+ + What Our Clients Say + + + Don't just take our word for it. Here's what founders and product leaders say about working with us. + +
+ + {/* Single Row Marquee Testimonials */} +
+ + + +
+ + {/* Centered Clutch Rating */} +
+ +
); diff --git a/components/CaseStudyHighlight.tsx b/components/CaseStudyHighlight.tsx index 57d0996..0cca9f7 100644 --- a/components/CaseStudyHighlight.tsx +++ b/components/CaseStudyHighlight.tsx @@ -1,272 +1,232 @@ -import React from "react"; import { motion } from "framer-motion"; -import { Card, CardContent } from "./ui/card"; +import { ArrowRight, ExternalLink } from "lucide-react"; import { Button } from "./ui/button"; -import { Badge } from "./ui/badge"; -import { ArrowRight, ExternalLink, TrendingUp, Users, Clock, Star } from "lucide-react"; +import { GridPattern } from "./GridPattern"; import { ImageWithFallback } from "./figma/ImageWithFallback"; import { navigateTo } from "../App"; +import regroupImage from '../assets/images/regroup.webp'; +import seezunImage from '../assets/images/seezun.webp'; +// import wokaImage from '../assets/images/woka.webp'; +import wokaAwardImage from '../assets/images/woka.webp'; +import tanamiImage from '../assets/images/tanami.webp'; -// High-quality project images -const regroupImage = "https://images.unsplash.com/photo-1551650975-87deedd944c3?w=600&h=400&fit=crop&auto=format"; -const seezunImage = "https://images.unsplash.com/photo-1512941937669-90a1b58e7e9c?w=600&h=400&fit=crop&auto=format"; -const wokaAwardImage = "https://images.unsplash.com/photo-1517077304055-6e89abbf09b0?w=600&h=400&fit=crop&auto=format"; +const featuredCaseStudy = { + title: "Woka", + description: "Developed Woka as a vibrant platform where learning meets play. With a safe and fun environment to explore, learn, and grow effortlessly.", + achievement: "+300% User Retention", + industryTags: ["Education", "Learning Platform"], + image: wokaAwardImage, + metrics: [ + { label: "Active Users", value: "500K+" }, + { label: "User Retention", value: "+300%" }, + { label: "Learning Hours", value: "+180%" } + ] +}; const caseStudies = [ { - id: 1, - title: "Regroup", - subtitle: "Social Networking Revolution", - description: "A comprehensive social platform that connects communities worldwide with advanced messaging, group management, and content sharing capabilities.", - image: regroupImage, - category: "Social Platform", - client: "Regroup Technologies", - duration: "8 months", - teamSize: "12 developers", - technologies: ["React Native", "Node.js", "MongoDB", "WebRTC", "AWS"], - results: [ - { metric: "User Engagement", value: "+240%" }, - { metric: "Active Communities", value: "50K+" }, - { metric: "Daily Messages", value: "2.5M+" } - ], - awards: ["Best Social App 2023", "Innovation Award"], - link: "/projects/regroup", - featured: true - }, - { - id: 2, title: "Seezun", - subtitle: "Next-Gen E-commerce Platform", - description: "Revolutionary e-commerce solution with AI-powered recommendations, seamless checkout, and integrated inventory management for modern retailers.", - image: seezunImage, - category: "E-commerce", - client: "Seezun Retail", - duration: "6 months", - teamSize: "8 developers", - technologies: ["React", "Python", "PostgreSQL", "Redis", "Stripe"], - results: [ - { metric: "Conversion Rate", value: "+180%" }, - { metric: "Page Load Speed", value: "2.1s" }, - { metric: "Customer Satisfaction", value: "4.9/5" } - ], - awards: ["E-commerce Excellence Award"], - link: "/projects/seezun", - featured: true + description: "Created Seezun as a dynamic customer-driven platform connecting buyers, sellers, and renters for a seamless marketplace that renders fashion accessible, sustainable, and affordable.", + achievement: "+85% Brand Recognition", + industryTags: ["Branding", "Fashion"], + image: seezunImage }, { - id: 3, - title: "Woka", - subtitle: "Award-Winning Fitness App", - description: "Comprehensive fitness and wellness platform with personalized workout plans, nutrition tracking, and community features that won multiple industry awards.", - image: wokaAwardImage, - category: "Health & Fitness", - client: "Woka Wellness", - duration: "10 months", - teamSize: "15 developers", - technologies: ["Flutter", "Firebase", "TensorFlow", "Apple HealthKit", "Google Fit"], - results: [ - { metric: "User Retention", value: "+320%" }, - { metric: "Workout Completions", value: "1M+" }, - { metric: "App Store Rating", value: "4.8/5" } - ], - awards: ["App of the Year 2023", "Health Innovation Award", "User Choice Award"], - link: "/projects/woka", - featured: true + title: "Regroup", + description: "Built Regroup as a social platform that brings together passion, global connections, teamwork, and love for sports through a vibrant online community.", + achievement: "+150% User Engagement", + industryTags: ["Social Media", "Digital Products"], + image: regroupImage + }, + { + title: "Tanami", + description: "Revolutionized Tanami Capital into a powerful, intuitive platform that streamlines portfolio management and empowers users to grow their wealth effortlessly.", + achievement: "+200% Portfolio Growth", + industryTags: ["FinTech", "Wealth Management"], + image: tanamiImage } ]; +const SmallCaseStudyCard = ({ study, index }: { study: typeof caseStudies[0]; index: number }) => { + const getNavigationPath = (title: string) => { + switch (title) { + case 'Seezun': + return '/projects/seezun'; + case 'Woka': + return '/projects/woka'; + case 'Tanami': + return '/projects/tanami'; + case 'Regroup': + return '/projects/regroup'; + default: + return '/case-studies'; + } + }; + + return ( + navigateTo(getNavigationPath(study.title))} + > +
+ +
+ + {study.achievement} + +
+
+ +
+

+ {study.title} +

+

+ {study.description} +

+ +
+ {study.industryTags.map((tag) => ( + + {tag} + + ))} +
+ + +
+ + ); +}; + export const CaseStudyHighlight = () => { return ( -
-
- {/* Section Header */} +
+ + +
- - Featured Work - -

- Success Stories That Define Excellence +

+ See What We've Built

-

- Explore our award-winning projects that have transformed businesses and delighted millions of users worldwide. +

+ Real results from real projects. Here's how we've helped companies scale their digital products.

- - {/* Featured Case Studies Grid */} -
+ + navigateTo('/projects/woka')} + > +
+
+ +
+ + {featuredCaseStudy.achievement} + +
+
+ +
+

+ {featuredCaseStudy.title} +

+

+ {featuredCaseStudy.description} +

+ +
+ {featuredCaseStudy.metrics.map((metric) => ( +
+ {metric.label} + {metric.value} +
+ ))} +
+ +
+ {featuredCaseStudy.industryTags.map((tag) => ( + + {tag} + + ))} +
+ + +
+
+ + +
{caseStudies.map((study, index) => ( - navigateTo(study.link)} - > - - - {/* Image Header */} -
- -
- - {/* Category Badge */} -
- - {study.category} - -
- - {/* Awards */} - {study.awards.length > 0 && ( -
-
- - Award Winner -
-
- )} - - {/* Project Title Overlay */} -
-

- {study.title} -

-

- {study.subtitle} -

-
-
- - {/* Content */} -
-

- {study.description} -

- - {/* Key Metrics */} -
- {study.results.slice(0, 3).map((result, idx) => ( -
-
- {result.value} -
-
- {result.metric} -
-
- ))} -
- - {/* Technologies */} -
-

Technologies:

-
- {study.technologies.slice(0, 3).map((tech) => ( - - {tech} - - ))} - {study.technologies.length > 3 && ( - - +{study.technologies.length - 3} more - - )} -
-
- - {/* Project Details */} -
-
- - {study.duration} -
-
- - {study.teamSize} -
-
- - {/* Awards List */} - {study.awards.length > 0 && ( -
-

Awards:

-
- {study.awards.slice(0, 2).map((award, idx) => ( -
- - {award} -
- ))} -
-
- )} - - {/* CTA Button */} - -
- - - + ))}
- - {/* Call-to-Action */} + -
-

- Ready to Create Your Success Story? -

-

- Join the ranks of industry leaders who have transformed their businesses with our innovative solutions. -

-
- - -
-
+
diff --git a/components/HeroSection.tsx b/components/HeroSection.tsx index 07c6448..aa5900c 100644 --- a/components/HeroSection.tsx +++ b/components/HeroSection.tsx @@ -1,8 +1,8 @@ import { Button } from "./ui/button"; import { GridPattern } from "./GridPattern"; -import { SplineFallback } from "./SplineFallback"; import { Calendar, Briefcase } from "lucide-react"; import { navigateTo } from "../App"; +import { motion } from "framer-motion"; export function HeroSection() { return ( @@ -11,9 +11,20 @@ export function HeroSection() {
-
+ {/* Left Content */} + {/* Animated Badge */} -
+ -
+ -

- Architecting Digital Success for Startups & Enterprises -

+ + Architecting Digital Success for Startups & Enterprises + -

+ We design and build secure, AI-powered apps and software tailored for scale, speed, and user engagement. -

+ -
+ -
-
+ + -
- {/* Animated Background Elements */} -
-
-
-
-
- - {/* Interactive 3D-like Animation */} -
-
-
- + {/* Right Side - Animated Gradient Background */} + +
+ {/* Animated gradient background */} +
+ + {/* Floating orbs */} +
+ + +
+ + {/* Tech grid overlay */} +
+
+
+ + {/* Central focus point */} +
+ +
+ + {/* Subtle border */} +
-
+
- {/* Floating Elements */} -
+ {/* Floating scroll indicator */} + -
+
); diff --git a/global.d.ts b/global.d.ts new file mode 100644 index 0000000..f7f59ba --- /dev/null +++ b/global.d.ts @@ -0,0 +1,29 @@ +declare module '*.webp' { + const src: string; + export default src; +} + +declare module '*.png' { + const src: string; + export default src; +} + +declare module '*.jpg' { + const src: string; + export default src; +} + +declare module '*.jpeg' { + const src: string; + export default src; +} + +declare module '*.svg' { + const src: string; + export default src; +} + +declare module '*.gif' { + const src: string; + export default src; +} diff --git a/pages/MobileAppDevelopment.tsx b/pages/MobileAppDevelopment.tsx index 016b6d5..883a92a 100644 --- a/pages/MobileAppDevelopment.tsx +++ b/pages/MobileAppDevelopment.tsx @@ -1,16 +1,15 @@ import { motion } from "framer-motion"; import { Apple, - ArrowRight, Award, Bolt, BookOpen, - Brush, - Bug, - Database, + Brain, + Building, + Calendar, DollarSign, Eye, - Layers, + Globe, Layers, Play, Rocket, Settings, @@ -19,38 +18,35 @@ import { ShoppingCart, Smartphone, Stethoscope, - Tablet, Truck, - Tv, UserPlus, Watch, - Wifi, Zap } from "lucide-react"; +import React from "react"; import { navigateTo } from "../App"; import { FAQSection } from "../components/FAQSection"; import { Footer } from "../components/Footer"; import { Navigation } from "../components/Navigation"; import { ProcessSection } from "../components/ProcessSection"; -import { ImageWithFallback } from "../components/figma/ImageWithFallback"; import { Badge } from "../components/ui/badge"; import { Button } from "../components/ui/button"; import { Card, CardContent } from "../components/ui/card"; import { ShimmerButton } from "../components/ui/shimmer-button"; -import Group1597880681 from "../assets/Group1597880681"; -import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "@/components/ui/accordion"; +import heroMockupImage from '../assets/images/mobile-app-banner.webp'; -// Enhanced Hero Section with compact mockup and integrated stats + +// Enhanced Hero Section - NEW IMAGE WITH COMPREHENSIVE CSS REQUIREMENTS const HeroWithCTA = () => { return (
-
-
+
+
{/* Mobile App Development Label */} { animate={{ opacity: 1, y: 0 }} transition={{ duration: 0.6 }} > - Mobile App Development +
+ + Mobile App Development +
- {/* Main Heading - Updated Content */} -
-

- Expert Mobile App Development Services + {/* Main Heading */} + +

+ Expert + Mobile App Development + Services

Build secure, scalable, high-performance apps for iOS, Android, or cross-platform — fast.

-

+ + + {/* BULLET POINTS REMOVED - Content flows directly to CTAs */} - {/* Updated CTAs - Using provided code structure */} + {/* CTAs - STANDARDIZED BUTTON HEIGHTS WITH IMPROVED SPACING */} - navigateTo('/contact')}> + navigateTo('/start-a-project')} + >
- - - + Book a Discovery Call
- {/* Right side with compact phone mockups and integrated stats */} + {/* Right side with hero image - COMPREHENSIVE CSS IMPLEMENTATION */} - {/* Compact Phone Mockups with Integrated Stats Layout */} -
- {/* Phone Mockups Component - Reduced Size */} - - - + {/* Image Container - FOLLOWING ALL COMPREHENSIVE CSS REQUIREMENTS */} +
+ {/* Hero Image with comprehensive CSS styling */} + Mobile App Development Services - Fashion, Social, and Fitness Apps - {/* Integrated Statistics - Positioned to align with phones */} - - {/* Left Phone Stats */} -
-
75+
-
App Developed
-
- - {/* Center Phone Stats */} -
-
25+
-
App Deployed
-
- - {/* Right Phone Stats */} -
-
3M+
-
App downloads
-
- + {/* Alternative background method for enhanced browser support */} +
@@ -383,37 +387,43 @@ const TabbedServiceDisplay = () => { { title: "iOS App Development", icon: Smartphone, - description: "Transforming Concepts Into Captivating Mobile Experiences With Our Expert App Developments Service" + description: "Native iOS applications built with Swift and optimized for App Store success.", + link: "/services/ios-app-development" }, { title: "Android App Development", icon: Smartphone, - description: "Transforming Concepts Into Captivating Mobile Experiences With Our Expert App Developments Service" + description: "High-performance Android apps using Kotlin with Google Play optimization.", + link: "/services/android-app-development" + }, + { + title: "Cross-Platform Development", + icon: Layers, + description: "Efficient cross-platform solutions using React Native and Flutter.", + link: "/services/cross-platform-app-development" }, { title: "Wearable App Development", icon: Watch, - description: "Transforming Concepts Into Captivating Mobile Experiences With Our Expert App Developments Service" + description: "Smart watch and wearable device applications for health and fitness.", + link: "/services/wearable-device-development" }, { - title: "Tablet", - icon: Tablet, - description: "Transforming Concepts Into Captivating Mobile Experiences With Our Expert App Developments Service" + title: "Progressive Web Apps", + icon: Globe, + description: "Web applications that work like native mobile apps across all devices.", + link: "/services/pwa-development" }, { - title: "TV", - icon: Tv, - description: "Transforming Concepts Into Captivating Mobile Experiences With Our Expert App Developments Service" - }, - { - title: "IoT", - icon: Database, - description: "Transforming Concepts Into Captivating Mobile Experiences With Our Expert App Developments Service" + title: "Enterprise Mobile Solutions", + icon: Building, + description: "Secure, scalable mobile solutions for enterprise business needs.", + link: "/services/enterprise-software-solutions" } ]; return ( -
+
{ className="text-center mb-20" >

- Innovating Mobility, Empowering Connectivity + Mobile App Development Services

- Where creativity meets technology! We are a leading app development company committed to transforming your ideas into powerful, user-friendly, and cutting-edge mobile applications. + Comprehensive mobile development services that transform your ideas into powerful, user-friendly applications across all platforms.

@@ -447,7 +457,8 @@ const TabbedServiceDisplay = () => { transition={{ duration: 0.5, delay: index * 0.1 }} viewport={{ once: true }} whileHover={{ y: -5 }} - className="group" + className="group cursor-pointer" + onClick={() => navigateTo(service.link)} >
@@ -477,14 +488,8 @@ const TabbedServiceDisplay = () => { // Updated CTA Banner with ShimmerButton const InlineCTA = () => { return ( -
- {/* Add subtle decorative elements matching site theme */} -
-
-
-
-
-
+
+
{ viewport={{ once: true }} className="space-y-8" > - {/* Badge with black background and gradient border */} -
-
- - AI-Driven Innovation + {/* Ready to Launch Badge */} +
+
+
+ + AI-Driven Innovation +
{/* Main Heading */} -

- Let's Architect{" "} - Intelligence{" "} - Into Your App +

+ Let's Architect + Intelligence + Into Your App

{/* Subtitle */} @@ -519,15 +526,23 @@ const InlineCTA = () => { Schedule a discovery call to explore how AI can give you a strategic edge.

- {/* Updated CTA Button with ShimmerButton */} - navigateTo('/contact')}> -
- - - - Book an AI Discovery Call -
- + {/* CTA Button */} +
+ navigateTo('/start-a-project')} + > +
+ + Book an AI Discovery Call +
+ + + {/* Small benefit text */} +

+ App strategy • AI integration • Technology consultation +

+
@@ -539,39 +554,36 @@ const InlineCTA = () => { const HireDevelopersSection = () => { const developers = [ { - title: "Hire iOS Developers", + title: "iOS Developers", icon: Apple, - skills: ["Swift", "Objective-C"], + skills: ["Swift", "Objective-C", "SwiftUI", "Core Data"], iconBg: "bg-gray-800", - iconColor: "text-white" + iconColor: "text-white", + link: "/hire-talent/mobile-app-developers" }, { - title: "Hire Android Developers", + title: "Android Developers", icon: Smartphone, - skills: ["Kotlin", "Java"], + skills: ["Kotlin", "Java", "Jetpack Compose"], iconBg: "bg-green-500", - iconColor: "text-white" + iconColor: "text-white", + link: "/hire-talent/mobile-app-developers" }, { - title: "Hire Flutter / React Native Developers", + title: "Cross-Platform Developers", icon: Layers, - skills: ["Flutter", "React Native"], + skills: ["React Native", "Flutter", "Xamarin"], iconBg: "bg-blue-500", - iconColor: "text-white" + iconColor: "text-white", + link: "/hire-talent/mobile-app-developers" }, { - title: "Hire Mobile QA Testers", - icon: Bug, - skills: ["Mobile Testing", "Automation"], - iconBg: "bg-red-500", - iconColor: "text-white" - }, - { - title: "Hire UI/UX Designers", - icon: Brush, - skills: ["Mobile-first", "User Experience"], + title: "Mobile QA Engineers", + icon: ShieldCheck, + skills: ["Mobile Testing", "Automation", "Performance"], iconBg: "bg-purple-500", - iconColor: "text-white" + iconColor: "text-white", + link: "/hire-talent/qa-engineers" } ]; @@ -585,8 +597,9 @@ const HireDevelopersSection = () => { viewport={{ once: true }} className="text-center mb-20" > -

- Need Talent? Hire Our Top App Developers +

+ Hire Our + Mobile App Experts

Get access to top-tier mobile developers who can bring your vision to life with cutting-edge technology and proven expertise. @@ -645,21 +658,15 @@ const HireDevelopersSection = () => { {/* CTA Buttons - Updated with ShimmerButton */}

- navigateTo('/contact')}> + navigateTo(developer.link)} + >
- - - - Start Hiring + + Hire Now
-
@@ -672,378 +679,84 @@ const HireDevelopersSection = () => { ); }; -// Enhanced Case Study Highlight - Updated to match reference design -const CaseStudyHighlight = () => { - const projects = [ - { - title: "Automated management of IoT networks", - brand: "RAK", - icon: Wifi, - description: "Comprehensive IoT device management and monitoring platform", - image: "https://images.unsplash.com/photo-1558494949-ef010cbdcc31?w=400&h=300&fit=crop&auto=format", - bgGradient: "from-blue-500/20 to-cyan-500/20" - }, - { - title: "HIPAA-compliant app for healthcare digitization", - brand: "HealthVue", - icon: Stethoscope, - description: "Secure healthcare management system with patient data protection", - image: "https://images.unsplash.com/photo-1576091160399-112ba8d25d1f?w=400&h=300&fit=crop&auto=format", - bgGradient: "from-green-500/20 to-emerald-500/20" - }, - { - title: "SaaS transportation management system", - brand: "FleetOps", - icon: Truck, - description: "Advanced fleet tracking and logistics optimization platform", - image: "https://images.unsplash.com/photo-1586953208448-b95a79798f07?w=400&h=300&fit=crop&auto=format", - bgGradient: "from-orange-500/20 to-yellow-500/20" - }, - { - title: "Industry-agnostic cybersecurity system", - brand: "SecureNet", - icon: Shield, - description: "Enterprise-grade security monitoring and threat detection", - image: "https://images.unsplash.com/photo-1563013544-824ae1b704d3?w=400&h=300&fit=crop&auto=format", - bgGradient: "from-purple-500/20 to-indigo-500/20" - } - ]; - - return ( -
-
- -

- See What We've Built -

-

- From IoT platforms to healthcare systems, our solutions drive real business impact across industries. -

- - - - {projects.map((project, index) => { - const IconComponent = project.icon; - return ( - - - - {/* Header with title and brand */} -
-
-
- -
-
-
- {project.brand} -
-
-
- -

- {project.title} -

-
- - {/* App screenshot/mockup */} -
-
- -
-
- - {/* CTA Button - Keep as secondary action */} -
- -
- - - - ); - })} - -
-
- ); -}; - -// Tech Marquee Component -const TechMarquee = () => { - const logos = [ - "Swift", "Kotlin", "Flutter", "React Native", "Firebase", - "AWS", "PostgreSQL", "GraphQL", "Jest", "Figma" - ]; - - const techImages = [ - "https://images.unsplash.com/photo-1621839673705-6617adf9e890?w=80&h=80&fit=crop&auto=format", - "https://images.unsplash.com/photo-1607706189992-eae578626c86?w=80&h=80&fit=crop&auto=format", - "https://images.unsplash.com/photo-1611224923853-80b023f02d71?w=80&h=80&fit=crop&auto=format", - "https://images.unsplash.com/photo-1633356122544-f134324a6cee?w=80&h=80&fit=crop&auto=format", - "https://images.unsplash.com/photo-1618477388954-7852f32655ec?w=80&h=80&fit=crop&auto=format", - "https://images.unsplash.com/photo-1606868306217-dbf5046868d2?w=80&h=80&fit=crop&auto=format", - "https://images.unsplash.com/photo-1544383835-bda2bc66a55d?w=80&h=80&fit=crop&auto=format", - "https://images.unsplash.com/photo-1627398242454-45a1465c2479?w=80&h=80&fit=crop&auto=format", - "https://images.unsplash.com/photo-1609921212029-bb5a28e60960?w=80&h=80&fit=crop&auto=format", - "https://images.unsplash.com/photo-1609921212029-bb5a28e60960?w=80&h=80&fit=crop&auto=format" - ]; - - return ( -
-
- -

- Tools & Tech We Use Daily -

- - -
-
- {logos.concat(logos).map((logo, index) => ( - -
- -
-

- {logo} -

- - ))} -
-
-
-
- ); -}; - -// Enhanced FAQ Accordion -const AccordionFAQs = () => { - const items = [ - { - question: "Do you help with app store publishing?", - answer: "Yes. We help you publish, optimize, and comply with Apple & Google guidelines." - }, - { - question: "Can you build MVPs quickly?", - answer: "Absolutely. Most MVPs are shipped in 4–6 weeks using cross-platform stacks." - }, - { - question: "How do you handle security?", - answer: "From secure APIs to encrypted storage, our apps are built with enterprise-grade security in mind." - } - ]; - - return ( -
-
- - - {items.map((item, index) => ( - - - {item.question} - - - {item.answer} - - - ))} - - -
-
- ); -}; - -// Updated Large Call to Action with ShimmerButton -const LargeCallToAction = () => { - return ( -
-
- - {/* Badge with black background and gradient border */} - -
-
- - Ready to Launch Your App? -
-
- - - {/* Main Heading */} - - Build Your Next Mobile App with{" "} - WDI - - - {/* Subtitle */} - - Join the companies who trust us to bring their app ideas to life with cutting-edge technology and expert craftsmanship. - - - {/* CTA Section - Updated with ShimmerButton */} - - {/* Main CTA Button with ShimmerButton */} - navigateTo('/contact')}> -
- - - - Get Started -
- - - {/* Secondary CTA */} -

- Free consultation • No commitment • Quick turnaround -

- - -
- - {/* Background Decorative Elements */} -
- {/* Subtle gradient orbs */} -
-
-
-
-
- ); -}; - -// Main Mobile App Development Page // FAQ data for Mobile App Development const mobileAppFAQs = [ { - question: "What platforms do you develop mobile apps for?", - answer: "We develop mobile apps for iOS, Android, and cross-platform solutions using technologies like React Native and Flutter. Our team has expertise in native development as well as hybrid approaches to ensure optimal performance and user experience." + question: "Do you develop both iOS and Android apps?", + answer: "Yes, we develop native iOS apps using Swift and Android apps using Kotlin. We also offer cross-platform solutions using React Native and Flutter for cost-effective multi-platform deployment." }, { - question: "How long does it take to develop a mobile app?", - answer: "The development timeline varies based on app complexity, features, and platform requirements. Simple apps typically take 8-12 weeks, while complex enterprise applications can take 4-6 months. We provide detailed project timelines during the planning phase." + question: "What is the typical timeline for mobile app development?", + answer: "Timeline varies based on complexity. Simple apps take 8-12 weeks, while complex enterprise apps can take 16-24 weeks. We provide detailed project timelines after requirements analysis." }, { - question: "Do you provide app store submission and approval support?", - answer: "Yes, we handle the complete app store submission process for both Apple App Store and Google Play Store. Our team ensures your app meets all guidelines and requirements, and we provide ongoing support for app updates and maintenance." + question: "How much does mobile app development cost?", + answer: "Costs depend on features, platforms, and complexity. We offer competitive pricing with transparent estimates. Contact us for a detailed quote based on your specific requirements." }, { - question: "Can you integrate AI and machine learning features into mobile apps?", - answer: "Absolutely! We specialize in integrating AI and ML capabilities including chatbots, recommendation engines, image recognition, natural language processing, and predictive analytics to enhance user engagement and app functionality." + question: "Do you help with App Store submissions?", + answer: "Yes, we handle the complete App Store submission process for both Apple App Store and Google Play Store, including app optimization, compliance, and approval assistance." }, { - question: "What is your approach to mobile app security?", - answer: "We implement comprehensive security measures including data encryption, secure API connections, authentication systems, and compliance with industry standards like GDPR and HIPAA. Security is built into every layer of our development process." + question: "Can you integrate third-party services and APIs?", + answer: "Absolutely! We integrate various third-party services including payment gateways, social media, analytics, push notifications, maps, and custom APIs to enhance app functionality." + }, + { + question: "Do you provide app maintenance and updates?", + answer: "Yes, we offer comprehensive maintenance services including bug fixes, OS updates, security patches, feature enhancements, and performance optimization to keep your app current." + }, + { + question: "What about app security and data protection?", + answer: "We implement robust security measures including data encryption, secure API communication, user authentication, and compliance with privacy regulations like GDPR and CCPA." + }, + { + question: "Can you develop offline-capable mobile apps?", + answer: "Yes, we can develop apps with offline functionality using local storage, caching strategies, and data synchronization to ensure your app works even without internet connectivity." } ]; -export function MobileAppDevelopment() { +// Main Mobile App Development Page Component +export const MobileAppDevelopment = () => { + // Set document title for SEO + React.useEffect(() => { + document.title = "Mobile App Development Services | WDI - iOS & Android App Development"; + + // Update meta description for SEO + const metaDescription = document.querySelector('meta[name="description"]'); + if (metaDescription) { + metaDescription.setAttribute('content', 'Professional mobile app development services at WDI. Build secure, scalable iOS and Android apps with expert developers. Cross-platform solutions available.'); + } + }, []); + return (
+ + {/* Hero Section */} - + + {/* Industries Scroller */} + + + {/* Why Choose WDI */} + + {/* Service Categories */} + + {/* Process Steps */} - + + {/* Hire Developers */} - + + {/* Final CTA */} + + + {/* FAQ Section */} + +
); -} \ No newline at end of file +}; \ No newline at end of file diff --git a/pages/iOSAppDevelopment.tsx b/pages/iOSAppDevelopment.tsx index 48186ee..b4704b4 100644 --- a/pages/iOSAppDevelopment.tsx +++ b/pages/iOSAppDevelopment.tsx @@ -5,26 +5,49 @@ import { Navigation } from "../components/Navigation"; import { Badge } from "../components/ui/badge"; import { Card, CardContent } from "../components/ui/card"; import { ShimmerButton } from "../components/ui/shimmer-button"; +import ranoutofImage from "../assets/images/ranoutof.webp"; +import seezunImage from "../assets/images/seezun.webp"; +import wokaImage from "../assets/images/woka.webp"; // High-quality iOS development images -const swiftImage = "https://images.unsplash.com/photo-1517077304055-6e89abbf09b0?w=400&h=300&fit=crop&auto=format"; -const swiftuiImage = "https://images.unsplash.com/photo-1551650975-87deedd944c3?w=400&h=300&fit=crop&auto=format"; +const swiftImage = + "https://images.unsplash.com/photo-1517077304055-6e89abbf09b0?w=400&h=300&fit=crop&auto=format"; +const swiftuiImage = + "https://images.unsplash.com/photo-1551650975-87deedd944c3?w=400&h=300&fit=crop&auto=format"; import { Apple, + ArrowRight, + Brush, + Bug, CheckCircle, Code, DollarSign, - Globe, Layers, + Eye, + Globe, + Heart, + Layers, Layout, + Lightbulb, MessageSquare, + Network, + Palette, + RefreshCcw, + Rocket, Shield, + ShoppingCart, Smartphone, + Star, + Tablet, TrendingUp, - Zap + Users, + Watch, + Zap, } from "lucide-react"; +import { Button } from "@/components/ui/button"; +import { navigateTo } from "@/App"; -// iOS App Development Hero Section +// iOS Hero Section with iPhone/iPad mockups const IOSHeroWithCTA = () => { return (
@@ -36,7 +59,7 @@ const IOSHeroWithCTA = () => { transition={{ duration: 0.8 }} className="space-y-8" > - {/* iOS Label */} + {/* iOS Development Label */} { {/* Main Heading */}

- Premium iOS App Development Services + Expert iOS App Development Services

- Create stunning, high-performance iOS applications that captivate users and drive business growth with our expert development team. + Crafting intuitive, high-performance iPhone and iPad applications that define user experience and drive engagement.

@@ -65,84 +88,85 @@ const IOSHeroWithCTA = () => { >
- - Start iOS Project + + + + Get a Free Consultation
- - Schedule Consultation + + See Our iOS Work - {/* Right side with iOS development showcase */} + {/* Right side with iOS device mockups */} - {/* iOS Development Showcase */} + {/* iOS Device Mockups */}
- {/* Central iPhone Mockup */} -
-
-
- + {/* iPhone and iPad mockup representation */} +
+
+
+
+
+
+
+
+
- {/* iPhone Details */} -
-
-
- - {/* Tech Stack Icons */} -
- -
- -
- -
- -
- -
- -
- +
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
- {/* iOS Features */} + {/* iOS Technology Badges */} - - Swift & SwiftUI + Swift - - - Native Performance + + SwiftUI - - - App Store Ready + + Xcode
@@ -153,34 +177,424 @@ const IOSHeroWithCTA = () => { ); }; -// Key Benefits of iOS Development -const IOSBenefits = () => { - const benefits = [ +// iOS Case Studies - Matching Main Case Studies Design +const IOSCaseStudies = () => { + const caseStudies = [ { - icon: Apple, - title: "Premium User Experience", - description: "Native iOS apps deliver the smooth, polished experience Apple users expect." + id: 1, + title: "RanOutOf", + client: "Global Ease Solutions", + description: + "WDI developed a smart grocery planning app with barcode scanning, voice commands, reminders, and a web-based admin CMS for Global Ease Solutions.", + keyAchievement: { + number: "75%", + metric: "Shopping Efficiency", + icon: ShoppingCart, + }, + visual: ranoutofImage, + tags: ["iOS App", "Barcode Scanning", "Voice AI", "Grocery Tech"], + gradient: "from-green-500/20 to-emerald-500/20", + accentColor: "green", + featured: false, }, { - icon: DollarSign, - title: "Higher Revenue Potential", - description: "iOS users typically spend more on apps and in-app purchases." + id: 2, + title: "Seezun", + client: "Seezun", + description: + "Seezun is a trend-driven P2P fashion marketplace enabling users to rent, buy, sell, or lend South Asian ethnicwear via mobile and web platforms.", + keyAchievement: { + number: "85%", + metric: "Brand Recognition", + icon: TrendingUp, + }, + visual: seezunImage, + tags: ["iOS App", "P2P Marketplace", "Fashion", "E-commerce"], + gradient: "from-purple-500/20 to-pink-500/20", + accentColor: "purple", + featured: false, }, { - icon: Shield, - title: "Enhanced Security", - description: "iOS provides robust security features and App Store verification." + id: 3, + title: "WOKA", + client: "WOKA Creations Pvt. Ltd", + description: + "WDI transformed WOKA's hybrid app into a high-performance native iOS platform featuring seamless streaming, deep analytics, and robust monthly support.", + keyAchievement: { + number: "300%", + metric: "User Retention", + icon: Users, + }, + visual: wokaImage, + tags: ["Native iOS", "Streaming", "Analytics", "Entertainment"], + gradient: "from-green-500/20 to-emerald-500/20", + accentColor: "green", + featured: false, + }, + ]; + + return ( +
+
+ {/* Section Header */} + + +
+
+ + + iOS Success Stories + +
+
+ + +

+ iOS Apps That Drive Results +

+

+ Discover how we've helped businesses succeed with exceptional iOS + applications that leverage native capabilities and deliver + outstanding user experiences. +

+ + + {/* Case Studies Grid - Matching Main Case Studies Layout */} +
+ {caseStudies.map((study, index) => { + const AchievementIcon = study.keyAchievement.icon; + + return ( + + { + if (study.title === "RanOutOf") { + navigateTo("/projects/ranoutof"); + } else if (study.title === "Seezun") { + navigateTo("/projects/seezun"); + } else if (study.title === "WOKA") { + navigateTo("/projects/woka"); + } + }} + > + + {/* Visual Section - Fixed Height with Responsive Container */} +
+
+ + + {/* Subtle overlay for better text contrast */} +
+ + {/* Key Achievement - Overlaid on Visual */} +
+ +
+
+ +
+
+
+ {study.keyAchievement.number} +
+
+ {study.keyAchievement.metric} +
+
+
+ +
+
+
+ + {/* Content Section - Flexible Height with Consistent Spacing */} +
+
+ {/* Project Title - Consistent Height */} +
+

+ {study.title} +

+
+ + {/* Client & Description - Consistent Height */} +
+
+ {study.client} +
+

+ {study.description} +

+
+ + {/* Tags - Consistent Height */} +
+
+ {study.tags.map((tag) => ( + + {tag} + + ))} +
+
+
+ + {/* CTA Button - Fixed at Bottom */} +
+ + + +
+
+ + + + ); + })} +
+ + {/* Bottom CTA */} + + + +
+
+ ); +}; + +// iOS Development Process Timeline +const IOSProcessTimeline = () => { + const steps = [ + { + title: "Strategy & Concept", + description: + "Define your iOS app vision, target audience, and core functionality with our expert consultation.", + icon: Lightbulb, }, { - icon: Globe, - title: "Global Market Reach", - description: "Access to millions of iOS users worldwide through the App Store." + title: "UI/UX Design", + description: + "Create pixel-perfect designs following Apple's Human Interface Guidelines for optimal user experience.", + icon: Palette, }, { + title: "Native iOS Development", + description: + "Build your app using Swift and modern iOS frameworks for maximum performance and platform integration.", + icon: Code, + }, + { + title: "Rigorous QA & Testing", + description: + "Comprehensive testing across all iOS devices and versions to ensure flawless functionality.", + icon: Bug, + }, + { + title: "App Store Launch & Support", + description: + "Handle App Store submission, optimization, and provide ongoing maintenance and updates.", + icon: Rocket, + }, + ]; + + return ( +
+
+ +

+ Our Proven Approach to Building Your iOS App +

+

+ From concept to App Store success, we guide you through every step + of the iOS development journey. +

+ + +
+ {/* Timeline line */} +
+ +
+ {steps.map((step, index) => { + const IconComponent = step.icon; + const isEven = index % 2 === 0; + + return ( + +
+
+
+
+ +
+
+ 0{index + 1} +
+
+

+ {step.title} +

+

+ {step.description} +

+
+
+ + {/* Timeline dot */} +
+ +
+ + ); + })} +
+
+
+
+ ); +}; + +// iOS Specific Services +const IOSServicesGrid = () => { + const services = [ + { + title: "Custom iPhone App Development", + description: + "Tailored solutions for specific business needs with native iOS performance.", + icon: Smartphone, + }, + { + title: "iPad App Development", + description: + "Optimized layouts and features specifically designed for tablet experiences.", + icon: Tablet, + }, + { + title: "iOS UI/UX Design", + description: + "Human Interface Guidelines-compliant, delightful user interfaces that users love.", + icon: Brush, + }, + { + title: "WatchOS & tvOS Apps", + description: + "Extending your presence across Apple devices with companion apps.", + icon: Watch, + }, + { + title: "iOS App Modernization", + description: + "Updating legacy iOS apps for modern performance, features, and design standards.", + icon: RefreshCcw, + }, + { + title: "App Store Optimization", + description: + "Maximizing discoverability and downloads through strategic ASO practices.", icon: TrendingUp, - title: "Performance Excellence", - description: "Optimized for Apple's hardware delivering superior performance." - } + }, ]; return ( @@ -194,10 +608,182 @@ const IOSBenefits = () => { className="text-center mb-20" >

- Why Choose iOS App Development? + Comprehensive iOS App Solutions

+

+ From iPhone apps to Apple ecosystem integration, we provide + end-to-end iOS development services. +

- + + + {services.map((service, index) => { + const IconComponent = service.icon; + return ( + + + +
+ +
+

+ {service.title} +

+

+ {service.description} +

+ + + + ); + })} + +
+
+ ); +}; + +// iOS Tech Stack +const IOSTechStack = () => { + const technologies = [ + { name: "Swift", logo: swiftImage }, + { name: "SwiftUI", logo: swiftuiImage }, + { + name: "Xcode", + logo: "https://images.unsplash.com/photo-1607706189992-eae578626c86?w=80&h=80&fit=crop&auto=format", + }, + { + name: "UIKit", + logo: "https://images.unsplash.com/photo-1611224923853-80b023f02d71?w=80&h=80&fit=crop&auto=format", + }, + { + name: "Core Data", + logo: "https://images.unsplash.com/photo-1633356122544-f134324a6cee?w=80&h=80&fit=crop&auto=format", + }, + { + name: "Firebase", + logo: "https://images.unsplash.com/photo-1618477388954-7852f32655ec?w=80&h=80&fit=crop&auto=format", + }, + { + name: "AWS", + logo: "https://images.unsplash.com/photo-1606868306217-dbf5046868d2?w=80&h=80&fit=crop&auto=format", + }, + { + name: "Apple Pay", + logo: "https://images.unsplash.com/photo-1556742049-0cfed4f6a45d?w=80&h=80&fit=crop&auto=format", + }, + ]; + + return ( +
+
+ +

+ Building with the Most Powerful iOS Technologies +

+

+ We leverage cutting-edge iOS frameworks and tools to create + exceptional mobile experiences. +

+ + +
+ {technologies.map((tech, index) => ( + +
+ +
+ + {tech.name} + + + ))} +
+
+
+ ); +}; + +// Key Benefits of iOS Development +const IOSKeyBenefits = () => { + const benefits = [ + { + icon: Zap, + title: "Unmatched Performance", + description: "Optimized for Apple hardware, ensuring fluid user experiences and lightning-fast responsiveness." + }, + { + icon: Shield, + title: "Superior Security", + description: "Leveraging Apple's robust security features for comprehensive data protection and user privacy." + }, + { + icon: Heart, + title: "Premium User Experience", + description: "Adhering to Human Interface Guidelines for intuitive, delightful, and accessible design." + }, + { + icon: Network, + title: "Apple Ecosystem Integration", + description: "Seamless integration with Apple Watch, Apple Pay, Siri, and other ecosystem features." + }, + { + icon: DollarSign, + title: "Strong Monetization Potential", + description: "High-value user base with effective in-app purchase mechanisms and premium positioning." + } + ]; + + return ( +
+
+ +

+ Why Choose Native iOS for Your App? +

+

+ iOS development offers unparalleled advantages for businesses looking to create premium mobile experiences. +

+ + { const technologies = [ { title: "Swift Programming", - description: "Modern, safe, and fast programming language designed for iOS development.", + description: + "Modern, safe, and fast programming language designed for iOS development.", image: swiftImage, - features: ["Type Safety", "Memory Management", "Performance Optimization", "Concurrency Support"], - icon: Code + features: [ + "Type Safety", + "Memory Management", + "Performance Optimization", + "Concurrency Support", + ], + icon: Code, }, { title: "SwiftUI Framework", - description: "Declarative UI framework for building beautiful, responsive user interfaces.", + description: + "Declarative UI framework for building beautiful, responsive user interfaces.", image: swiftuiImage, - features: ["Declarative Syntax", "Live Previews", "Cross-Platform", "Animation Support"], - icon: Layout - } + features: [ + "Declarative Syntax", + "Live Previews", + "Cross-Platform", + "Animation Support", + ], + icon: Layout, + }, ]; return ( @@ -310,10 +908,11 @@ const IOSTechnologies = () => { iOS Development Technologies

- We leverage the latest iOS technologies and frameworks to build exceptional apps. + We leverage the latest iOS technologies and frameworks to build + exceptional apps.

- + {
- + {/* Content Section */}

@@ -358,13 +957,18 @@ const IOSTechnologies = () => {

{tech.description}

- + {/* Features List */}
-

Key Features:

+

+ Key Features: +

{tech.features.map((feature, idx) => ( -
+
{feature}
@@ -394,7 +998,23 @@ export const IOSAppDevelopment = () => {

- + +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+