Seasonal Changes Skill

Update the Zava Seasonal Storefront dynamically based on marketing team requests for seasonal themes or special occasions.

Quick Start

cd /path/to/zava_copilot
source zava_copilot/bin/activate
python .github/skills/seasonal-changes/agent.py "Summer 2026"

What This Skill Does

1. •Selects seasonal accent color - Predefined colors that complement Zava brand
2. •Generates hero banner - Abstract, tech-forward design with seasonal accent (NO humans/text)
3. •Regenerates seasonal product images - Only the 3 featured products, with matching accent color
4. •Updates seasonal config - Hero settings, featured products, highlight categories
5. •Updates HTML - Points to new hero image
6. •Saves version backup - Automatically archives the complete storefront state

Core Workflow

Step 1: Seasonal Accent Color Selection

Predefined accent colors that complement Zava's brand colors:

Special Occasions:

Step 2: Product Selection

Based on .github/zava-brand-guide.md seasonal recommendations:

Step 3: Trend Report

Saves to: zava-storefront/data/trend-reports/{season}-{year}-trends.md

Documents:

• •Selected accent color and rationale
• •Mood and theme direction
• •Featured products and categories

Step 4: Hero Banner Generation

CRITICAL REQUIREMENTS:

• •❌ NO humans, people, faces, or athletes
• •❌ NO text, words, letters, or typography
• •✅ Abstract athletic/tech composition
• •✅ Flowing fabric textures and smart fiber mesh patterns
• •✅ Dynamic motion lines suggesting speed
• •✅ Seasonal accent color PROMINENTLY visible
• •✅ Dark left side (30%) for text overlay

The hero image uses:

• •Zava brand colors: #0A0C0C (black), #183D4C (slate), #9EC9D9 (light blue)
• •Seasonal accent color for glows, highlights, atmospheric lighting

Saves to: zava-storefront/images/hero/{season}-{year}-hero.png

Step 5: Product Image Regeneration

Only regenerates the 3 featured seasonal products with:

• •Same base product style
• •Seasonal accent color applied to product accents/highlights
• •Consistent with hero banner color scheme

Step 6: Config Update

Updates zava-storefront/data/seasonal-config.json:

{
    "season": "Summer 2026",
    "hero": {
        "backgroundImage": "images/hero/summer-2026-hero.png",
        "badge": "Summer 2026",
        "headline": "Go Ahead",
        "subheadline": "Peak performance. Unlimited potential.",
        "featuredProducts": ["Pro Performance Tee", "Endurance Cycling Shorts", "Lightweight Running Shoes"]
    },
    "highlights": {
        "title": "Summer Essentials",
        "categories": ["Tops", "Bottoms", "Footwear"]
    },
    "theme": {
        "accentColor": "#FFB347",
        "mood": "vibrant"
    }
}

Step 7: HTML Update

Automatically updates index.html to point to the new hero image.

Step 8: Version Backup

Automatically saves the complete storefront to zava-storefront/versions/{season}-{year}/:

• •index.html, styles.css, app.js
• •seasonal-config.json, products.json
• •Hero image
• •All product images
• •Trend report
• •version-info.json metadata

Manual Version Management

# Save a version manually
cd zava-storefront
python scripts/save_version.py "Winter 2026"

# List all saved versions
python -c "from scripts.save_version import list_versions; print(list_versions())"

Website CSS (Does NOT Change)

The website CSS uses consistent brand colors in :root variables:

:root {
    --zava-black: #0A0C0C;
    --zava-white: #FFFFFF;
    --zava-light-blue: #9EC9D9;
    --zava-slate: #183D4C;
}

What changes per season:

• •Hero banner image (regenerated)
• •3 seasonal product images (regenerated)
• •seasonal-config.json settings

What stays consistent:

• •All CSS colors and styles
• •Website layout and structure
• •Non-seasonal product images
• •Headline always "Go Ahead"

Trigger Phrases

• •"Update storefront for Summer"
• •"Change to Fall 2026 theme"
• •"Football season is starting"
• •"Valentine's Day campaign"
• •"Switch to winter collection"

Required Files

Inputs:

• •.github/zava-brand-guide.md - Brand guidelines
• •zava-storefront/data/products.json - Product catalog

In this skill folder:

• •agent.py - Main seasonal update script
• •image_gen.py - Image generation functions

Outputs:

• •zava-storefront/data/seasonal-config.json - Updated config
• •zava-storefront/images/hero/{season}-hero.png - New hero image
• •zava-storefront/images/products/*.png - Updated product images
• •zava-storefront/data/trend-reports/{season}-trends.md - Trend report
• •zava-storefront/versions/{season}/ - Version backup

Environment Requirements

• •Python virtual environment: source zava_copilot/bin/activate
• •Required packages: langchain, langchain-openai, azure-identity, python-dotenv
• •Azure OpenAI credentials in .env file
• •Local server for preview: python -m http.server 3000

Example Output

============================================================
SEASONAL UPDATE: Summer 2026
============================================================

✅ Step 1: Seasonal accent color: #FFB347
✅ Step 2: Selected products: Pro Performance Tee, Endurance Cycling Shorts, Lightweight Running Shoes
✅ Step 3: Trend report saved
✅ Step 4: Hero banner generated (no humans, no text, bold orange accents)
✅ Step 5: 3/3 product images regenerated with matching accent
✅ Step 6: Config updated
✅ Step 7: HTML updated
✅ Step 8: Version saved to versions/summer-2026/

Preview: http://localhost:3000