[V0_FILE]typescriptreact:file="app/layout.tsx" isMerged="true" import type React from "react" import type { Metadata } from "next" import { Inter, Geist_Mono } from "next/font/google" import { Analytics } from "@vercel/analytics/next" import "./globals.css" const _inter = Inter({ subsets: ["latin"] }) const _geistMono = Geist_Mono({ subsets: ["latin"] }) export const metadata: Metadata = { title: "Elijah Nizeyimana | Founder & CEO, Zen Inc. Group", description: "Building East Africa's Integrated Digital Ecosystem. Founder & CEO of Zen Inc. Group - ZenFlix, Zen Eats, Zen Studios, and more.", } export default function RootLayout({ children, }: Readonly<{ children: React.ReactNode }>) { return ( {children} ) } [V0_FILE]typescriptreact:file="components/philosophy.tsx" isMerged="true" import { Link2, MapPin, Building2, Lightbulb } from "lucide-react" const principles = [ { icon: Link2, title: "Ecosystem Integration", description: "Belief in creating interconnected services where each platform strengthens the others, creating a cohesive digital experience that addresses multiple aspects of users' lives.", }, { icon: MapPin, title: "Local First, Regional Scale", description: "Every service is developed and refined in the Ugandan market before strategic expansion to neighboring regions, ensuring cultural relevance and operational excellence.", }, { icon: Building2, title: "Infrastructure Through Services", description: "Building essential digital infrastructure not as abstract technology, but through consumer-facing services that naturally create the networks and systems needed for broader development.", }, { icon: Lightbulb, title: "Creator Empowerment", description: "Fostering an environment where African storytellers and innovators have the platforms, tools, and support to reach audiences both locally and globally.", }, ] export function Philosophy() { return (

Leadership Philosophy

Guiding Principles

{principles.map((principle) => (

{principle.title}

{principle.description}

))}

) } [V0_FILE]typescriptreact:file="components/focus-areas.tsx" isMerged="true" const focusAreas = [ { title: "Platform Development", items: [ "Enhancing cross-service integration within the Zen ecosystem", "Developing next-generation recommendation and discovery systems", "Building more sophisticated tools for content creators", ], }, { title: "Market Expansion", items: [ "Strengthening presence in current East African markets", "Preparing for thoughtful expansion to new regions", "Developing localization frameworks for diverse African markets", ], }, { title: "Partnership Development", items: [ "Building strategic alliances with telecom providers across Africa", "Developing content partnerships with global platforms", "Establishing educational collaborations with regional institutions", ], }, { title: "Talent Development", items: [ "Expanding the Zen Creators Fund to support more projects", "Enhancing Zen Academy programs for digital skills training", "Building leadership pipelines within the organization", ], }, ] export function FocusAreas() { return (

Current Focus Areas

Strategic Priorities

{focusAreas.map((area) => (

{area.title}

{item}

))}

) } [V0_FILE]typescriptreact:file="components/quote.tsx" isMerged="true" import { QuoteIcon } from "lucide-react" export function Quote() { return (

“We are witnessing a transformative moment in Africa's digital journey. The opportunity before us is not merely to adopt global platforms, but to build our own—platforms that understand our rhythms, celebrate our stories, and solve our unique challenges.”

At Zen Inc., we're constructing an ecosystem where each service reinforces the others, where a user's journey might begin with entertainment but extend to daily convenience, community connection, and creative expression. This integrated approach allows us to build deeper relationships and more meaningful impact.

Our work is fundamentally about agency—ensuring that African voices shape African digital spaces, that local innovators build local solutions, and that our technological future reflects our cultural richness.

— Elijah Nizeyimana

) } [V0_FILE]typescriptreact:file="components/contact.tsx" isMerged="true" import { Mail, Phone, Building2 } from "lucide-react" export function Contact() { return (

Contact

Get in Touch

Interested in discussing partnerships, investment opportunities, or the future of African digital innovation? Let's connect.

Direct Contact

elijah.tech.me@gmail.com

Mobile

+256 700 982 855

+256 792 422 855

Headquarters

Zen Inc. Group

Kampala, Uganda

Zen Inc. Group Inquiries

Corporate

info.zenincug@gmail.com

Media Partnerships

zenmediaeastafrica@gmail.com

Platform Support

info@zen-flix.com

) } [V0_FILE]typescriptreact:file="components/footer.tsx" isMerged="true" export function Footer() { return ( ) } [V0_FILE]json:file="package.json" isMerged="true" { "name": "ZEN INC GROUP", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "eslint ." }, "dependencies": { "@hookform/resolvers": "^3.10.0", "@radix-ui/react-accordion": "1.2.2", "@radix-ui/react-alert-dialog": "1.1.4", "@radix-ui/react-aspect-ratio": "1.1.1", "@radix-ui/react-avatar": "1.1.2", "@radix-ui/react-checkbox": "1.1.3", "@radix-ui/react-collapsible": "1.1.2", "@radix-ui/react-context-menu": "2.2.4", "@radix-ui/react-dialog": "1.1.4", "@radix-ui/react-dropdown-menu": "2.1.4", "@radix-ui/react-hover-card": "1.1.4", "@radix-ui/react-label": "2.1.1", "@radix-ui/react-menubar": "1.1.4", "@radix-ui/react-navigation-menu": "1.2.3", "@radix-ui/react-popover": "1.1.4", "@radix-ui/react-progress": "1.1.1", "@radix-ui/react-radio-group": "1.2.2", "@radix-ui/react-scroll-area": "1.2.2", "@radix-ui/react-select": "2.1.4", "@radix-ui/react-separator": "1.1.1", "@radix-ui/react-slider": "1.2.2", "@radix-ui/react-slot": "1.1.1", "@radix-ui/react-switch": "1.1.2", "@radix-ui/react-tabs": "1.1.2", "@radix-ui/react-toast": "1.2.4", "@radix-ui/react-toggle": "1.1.1", "@radix-ui/react-toggle-group": "1.1.1", "@radix-ui/react-tooltip": "1.1.6", "@vercel/analytics": "1.3.1", "autoprefixer": "^10.4.20", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "cmdk": "1.0.4", "date-fns": "4.1.0", "embla-carousel-react": "8.5.1", "input-otp": "1.4.1", "lucide-react": "^0.454.0", "next": "16.0.10", "next-themes": "^0.4.6", "react": "19.2.0", "react-day-picker": "9.8.0", "react-dom": "19.2.0", "react-hook-form": "^7.60.0", "react-resizable-panels": "^2.1.7", "recharts": "2.15.4", "sonner": "^1.7.4", "tailwind-merge": "^3.3.1", "tailwindcss-animate": "^1.0.7", "vaul": "^1.1.2", "zod": "3.25.76" }, "devDependencies": { "@tailwindcss/postcss": "^4.1.9", "@types/node": "^22", "@types/react": "^19", "@types/react-dom": "^19", "postcss": "^8.5", "tailwindcss": "^4.1.9", "tw-animate-css": "1.3.3", "typescript": "^5" } } [V0_FILE]css:file="app/globals.css" isEdit="true" isQuickEdit="true" @import "tailwindcss"; @import "tw-animate-css"; @custom-variant dark (&:is(.dark *)); /* New dark tech-forward theme for CEO portfolio */ :root { --background: oklch(0.08 0.015 250); --foreground: oklch(0.95 0 0); --card: oklch(0.12 0.015 250); --card-foreground: oklch(0.95 0 0); --popover: oklch(0.12 0.015 250); --popover-foreground: oklch(0.95 0 0); --primary: oklch(0.75 0.18 175); --primary-foreground: oklch(0.08 0.015 250); --secondary: oklch(0.16 0.015 250); --secondary-foreground: oklch(0.85 0 0); --muted: oklch(0.2 0.015 250); --muted-foreground: oklch(0.65 0 0); --accent: oklch(0.75 0.18 175); --accent-foreground: oklch(0.08 0.015 250); --destructive: oklch(0.577 0.245 27.325); --destructive-foreground: oklch(0.577 0.245 27.325); --border: oklch(0.22 0.015 250); --input: oklch(0.16 0.015 250); --ring: oklch(0.75 0.18 175); --chart-1: oklch(0.75 0.18 175); --chart-2: oklch(0.6 0.118 184.704); --chart-3: oklch(0.398 0.07 227.392); --chart-4: oklch(0.828 0.189 84.429); --chart-5: oklch(0.769 0.188 70.08); --radius: 0.625rem; --sidebar: oklch(0.1 0.015 250); --sidebar-foreground: oklch(0.95 0 0); --sidebar-primary: oklch(0.75 0.18 175); --sidebar-primary-foreground: oklch(0.08 0.015 250); --sidebar-accent: oklch(0.16 0.015 250); --sidebar-accent-foreground: oklch(0.95 0 0); --sidebar-border: oklch(0.22 0.015 250); --sidebar-ring: oklch(0.75 0.18 175); } .dark { --background: oklch(0.13 0.01 250); --foreground: oklch(0.95 0 0); --card: oklch(0.17 0.01 250); --card-foreground: oklch(0.95 0 0); --popover: oklch(0.17 0.01 250); --popover-foreground: oklch(0.95 0 0); --primary: oklch(0.75 0.15 175); --primary-foreground: oklch(0.13 0.01 250); --secondary: oklch(0.22 0.01 250); --secondary-foreground: oklch(0.85 0 0); --muted: oklch(0.25 0.01 250); --muted-foreground: oklch(0.65 0 0); --accent: oklch(0.75 0.15 175); --accent-foreground: oklch(0.13 0.01 250); --destructive: oklch(0.396 0.141 25.723); --destructive-foreground: oklch(0.637 0.237 25.331); --border: oklch(0.28 0.01 250); --input: oklch(0.22 0.01 250); --ring: oklch(0.75 0.15 175); --chart-1: oklch(0.75 0.15 175); --chart-2: oklch(0.696 0.17 162.48); --chart-3: oklch(0.769 0.188 70.08); --chart-4: oklch(0.627 0.265 303.9); --chart-5: oklch(0.645 0.246 16.439); --sidebar: oklch(0.15 0.01 250); --sidebar-foreground: oklch(0.95 0 0); --sidebar-primary: oklch(0.75 0.15 175); --sidebar-primary-foreground: oklch(0.13 0.01 250); --sidebar-accent: oklch(0.22 0.01 250); --sidebar-accent-foreground: oklch(0.95 0 0); --sidebar-border: oklch(0.28 0.01 250); --sidebar-ring: oklch(0.75 0.15 175); } @theme inline { --font-sans: "Inter", "Inter Fallback"; --font-mono: "Geist Mono", "Geist Mono Fallback"; --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); /* Custom animations */ --animate-float: float 6s ease-in-out infinite; --animate-float-delayed: float 6s ease-in-out 2s infinite; --animate-float-slow: float 8s ease-in-out 1s infinite; --animate-pulse-glow: pulse-glow 4s ease-in-out infinite; --animate-gradient: gradient 15s ease infinite; --animate-fade-up: fade-up 0.6s ease-out forwards; --animate-fade-in: fade-in 0.6s ease-out forwards; --animate-scale-in: scale-in 0.5s ease-out forwards; --animate-slide-left: slide-left 0.6s ease-out forwards; --animate-slide-right: slide-right 0.6s ease-out forwards; } @layer base { * { @apply border-border outline-ring/50; } body { @apply bg-background text-foreground; } } /* Smooth scrolling */ html { scroll-behavior: smooth; } /* Keyframe animations */ @keyframes float { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-20px) rotate(2deg); } } @keyframes pulse-glow { 0%, 100% { opacity: 0.4; transform: scale(1); } 50% { opacity: 0.8; transform: scale(1.05); } } @keyframes gradient { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } @keyframes fade-up { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: translateY(0); } } @keyframes fade-in { from { opacity: 0; } to { opacity: 1; } } @keyframes scale-in { from { opacity: 0; transform: scale(0.9); } to { opacity: 1; transform: scale(1); } } @keyframes slide-left { from { opacity: 0; transform: translateX(60px); } to { opacity: 1; transform: translateX(0); } } @keyframes slide-right { from { opacity: 0; transform: translateX(-60px); } to { opacity: 1; transform: translateX(0); } } /* Animated grid background */ .grid-pattern { background-image: linear-gradient(to right, oklch(0.75 0.18 175 / 0.03) 1px, transparent 1px), linear-gradient(to bottom, oklch(0.75 0.18 175 / 0.03) 1px, transparent 1px); background-size: 60px 60px; } /* Noise texture overlay */ .noise-overlay::before { content: ""; position: absolute; inset: 0; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E"); opacity: 0.03; pointer-events: none; } [V0_FILE]typescriptreact:file="hooks/use-intersection.ts" "use client" import { useEffect, useRef, useState } from "react" interface UseIntersectionOptions { threshold?: number rootMargin?: string triggerOnce?: boolean } export function useIntersection(options: UseIntersectionOptions = {}) { const { threshold = 0.1, rootMargin = "0px", triggerOnce = true } = options const ref = useRef(null) const [isIntersecting, setIsIntersecting] = useState(false) useEffect(() => { const element = ref.current if (!element) return const observer = new IntersectionObserver( ([entry]) => { if (entry.isIntersecting) { setIsIntersecting(true) if (triggerOnce) { observer.unobserve(element) } } else if (!triggerOnce) { setIsIntersecting(false) } }, { threshold, rootMargin }, ) observer.observe(element) return () => observer.disconnect() }, [threshold, rootMargin, triggerOnce]) return { ref, isIntersecting } } [V0_FILE]typescriptreact:file="components/animated-background.tsx" "use client" import { useEffect, useState } from "react" interface Particle { id: number x: number y: number size: number opacity: number duration: number delay: number } export function AnimatedBackground() { const [particles, setParticles] = useState([]) useEffect(() => { const newParticles: Particle[] = Array.from({ length: 50 }, (_, i) => ({ id: i, x: Math.random() * 100, y: Math.random() * 100, size: Math.random() * 4 + 1, opacity: Math.random() * 0.5 + 0.1, duration: Math.random() * 20 + 10, delay: Math.random() * 5, })) setParticles(newParticles) }, []) return (

{/* Gradient orbs */}

{/* Floating particles */} {particles.map((particle) => (

))} {/* Grid pattern overlay */}

{/* Noise texture */}

{/* Gradient overlay for depth */}

) } [V0_FILE]typescriptreact:file="components/animated-section.tsx" "use client" import type { ReactNode } from "react" import { useIntersection } from "@/hooks/use-intersection" interface AnimatedSectionProps { children: ReactNode className?: string animation?: "fade-up" | "fade-in" | "scale-in" | "slide-left" | "slide-right" delay?: number } export function AnimatedSection({ children, className = "", animation = "fade-up", delay = 0 }: AnimatedSectionProps) { const { ref, isIntersecting } = useIntersection({ threshold: 0.1 }) const animationStyles: Record = { "fade-up": "animate-[fade-up_0.6s_ease-out_forwards]", "fade-in": "animate-[fade-in_0.6s_ease-out_forwards]", "scale-in": "animate-[scale-in_0.5s_ease-out_forwards]", "slide-left": "animate-[slide-left_0.6s_ease-out_forwards]", "slide-right": "animate-[slide-right_0.6s_ease-out_forwards]", } return (

{children}

) } [V0_FILE]typescriptreact:file="components/hero.tsx" isEdit="true" "use client" import { ArrowDown } from "lucide-react" import Link from "next/link" import { useEffect, useState } from "react" export function Hero() { const [mounted, setMounted] = useState(false) useEffect(() => { setMounted(true) }, []) return (

Founder & Chief Executive Officer

Elijah Nizeyimana

Building East Africa's Integrated Digital Ecosystem

Leading Zen Inc. Group, a Kampala-based technology ecosystem developing interconnected platforms for modern African digital life.

Explore the Ecosystem Get in Touch

ZEN

{/* Orbiting dots */}

Zen Inc. Group

Kampala, Uganda

{/* Scroll indicator */}

Scroll

) } [V0_FILE]typescriptreact:file="components/about.tsx" isEdit="true" "use client" import { AnimatedSection } from "./animated-section" export function About() { return (

About

Vision & Mission

Elijah Nizeyimana leads Zen Inc. Group, a Kampala-based technology ecosystem developing interconnected platforms for modern African digital life. His work focuses on creating synergistic services that address entertainment, daily convenience, and creative development through a vertically integrated approach.

Under his leadership, Zen Inc. has grown from a single streaming service into a portfolio of platforms serving diverse needs while maintaining a unified vision of African-led digital innovation.

{[ { value: "6+", label: "Years Building" }, { value: "9", label: "Platform Units" }, { value: "5", label: "Countries" }, ].map((stat, index) => (

{stat.value}

{stat.label}

))}

) } [V0_FILE]typescriptreact:file="components/ecosystem.tsx" isEdit="true" "use client" import { Play, UtensilsCrossed, Film, Newspaper, FlaskConical, Truck, Users, GraduationCap } from "lucide-react" import { AnimatedSection } from "./animated-section" const digitalServices = [ { icon: Play, name: "ZenFlix", function: "Streaming & Content Distribution", focus: "East Africa's premier local streaming platform, featuring original productions and curated African content", }, { icon: UtensilsCrossed, name: "Zen Eats", function: "Food Delivery & Logistics", focus: "Daily convenience platform with expanding operations across Uganda and Kenya", }, { icon: Film, name: "Zen Studios", function: "Original Content Production", focus: "Production house creating exclusive content for ZenFlix and partner platforms", }, ] const enterpriseUnits = [ { icon: Newspaper, name: "Zen Media", function: "Content Licensing & Distribution", focus: "Managing content partnerships and international distribution of Zen Originals", }, { icon: FlaskConical, name: "Zen Labs", function: "Technology Development", focus: "Central research and development hub for platform innovation", }, { icon: Truck, name: "Zen Logistics", function: "Delivery Infrastructure", focus: "Logistics network supporting delivery operations across the ecosystem", }, ] const communityInitiatives = [ { icon: Users, name: "Zen Creators Fund", function: "Talent Support", focus: "Supporting emerging filmmakers and digital creators", }, { icon: GraduationCap, name: "Zen Academy", function: "Skills Development", focus: "Partnership-based training programs in digital skills", }, ] export function Ecosystem() { return (

The Zen Inc. Ecosystem

Integrated Digital Platforms

A vertically integrated approach to building Africa's digital future through interconnected services.

{/* Digital Services Division */}

Digital Services Division

{digitalServices.map((service, index) => (

{service.name}

{service.function}

{service.focus}

))}

{/* Enterprise & Infrastructure Division */}

Enterprise & Infrastructure Division

{enterpriseUnits.map((unit, index) => (

{unit.name}

{unit.function}

{unit.focus}

))}

{/* Community & Development Division */}

Community & Development Division

{communityInitiatives.map((initiative, index) => (

{initiative.name}

{initiative.function}

{initiative.focus}

))}

) } [V0_FILE]typescriptreact:file="components/timeline.tsx" isEdit="true" "use client" import { AnimatedSection } from "./animated-section" const milestones = [ { year: "2020", title: "Foundation", points: [ "Established Zen Inc. Group with initial focus on digital media", "Launched ZenFlix in Uganda with curated local content", "Built foundational partnerships with local telecom providers", ], }, { year: "2021", title: "Expansion & Integration", points: [ "Formed Zen Studios for original content production", "Introduced Zen Eats as complementary daily service", "Developed initial ecosystem integration framework", ], }, { year: "2022", title: "Ecosystem Development", points: [ "Launched Zen Media division for content distribution", "Expanded ZenFlix to Kenyan market with localized approach", "Established Zen Creators Fund to support local talent", ], }, { year: "2023", title: "Regional Growth", points: [ "Extended operations to Tanzania with Swahili-first implementation", "Strengthened Zen Eats presence across multiple cities", "Enhanced platform technology through dedicated development", ], }, { year: "2024", title: "Infrastructure & Innovation", points: [ "Formed Zen Labs as centralized technology hub", "Developed proprietary recommendation systems", "Expanded content production capabilities", ], }, { year: "2025", title: "Market Cluster Development", points: [ "Entered Rwandan market with integrated ecosystem approach", "Established university partnerships through Zen Academy", "Enhanced cross-platform user experience", ], }, { year: "2026", title: "Platform Maturity", points: [ "Developing West African expansion strategy", "Exploring new service verticals within ecosystem", "Strengthening pan-African content partnerships", ], }, ] export function Timeline() { return (

Leadership Journey

Building Over Time

{milestones.map((milestone, index) => (

{/* Content */}

{milestone.year}

{milestone.title}

{point}

))}

) } [V0_FILE]typescriptreact:file="components/header.tsx" isEdit="true" "use client" import { useState, useEffect } from "react" import Link from "next/link" import { Menu, X } from "lucide-react" const navLinks = [ { href: "#about", label: "About" }, { href: "#ecosystem", label: "Ecosystem" }, { href: "#journey", label: "Journey" }, { href: "#philosophy", label: "Philosophy" }, { href: "#contact", label: "Contact" }, ] export function Header() { const [isOpen, setIsOpen] = useState(false) const [scrolled, setScrolled] = useState(false) useEffect(() => { const handleScroll = () => { setScrolled(window.scrollY > 50) } window.addEventListener("scroll", handleScroll) return () => window.removeEventListener("scroll", handleScroll) }, []) return (

{/* Mobile Navigation */}

{navLinks.map((link, index) => ( setIsOpen(false)} style={{ transitionDelay: `${index * 50}ms` }} > {link.label} ))}

) } [V0_FILE]typescriptreact:file="app/page.tsx" isEdit="true" import { Header } from "@/components/header" import { Hero } from "@/components/hero" import { About } from "@/components/about" import { Ecosystem } from "@/components/ecosystem" import { Timeline } from "@/components/timeline" import { Philosophy } from "@/components/philosophy" import { FocusAreas } from "@/components/focus-areas" import { Quote } from "@/components/quote" import { Contact } from "@/components/contact" import { Footer } from "@/components/footer" import { AnimatedBackground } from "@/components/animated-background" export default function Home() { return (

) }

About

Tags

Share

More Templates Like This

About

Tags

Share

About

Tags

Share

More Templates Like This