Skip to content

Omnivoltaic Site

Version: 4.0.0
Date: 2026-02-13
Site URL: www.omnivoltaic.com
Dev Port: 3100
Extends: all-sites.md

Site Purpose

Corporate hub and central entry point to Omnivoltaic's digital ecosystem. Gateway to all three information flow dimensions: Solutions, Regional Operations, and Enterprise Capabilities.

Header

default

Navigation Menu: - Home - Products - Articles

Footer

default

Homepage

Hero Section

Block: HeroWithBackground (from marketing/uxi/blocks)

Title: Omnivoltaic

Tagline: Electrify the World!

Subtitle: Power Everywhere. For Everyone.

Background: Image with dark overlay - https://res.cloudinary.com/oves/image/upload/t_article12_5/v1632057887/promo/missing_link_cube.jpg

CTA: Partner with Us → https://forms.office.com/r/45vCYswcf4

Solution Features Section

Layout Pattern: Alternating FeatureGrid and FeatureGridRight blocks for visual interest

Feature 1: E-Mobility

Block: FeatureGrid (from marketing/uxi/blocks)

Props: - Eyebrow: "E-Mobility" - Heading: "On the Road" - Description: "Clean. Economic. Sustainable." - Image: https://res.cloudinary.com/oves/image/upload/t_banner-bg22/v1760327090/promo/Riders_fts3z5.png - CTA Button: - Label: "Explore" - Link: canonical path /mobility - Local development override: NEXT_PUBLIC_MOBILITY_URL

Feature 2: Off-Grid Energy

Block: FeatureGridRight (from marketing/uxi/blocks)

Props: - Eyebrow: "Off-Grid Energy" - Heading: "At Home" - Description: "Connecting Communities" - Image: https://res.cloudinary.com/oves/image/upload/t_banner-bg22/v1769161506/promo/Off-Grid_Web_230123_1_kxmnst.png - CTA Button: - Label: "Explore" - Link: canonical path /off-grid - Local development override: NEXT_PUBLIC_OFF_GRID_URL

Feature 3: Cross-Grid

Block: FeatureGrid (from marketing/uxi/blocks)

Props: - Eyebrow: "Cross-Grid" - Heading: "Cross Boundaries" - Description: "Bridging the Power Gaps" - Image: https://res.cloudinary.com/oves/image/upload/t_banner-bg22/v1769075841/promo/Cross-Grid__Web_230122_pllc2u.png - CTA Button: - Label: "Explore" - Link: canonical path /cross-grid - Local development override: NEXT_PUBLIC_CROSS_GRID_URL

Feature 4: Productive Use

Block: FeatureGridRight (from marketing/uxi/blocks)

Props: - Eyebrow: "Productive Use" - Heading: "At Work" - Description: "Tools to Power Income Generation" - Image: https://res.cloudinary.com/oves/image/upload/t_banner-bg22/v1769075841/promo/18Ah_Solar_Sewing_Machine_Pack_-_6_yvgspt.png - CTA Button: - Label: "Explore" - Link: canonical path /productive - Local development override: NEXT_PUBLIC_PRODUCTIVE_URL

Products Page (New Products)

Route: /products

Purpose: Cross-portfolio showcase of newest and featured products — a "sneak peek" into the solution sites, encouraging exploration.

Hero Section

Pattern: Same hero style as other pages for consistency

  • Background Image: https://res.cloudinary.com/oves/image/upload/t_article12_5/v1660471804/promo/Battery_Production.jpg
  • Overlay: Dark gradient overlay (bg-gray-900/70)
  • Decorative Blob: Gradient shape overlay (pink-to-purple, 20% opacity)
  • Eyebrow: "New Products" (cyan badge)
  • Heading: "Latest Innovations"
  • Description: "Discover our newest solar systems, e-mobility solutions, and productive use equipment across all portfolios."

Product Grid Section

Block: ProductGrid (dark-mode variant)

Layout: - 3-column responsive grid (lg:3, md:2, sm:1) - Dark background (bg-gray-900) - Each card links to product detail page

Product Card Elements: - Product image (component diagram style, aspect-square) - Product name/title - Portfolio badge (Off-Grid, E-Mobility, Cross-Grid, Productive Use) - Brief tagline/description - "View Details" link → /products/[slug]

Data Source: - Short-term: Hard-coded featured_products collection (similar to articles pattern) - Later: BFF query: contentList(contentType: "product_card", filters: { tags: ["featured", "new"] })

Featured Products Collection: - 6-9 products representing all 4 portfolios - Selection criteria: newest releases, best sellers, flagship items - Rotate quarterly based on product launches

Product Detail Page

Route: /products/[slug]

Purpose: Individual product showcase with specifications, images, and portfolio context.

Layout Structure

Block: ProductDetail (dark-mode variant)

Two-Column Layout: - Left (60%): Image gallery with thumbnail navigation - Right (40%): Product information panel

  • Primary image display (large)
  • Thumbnail strip below (4-6 images)
  • Images: component diagrams, product photos, system schematics
  • Navigation: prev/next arrows or click thumbnails

Product Information Section

  • Product Title: Full product name/SKU
  • Portfolio Badge: Category indicator (Off-Grid, E-Mobility, etc.)
  • Description: Product overview paragraph
  • Tab Navigation:
  • Description tab (default active)
  • Specifications tab (technical data)
  • CTA Buttons:
  • "Download Datasheet" (PDF) — primary action
  • "Request Quote" → contact form or partner link
  • Portfolio Link: "Explore more [Portfolio Name] products →" links to solution site

Expandable Details Section

Block: Accordion/Disclosure pattern

  • Features: Key product features list
  • Specifications: Technical specifications table
  • Included Items: What's in the box/package contents
  • Warranty: Warranty and support information
  • 3-4 related products from same portfolio
  • Horizontal scroll or grid
  • Encourages cross-selling within portfolio

Data Source: - Short-term: Hard-coded product data matching featured collection - Later: BFF query: content(contentKey: "[slug]", contentType: "product_detail")

Articles Page

Pattern: Same hero style as homepage for consistency

Route: /articles

Hero Section: - Background Image: https://res.cloudinary.com/oves/image/upload/t_article12_5/v1652757787/promo/pexels-startup-stock-photos-212286_ouagov.jpg - Overlay: Dark gradient overlay (bg-gray-900/70) for text readability - Decorative Blob: Gradient shape overlay (pink-to-purple, 20% opacity) - Eyebrow: "Learn. Share. Illuminate." (cyan badge) - Heading: "Energy Solutions Insights" - Description: "Explore the latest innovations in solar storage, community power systems, and sustainable energy technologies." - Principle: Consistent hero treatment across site sections reinforces brand identity

Content: - Collection: omnivoltaic_vision (defined in all-sites.md) - Articles: Display articles from the Omnivoltaic Vision collection: - About Omnivoltaic Technologies - About Omnivoltaic Markets - Electrifying the World: Off-Grid Power and Convergence Technologies - Off-Grid Power - Convergence Technologies - Omnivoltaic's Competitive Edge: A Solar Revolution Beyond the Ordinary - Omnivoltaic Broad Product Range - Omnivoltaic Partnerships - Global Partnerships and Global Reach - Display: Article cards in grid layout, each with: - Hero image (if available) - Title - Excerpt/subtitle - Read more link → /articles/[slug]

Implementation: - Reuse homepage hero structure with integrated header - Fetch articles from BFF using collection ID: omnivoltaic_vision - List view with article cards below hero - Article detail pages at /articles/[slug] (minimal hero with article image) - ISR pattern with BFF data fetching

Future Pages

All future pages (About, Solutions, Impact, Contact) deferred to Phase 2+

Content Evolution

Phase 1: MVP (Current)

  • ✅ Hero section with background image
  • ✅ 4 solution feature blocks (alternating left/right layout)
  • ✅ Articles page (reuse marketing pattern)
  • ✅ Basic header with Home/Articles navigation
  • ✅ Default footer

Phase 1.5: Products Page (In Progress)

  • [ ] New Products grid page (/products)
  • [ ] Product detail page (/products/[slug])
  • [ ] Dark-mode ProductGrid block
  • [ ] Dark-mode ProductDetail block
  • [ ] Featured products collection (hard-coded)
  • [ ] Navigation update: Home → Products → Articles

Phase 2: Enhanced Content

  • [ ] About page
  • [ ] Impact metrics section
  • [ ] Featured case studies
  • [ ] Additional navigation pages

Phase 3: Dynamic Content

  • [ ] BFF integration for solution site data
  • [ ] Featured products from CMS
  • [ ] Dynamic regional office links

Site-Specific Notes

  • Three pages: Home, Products, and Articles
  • Home links to 4 solution subsites via feature blocks
  • Products showcases cross-portfolio featured items
  • Articles reuses marketing app pattern

Page Layout Strategy

  • Home: Hero + Alternating FeatureGrid/FeatureGridRight (4 features)
  • Products: Hero + ProductGrid (dark-mode, 3-col)
  • Product Detail: ImageGallery + ProductInfo + Accordions (dark-mode)
  • Articles: Reuse marketing/app/articles-isr pattern

Block Sources

  • All blocks from marketing/src/uxi/blocks/
  • HeroWithBackground for hero section
  • FeatureGrid and FeatureGridRight alternate for visual interest

Branding

  • Use large logo in header (omnivoltaic is the master brand)
  • Prominent "Omnivoltaic" typography in hero
  • Solutions presented as equals (no hierarchy in grid)

Development

  • Port 3100 for local development
  • Source docs and intents should use canonical path URLs for solution links
  • Local development URLs are injected via environment overrides in the ISR suite
  • Canonical production URLs use path routing under www.omnivoltaic.com

Change Log

v4.0.0 - 2026-02-13

  • Added Products page specification (/products)
  • Added Product Detail page specification (/products/[slug])
  • Defined ProductGrid and ProductDetail block requirements (dark-mode)
  • Added Phase 1.5 milestone for products implementation
  • Updated navigation: Home → Products → Articles

v3.0.0 - 2026-01-22

  • Simplified to 2-page site: Home + Articles
  • Home page: Hero + 4 alternating feature blocks (FeatureGrid/FeatureGridRight)
  • Articles page: Reuse marketing/app/articles-isr pattern
  • Specified approved blocks from marketing/src/uxi/blocks/
  • Removed future page placeholders (deferred to Phase 2+)

v2.0.0 - 2026-01-19

  • Converted to new human-readable format
  • Now extends all-sites.md for shared configuration
  • Simplified to page intent descriptions only
  • Removed technical implementation details (belongs in code)

v1.0.0 - 2026-01-19

  • Initial design intent document created

This document is the design intent "source code" for the omnivoltaic site. Update this document to plan content changes, then implement in actual site code.