If we charge money, users need:

• Version info — Know what they're running, check for updates
• Attribution — Know who made it, builds trust
• Contact method — Get help when something goes wrong

These are non-negotiable for shipped products.

1. Version Display

Requirement: Visible version number that links to releases page.

Location: Footer, settings, or about section

Format:

```

v1.2.3 → links to /releases or GitHub releases

```

Implementation patterns:

```tsx

// From package.json or build-time injection

v{process.env.NEXT_PUBLIC_APP_VERSION}

```

Check for:

• [ ] Version visible somewhere in UI
• [ ] Version is dynamic (from package.json, not hardcoded)
• [ ] Version links to releases/changelog page

2. Misty Step Attribution

Requirement: "A Misty Step project" or similar, linking to MistyStep.io

Location: Footer

Format:

```

A Misty Step project → links to https://mistystep.io

```

Implementation patterns:

```tsx

href="https://mistystep.io"

target="_blank"

rel="noopener noreferrer"

className="text-muted-foreground text-sm hover:text-foreground"

>

A Misty Step project

```

Acceptable variations:

• "A Misty Step project"
• "Built by Misty Step"
• "From Misty Step"
• Misty Step logo with link

Check for:

• [ ] Attribution text/logo present
• [ ] Links to https://mistystep.io
• [ ] Opens in new tab (external link)

3. Contact/Support Link

Requirement: Way to contact for help, feedback, or issues.

Location: Footer, help menu, or settings

Format:

```

Contact | Feedback | Support → mailto:hello@mistystep.io

```

Implementation patterns:

```tsx

Contact

// Or with subject line

Feedback

```

Acceptable variations:

• "Contact"
• "Support"
• "Feedback"
• "Help"
• "Get in touch"
• Email icon with mailto link

Check for:

• [ ] Contact method visible
• [ ] Links to hello@mistystep.io (or specific product email)
• [ ] Accessible without authentication (can report issues even if logged out)

Step 1: Find Footer/Chrome Components

```bash

# Common patterns

rg -l "footer" --type tsx --type jsx

rg -l "Footer" --type tsx --type jsx

rg -l "layout" --type tsx --type jsx

# Look for version references

rg "version|VERSION" --type tsx --type jsx --type ts

# Look for mistystep references

rg -i "misty.?step" --type tsx --type jsx

```

Step 2: Check Each Requirement

For each requirement, verify:

1. Presence — Element exists in the UI
2. Functionality — Links work correctly
3. Accessibility — Visible on all pages, not hidden

Step 3: Report Findings

```markdown

| Requirement | Status | Location | Issue |

|-------------|--------|----------|-------|

| Version display | ❌ Missing | - | No version shown |

| Version links to releases | ❌ Missing | - | No releases page |

| Misty Step attribution | ✅ Present | Footer.tsx:42 | - |

| Attribution links correctly | ✅ Present | - | - |

| Contact link | ⚠️ Partial | Footer.tsx:45 | Links to Twitter, not email |

Issues to Create

1. [P1] Add version display to footer
2. [P1] Create /releases page or link to GitHub releases
3. [P1] Add contact email link (hello@mistystep.io)

```

P1 (Fundamentals) — These are baseline shipping requirements.

Products without these should not be considered "shipped" regardless of feature completeness.

Groom invokes this skill as part of Step 4 (Issue-Creator Skills):

```

/log-product-standards-issues

```

Creates issues for any missing requirements with:

• Label: domain/product-standards
• Priority: priority/p1

Minimal Footer Component

```tsx

// components/Footer.tsx

export function Footer() {

const version = process.env.NEXT_PUBLIC_APP_VERSION || 'dev'

return (

)

}

```

Inject Version at Build Time

```js

// next.config.js

const { version } = require('./package.json')

module.exports = {

env: {

NEXT_PUBLIC_APP_VERSION: version,

},

}

```

Simple Releases Page

```tsx

// app/releases/page.tsx

export default function ReleasesPage() {

return (

)

}

```

• /check-landing — Landing page audit (includes footer checks)
• /brand-builder — Establishes brand profile
• /changelog — Creates releases infrastructure