# BA006B — Final Brand Presentation & Browser Branding
## Final Brand Visibility, Logo Presentation & Browser Experience Before Production

---

# ROLE

You are the Lead Brand Integration Engineer and Lead Product Designer for INVEETAIRE.

The branding assets have already been integrated correctly.

The logo variants have already been mapped correctly.

Your responsibility is NOT to redesign the application.

Your responsibility is to deliver the FINAL visual polish of the INVEETAIRE brand before production.

This sprint focuses ONLY on brand presentation, logo visibility, browser branding, and premium visual perception.

---

# OBJECTIVES

Improve:

• Brand visibility
• Logo presentation
• Brand hierarchy
• Browser branding
• Favicon consistency
• Premium brand perception

Do NOT redesign layouts.

---

# CONTEXT

The current implementation is technically correct.

However, several branding elements still feel visually too subtle.

The brand should be immediately recognizable within the first second of viewing the application.

The user should instantly recognize INVEETAIRE as a premium wedding platform.

---

# TASK 1 — Landing Navbar Logo

Current issue:

The navbar logo is technically correct but visually too small.

Improve it by:

- Increase rendered height by approximately 40–60%.
- Preserve aspect ratio.
- Keep navbar height unchanged whenever possible.
- Improve readability from a normal desktop viewing distance.
- Maintain generous whitespace.
- Do not allow the logo to dominate the navigation.

Target visual quality:

Stripe

Notion

Linear

Vercel

The logo should look intentional, premium, and clearly visible.

It should never resemble a favicon.

---

# TASK 2 — Portal Sidebar Logos

Review:

- Couple Portal
- Admin Portal
- Crew Portal

Current issue:

Sidebar logos appear visually undersized.

Improve:

- Increase rendered width approximately 15–25%.
- Preserve padding.
- Preserve alignment.
- Preserve responsive behavior.
- Prevent overflow.
- Keep the logo visually centered.

Target:

Premium SaaS dashboard quality.

---

# TASK 3 — Landing Hero Brand Signature

Current issue:

The secondary logo above

"Premium Wedding Platform"

is too small.

It currently feels more like a watermark than a brand signature.

Improve it by:

- Increase rendered size approximately 2×.
- Preserve generous whitespace.
- Keep the logo centered.
- Use the approved Secondary Logo.
- Use the approved logo variant for the current background.
- Ensure it remains clearly secondary to the main headline.

Visual hierarchy should become:

Secondary Logo

↓

Premium Wedding Platform

↓

Modern Wedding Management Platform

The secondary logo should feel like a luxury signature.

Not a decorative icon.

---

# TASK 4 — Browser Branding

Current issue:

The favicon is not consistently visible.

Verify and fix:

- favicon.ico
- favicon-16x16
- favicon-32x32
- apple-touch-icon
- android-chrome icons
- manifest
- browser title
- theme-color

Do NOT rely only on source code.

Verify in the browser after a hard refresh.

---

# TASK 5 — Adaptive Favicon (Preferred)

If technically feasible without introducing unnecessary complexity:

Light browser theme

↓

Use:

Primary favicon

Dark browser theme

↓

Use:

Light-BG favicon variant

Implement using:

prefers-color-scheme

or another officially supported browser mechanism.

If adaptive favicon behavior is unreliable across browsers:

Keep one stable favicon.

Document the limitation.

Do NOT implement fragile hacks.

---

# TASK 6 — Browser Verification

Open and verify:

Landing

✓ Navbar logo clearly visible

✓ Secondary logo clearly visible

✓ Favicon visible

Couple Portal

✓ Sidebar logo visible

✓ Favicon visible

Admin Portal

✓ Sidebar logo visible

Crew Portal

✓ Sidebar logo visible

Authentication

✓ Logo visible

404

✓ Logo visible

500

✓ Logo visible

---

# DESIGN PRINCIPLES

The brand should communicate:

Luxury

Elegant

Premium

Modern

Confident

Minimal

The logo should never feel:

Tiny

Hidden

Blurry

Like a favicon

Like an afterthought

At the same time it must never overpower the interface.

---

# DO NOT

Do NOT redesign layouts.

Do NOT move sections.

Do NOT change typography.

Do NOT modify layout rhythm.

Do NOT modify spacing unnecessarily.

Do NOT replace branding assets.

Do NOT change approved logo variants.

Only improve brand presentation and browser branding.

---

# VISUAL ACCEPTANCE CRITERIA

Landing Navbar

✓ Logo is immediately recognizable.

✓ Logo is comfortably readable.

✓ Logo has stronger visual presence.

Landing Hero

✓ Secondary logo is clearly visible.

✓ It complements the hero.

✓ It does not compete with the headline.

Portal Sidebar

✓ Logos feel proportional.

✓ Logos no longer appear undersized.

✓ Premium SaaS appearance.

Browser

✓ favicon.ico visible

✓ favicon-16 visible

✓ favicon-32 visible

✓ Apple Touch Icon works

✓ Manifest loads

✓ Browser title correct

✓ Theme color correct

---

# DELIVERABLES

## 1. Brand Presentation Improvements

Describe every visual improvement.

Explain why each improvement enhances brand perception.

---

## 2. Browser Branding Verification

Verify:

✓ favicon.ico

✓ favicon-16x16

✓ favicon-32x32

✓ apple-touch-icon

✓ manifest

✓ browser title

✓ theme-color

---

## 3. Files Modified

List every modified file.

---

## 4. Browser Verification

Include visual confirmation that:

✓ Navbar logo visibility improved.

✓ Hero secondary logo visibility improved.

✓ Sidebar logo visibility improved.

✓ Browser favicon visible after hard refresh.

---

## 5. PHP Verification

Run:

php -l

for every modified PHP file.

---

# SUCCESS

This sprint is complete ONLY when:

✓ Navbar logo has stronger visual presence.

✓ Sidebar logos no longer appear undersized.

✓ Secondary logo has a premium visual presence.

✓ Browser favicon is visible.

✓ Browser branding is complete.

✓ No branding asset returns HTTP 404.

✓ Browser rendering matches the official INVEETAIRE brand guideline.

✓ The INVEETAIRE brand is immediately recognizable within the first second of viewing the application.

# BA006B REVISION

The previous implementation inverted the intended visual hierarchy.

Correct the logo scale as follows.

---

## Landing Navbar

Reduce the navbar logo.

Target:

Approximately 20–30% smaller than the current implementation.

The navbar logo should function only as navigation branding.

It must never become the dominant visual element.

---

## Landing Hero Secondary Logo

Increase the secondary hero logo.

Target:

Approximately 2× larger than the navbar logo.

The secondary logo should become the primary brand signature of the hero section.

It should sit comfortably above:

Premium Wedding Platform

without overpowering the main headline.

---

## Required Hierarchy

Navbar Logo

↓

Hero Secondary Logo (largest logo on page)

↓

Premium Wedding Platform

↓

Modern Wedding Management Platform

---

The hierarchy above is mandatory.

Do not invert it again.