Back to Details

fix-virality

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

/fix-virality

/fix-virality

Fix the highest priority viral growth gap.
修复优先级最高的病毒式增长短板。

What This Does

功能说明

  1. Invoke 
    /check-virality
    to audit shareability
  2. Identify highest priority gap
  3. Fix that one issue
  4. Verify the fix
  5. Report what was done
This is a fixer. It fixes one issue at a time. Run again for next issue. Use 
/virality
for full setup.
  1. 调用
    /check-virality
    审核可分享性
  2. 识别优先级最高的短板
  3. 修复该问题
  4. 验证修复效果
  5. 报告处理内容
这是一个修复工具，每次仅修复一个问题。如需处理下一个问题，请再次运行。使用
/virality
进行完整的病毒式增长设置。

Process

操作流程

1. Run Primitive

1. 运行基础技能

Invoke 
/check-virality
skill to get prioritized findings.
调用
/check-virality
技能获取按优先级排序的问题结果。

2. Fix Priority Order

2. 修复优先级顺序

Fix in this order:
  1. P0: No OG tags, no root metadata
  2. P1: Dynamic OG images, share mechanics, Twitter cards
  3. P2: Referral system, UTM tracking, share prompts
  4. P3: Launch assets, changelog
按照以下顺序修复：
  1. P0：无OG标签、无基础元数据
  2. P1：动态OG图片、分享机制、Twitter卡片
  3. P2：推荐系统、UTM追踪、分享提示
  4. P3：上线素材、更新日志

3. Execute Fix

3. 执行修复

No OG tags (P0): Add to 
app/layout.tsx
:
typescript
import type { Metadata } from 'next';

export const metadata: Metadata = {
  metadataBase: new URL(process.env.NEXT_PUBLIC_APP_URL!),
  title: {
    default: 'Your Product - Tagline',
    template: '%s | Your Product',
  },
  description: 'One sentence that makes people want to try it.',
  openGraph: {
    type: 'website',
    locale: 'en_US',
    siteName: 'Your Product',
    images: ['/og-default.png'],
  },
  twitter: {
    card: 'summary_large_image',
    creator: '@yourhandle',
  },
};
No dynamic OG images (P1):
bash
pnpm add @vercel/og
Create 
app/api/og/route.tsx
:
typescript
import { ImageResponse } from 'next/og';

export const runtime = 'edge';

export async function GET(request: Request) {
  const { searchParams } = new URL(request.url);
  const title = searchParams.get('title') ?? 'Your Product';

  return new ImageResponse(
    (
      <div style={{
        height: '100%',
        width: '100%',
        display: 'flex',
        flexDirection: 'column',
        alignItems: 'center',
        justifyContent: 'center',
        backgroundColor: '#000',
        color: '#fff',
      }}>
        <div style={{ fontSize: 60, fontWeight: 'bold' }}>{title}</div>
      </div>
    ),
    { width: 1200, height: 630 }
  );
}
No share button (P1): Create 
components/share-button.tsx
:
typescript
'use client';

import { useState } from 'react';

export function ShareButton({ url, title }: { url: string; title: string }) {
  const [copied, setCopied] = useState(false);

  const share = async () => {
    if (navigator.share) {
      await navigator.share({ url, title });
    } else {
      await navigator.clipboard.writeText(url);
      setCopied(true);
      setTimeout(() => setCopied(false), 2000);
    }
  };

  return <button onClick={share}>{copied ? 'Copied!' : 'Share'}</button>;
}
No referral system (P2): Add referral tracking to database schema and implement referral code generation.
无OG标签（P0）： 在
app/layout.tsx
中添加以下代码：
typescript
import type { Metadata } from 'next';

export const metadata: Metadata = {
  metadataBase: new URL(process.env.NEXT_PUBLIC_APP_URL!),
  title: {
    default: 'Your Product - Tagline',
    template: '%s | Your Product',
  },
  description: 'One sentence that makes people want to try it.',
  openGraph: {
    type: 'website',
    locale: 'en_US',
    siteName: 'Your Product',
    images: ['/og-default.png'],
  },
  twitter: {
    card: 'summary_large_image',
    creator: '@yourhandle',
  },
};
无动态OG图片（P1）：
bash
pnpm add @vercel/og
创建
app/api/og/route.tsx
：
typescript
import { ImageResponse } from 'next/og';

export const runtime = 'edge';

export async function GET(request: Request) {
  const { searchParams } = new URL(request.url);
  const title = searchParams.get('title') ?? 'Your Product';

  return new ImageResponse(
    (
      <div style={{
        height: '100%',
        width: '100%',
        display: 'flex',
        flexDirection: 'column',
        alignItems: 'center',
        justifyContent: 'center',
        backgroundColor: '#000',
        color: '#fff',
      }}>
        <div style={{ fontSize: 60, fontWeight: 'bold' }}>{title}</div>
      </div>
    ),
    { width: 1200, height: 630 }
  );
}
无分享按钮（P1）： 创建
components/share-button.tsx
：
typescript
'use client';

import { useState } from 'react';

export function ShareButton({ url, title }: { url: string; title: string }) {
  const [copied, setCopied] = useState(false);

  const share = async () => {
    if (navigator.share) {
      await navigator.share({ url, title });
    } else {
      await navigator.clipboard.writeText(url);
      setCopied(true);
      setTimeout(() => setCopied(false), 2000);
    }
  };

  return <button onClick={share}>{copied ? 'Copied!' : 'Share'}</button>;
}
无推荐系统（P2）： 在数据库 schema 中添加推荐追踪功能，并实现推荐码生成逻辑。

4. Verify

4. 验证修复

After fix:
bash
undefined
修复完成后：
bash
undefined

Test OG tags

测试OG标签

curl -s https://yoursite.com | grep -E "og:|twitter:" | head -10
curl -s https://yoursite.com | grep -E "og:|twitter:" | head -10

Test OG image endpoint

测试OG图片接口

curl -I "http://localhost:3000/api/og?title=Test"

Or use OG validators:
- https://www.opengraph.xyz/
- https://cards-dev.twitter.com/validator
curl -I "http://localhost:3000/api/og?title=Test"

或使用OG验证工具：
- https://www.opengraph.xyz/
- https://cards-dev.twitter.com/validator

5. Report

5. 提交报告

Fixed: [P0] No OG tags configured

Updated: app/layout.tsx
- Added metadataBase
- Added openGraph configuration
- Added Twitter card configuration

Verified: curl shows og:title, og:image, twitter:card

Next highest priority: [P1] No dynamic OG images
Run /fix-virality again to continue.
已修复：[P0] 未配置OG标签

更新文件：app/layout.tsx
- 添加了metadataBase
- 配置了openGraph
- 配置了Twitter卡片

验证结果：curl命令返回了og:title、og:image、twitter:card

下一个最高优先级问题：[P1] 无动态OG图片
再次运行/fix-virality继续修复。

Branching

分支管理

Before making changes:
bash
git checkout -b feat/virality-$(date +%Y%m%d)
修改前先创建分支：
bash
git checkout -b feat/virality-$(date +%Y%m%d)

Single-Issue Focus

单问题聚焦

Each viral feature should be tested independently. Fix one at a time:
  • Verify share previews look correct
  • Test on actual social platforms
  • Measure impact
Run 
/fix-virality
repeatedly to build shareability.
每个病毒式传播功能应独立测试，一次修复一个：
  • 验证分享预览显示正确
  • 在真实社交平台测试
  • 衡量影响效果
重复运行/fix-virality逐步提升产品的可分享性。

Related

相关技能

  • /check-virality
    - The primitive (audit only)
  • /log-virality-issues
    - Create issues without fixing
  • /virality
    - Full viral growth setup
  • /launch-strategy
    - Launch planning
  • /check-virality
    - 基础技能（仅审核）
  • /log-virality-issues
    - 仅记录问题不修复
  • /virality
    - 完整病毒式增长设置
  • /launch-strategy
    - 上线规划