worked on on the pages
This commit is contained in:
@@ -4,6 +4,7 @@ import { Footer } from "../components/Footer";
|
||||
import { Button } from "../components/ui/button";
|
||||
import { Badge } from "../components/ui/badge";
|
||||
import { Card, CardContent } from "../components/ui/card";
|
||||
import vib360 from "../assets/vib360.jpg"
|
||||
import { ArrowRight, Calendar, Users, Smartphone, Globe, Monitor, Check, Star, TrendingUp, Factory, Shield, Zap, Settings, Target, AlertCircle, Clock, Database, Wifi, BarChart3, Bell, Activity, Wrench, Brain } from "lucide-react";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
// import vib360Image from "figma:asset/6e4d0e4c1e2f3a4b5c6d7e8f9g0h1i2j3k4l5m6n7o8p9q0r1s2t.png";
|
||||
@@ -15,7 +16,7 @@ export const VIB360Project = () => {
|
||||
return (
|
||||
<div className="dark min-h-screen bg-background">
|
||||
{/* <Navigation /> */}
|
||||
|
||||
|
||||
{/* 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" />
|
||||
@@ -28,11 +29,11 @@ export const VIB360Project = () => {
|
||||
Industrial IoT Case Study
|
||||
</Badge>
|
||||
</div>
|
||||
|
||||
|
||||
<h1 className="text-4xl md:text-5xl lg:text-6xl font-bold mb-6 text-white font-manrope">
|
||||
VIB360 Platform
|
||||
</h1>
|
||||
|
||||
|
||||
<p className="text-xl text-muted-foreground mb-8 font-manrope">
|
||||
Industrial IoT Vibration Monitoring & Predictive Maintenance Platform - AI-enabled solution for real-time monitoring and operational efficiency
|
||||
</p>
|
||||
@@ -88,7 +89,7 @@ export const VIB360Project = () => {
|
||||
|
||||
{/* CTA Buttons */}
|
||||
<div className="flex flex-col sm:flex-row gap-4">
|
||||
<Button
|
||||
<Button
|
||||
size="lg"
|
||||
className="bg-[#E5195E] hover:bg-[#E5195E]/90 text-white font-manrope"
|
||||
onClick={() => navigate('/start-a-project')}
|
||||
@@ -96,7 +97,7 @@ export const VIB360Project = () => {
|
||||
Build Your IoT Platform
|
||||
<ArrowRight className="w-5 h-5 ml-2" />
|
||||
</Button>
|
||||
<Button
|
||||
<Button
|
||||
size="lg"
|
||||
variant="outline"
|
||||
className="border-white/20 text-white hover:bg-white/10 font-manrope"
|
||||
@@ -109,8 +110,8 @@ export const VIB360Project = () => {
|
||||
|
||||
<div className="relative">
|
||||
<div className="aspect-square bg-gradient-to-br from-[#E5195E]/20 to-transparent rounded-2xl p-8 border border-white/10">
|
||||
<img
|
||||
src={vib360Image}
|
||||
<img
|
||||
src={vib360Image}
|
||||
alt="VIB360 Industrial IoT Vibration Monitoring Platform"
|
||||
className="w-full h-full object-cover rounded-lg"
|
||||
/>
|
||||
@@ -140,7 +141,7 @@ export const VIB360Project = () => {
|
||||
<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>
|
||||
|
||||
|
||||
<div className="grid md:grid-cols-3 gap-8">
|
||||
<Card className="bg-card/50 border-white/10">
|
||||
<CardContent className="p-6">
|
||||
@@ -181,7 +182,7 @@ export const VIB360Project = () => {
|
||||
<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>
|
||||
|
||||
|
||||
<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>
|
||||
@@ -229,7 +230,7 @@ export const VIB360Project = () => {
|
||||
<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>
|
||||
|
||||
|
||||
<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>
|
||||
@@ -315,43 +316,43 @@ export const VIB360Project = () => {
|
||||
<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>
|
||||
|
||||
|
||||
<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 sprint reviews with hardware + software teams, field testing after each major release, iterative model retraining with new sensor data
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||
{[
|
||||
{
|
||||
phase: "Discovery & Planning",
|
||||
{
|
||||
phase: "Discovery & Planning",
|
||||
duration: "3 weeks",
|
||||
description: "Hardware-software integration feasibility, AI model baseline setup"
|
||||
},
|
||||
{
|
||||
phase: "Design & Prototyping",
|
||||
{
|
||||
phase: "Design & Prototyping",
|
||||
duration: "5 weeks",
|
||||
description: "Sensor data visualization mockups, mobile UI/UX for technician workflows"
|
||||
},
|
||||
{
|
||||
phase: "Core Platform Development",
|
||||
{
|
||||
phase: "Core Platform Development",
|
||||
duration: "12 weeks",
|
||||
description: "Sensor connectivity modules, time-series data ingestion pipeline, web dashboard core features"
|
||||
},
|
||||
{
|
||||
phase: "AI & Analytics Module",
|
||||
{
|
||||
phase: "AI & Analytics Module",
|
||||
duration: "6 weeks",
|
||||
description: "Model training & tuning, predictive maintenance alerts"
|
||||
},
|
||||
{
|
||||
phase: "Integration & Testing",
|
||||
{
|
||||
phase: "Integration & Testing",
|
||||
duration: "5 weeks",
|
||||
description: "SCADA/ERP integration APIs, field testing in pilot plants"
|
||||
},
|
||||
{
|
||||
phase: "Deployment & Training",
|
||||
{
|
||||
phase: "Deployment & Training",
|
||||
duration: "3 weeks",
|
||||
description: "Rollout to initial sites, staff training & documentation"
|
||||
}
|
||||
@@ -382,7 +383,7 @@ export const VIB360Project = () => {
|
||||
<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>
|
||||
|
||||
|
||||
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6 mb-12">
|
||||
{[
|
||||
{
|
||||
@@ -434,7 +435,7 @@ export const VIB360Project = () => {
|
||||
<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>
|
||||
|
||||
|
||||
<div className="grid md:grid-cols-2 lg:grid-cols-4 gap-6 mb-12">
|
||||
{[
|
||||
{ label: "Site Deployments", value: "15", icon: Factory, desc: "industrial sites" },
|
||||
@@ -495,7 +496,7 @@ export const VIB360Project = () => {
|
||||
<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>
|
||||
|
||||
|
||||
<div className="grid md:grid-cols-2 gap-8">
|
||||
<Card className="bg-card/50 border-white/10">
|
||||
<CardContent className="p-6">
|
||||
@@ -560,7 +561,7 @@ export const VIB360Project = () => {
|
||||
<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>
|
||||
|
||||
|
||||
<div className="grid md:grid-cols-2 gap-8">
|
||||
<Card className="bg-card/50 border-white/10">
|
||||
<CardContent className="p-6">
|
||||
@@ -611,7 +612,7 @@ export const VIB360Project = () => {
|
||||
Create advanced predictive maintenance platforms with AI-enabled vibration monitoring and real-time analytics for industrial excellence.
|
||||
</p>
|
||||
<div className="flex flex-col sm:flex-row gap-4 justify-center">
|
||||
<Button
|
||||
<Button
|
||||
size="lg"
|
||||
className="bg-[#E5195E] hover:bg-[#E5195E]/90 text-white px-8 py-3 font-manrope"
|
||||
onClick={() => navigate('/start-a-project')}
|
||||
@@ -619,7 +620,7 @@ export const VIB360Project = () => {
|
||||
Start Your Project
|
||||
<ArrowRight className="w-5 h-5 ml-2" />
|
||||
</Button>
|
||||
<Button
|
||||
<Button
|
||||
size="lg"
|
||||
variant="outline"
|
||||
className="border-white/20 text-white hover:bg-white/10 px-8 py-3 font-manrope"
|
||||
|
||||
Reference in New Issue
Block a user