Brand hierarchy, visual identity, asset deployment, platform-specific branding guidelines
Expert in Alex brand hierarchy, visual identity systems, asset deployment, and platform-specific branding guidelines.
| Level | Brand | Symbol | Usage |
|---|---|---|---|
| Parent | CorreaX | C split X mark | Footer attribution, legal |
| Product | Alex | A Negative Space Rocket | All Alex-specific assets |
| Platform | Per-heir | Logo variants | VS Code, M365, GitHub |
| Element | Value |
|---|---|
| Tagline | "Strap a Rocket to Your Back" |
| Subtitle Template | "Take Your [NOUN] to New Heights" |
| Primary Icon | $(rocket) codicon |
| Colors | Azure blue (#0078d4) + thrust orange (#ff6b35) |
| Tier | Symbol | Meaning |
|---|---|---|
| Standard | A Negative Space Rocket | Individual project acceleration |
| Premium (GK) | Space Station + Docked Rocket | Cross-project knowledge hub |
| GK Tagline | "Your MISSION CONTROL for Cross-Project Wisdom" | |
| GK Colors | Azure + orange + sync green (#00ff88) |
| Asset | Path | Purpose |
|---|---|---|
| Animated Banner | .github/assets/banner.svg | GitHub READMEs |
| Static Banner | assets/banner.png | Marketplace fallback |
| Extension Icon | platforms/vscode-extension/assets/icon.png | Marketplace icon |
| Mono Logo | platforms/vscode-extension/assets/logo-mono.svg | Activity bar |
| M365 Color | platforms/m365-copilot/appPackage/color.png | Teams color icon |
| M365 Outline | platforms/m365-copilot/appPackage/outline.png | Teams outline icon |
| Platform | Format | Key Requirement |
|---|---|---|
| GitHub | Animated SVG | 20s cycle, 10 personas, crossfade |
| VS Code Marketplace | Static PNG | icon.png (A Negative Space Rocket) |
| M365 Teams | Static PNG | color.png (192×192), outline.png (32×32) |
🚀 STRAP A ROCKET TO YOUR BACK
[Hook]
━━━ [PLATFORM] vs [PLATFORM] + ALEX ━━━
▸ Capability: Before → After
━━━ WHY ALEX? ━━━
━━━ TAKE YOUR [NOUN] TO NEW HEIGHTS ━━━
[Persona → Benefit mappings]
━━━ LAUNCH SEQUENCES ━━━
[Bottom line. Stop walking. Start flying.]
| Persona | Pain | Alex Benefit |
|---|---|---|
| Developer | Re-explaining context | Ship faster, skills remember architecture |
| Researcher | Literature scattered | Hypothesis → publication, accelerated |
| Grad Student | Thesis overwhelm | Literature review on autopilot |
| Tech Writer | Docs fall behind code | Docs that write themselves |
| DevOps | Manual infra, config drift | Same infra, every time |
| PM | Status chasing | 4-6× faster estimates |
| Content Creator | Ideas scattered | Ideas → posts in minutes |
| Heir | Compares Against | Bottom Line |
|---|---|---|
| VS Code | GitHub Copilot | "GitHub Copilot = Powerful autocomplete → + Alex = Rocket strapped to your back" |
| M365 | M365 Copilot | "M365 Copilot = Powerful AI toolbox → + Alex = Personal AI that grows with you" |
ImageMagick (preferred for complex SVG):
magick -density 200 -background none banner.svg banner.png
Sharp CLI (faster for simple SVG):
npx sharp-cli --input source.svg --output output.png -f png --density 150
| Technique | Recommendation |
|---|---|
| Gradient IDs | Use unique IDs per SVG (cxGrad, bgGrad) to avoid conflicts |
| Logo scaling | 0.75 scale renders cleanly; 0.5 can distort during PNG conversion |
| Embedding logos | Embed actual SVG paths rather than text approximations |
| Render density | Density 200 for marketplace; density 150 for previews |
| Banner dimensions | 1280×320 px for VS Code Marketplace banners |
<g transform="translate(1095, 268)">
<defs>
<linearGradient id="cxGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#0078d4"/>
<stop offset="100%" stop-color="#005a9e"/>
</linearGradient>
</defs>
<g transform="scale(0.75)">
<!-- Logo paths here -->
</g>
<text x="32" y="18" font-family="Segoe UI" font-size="12" fill="rgba(255,255,255,0.4)">CorreaX</text>
</g>