$npx -y skills add nguyenphp/antigravity-marketing --skill viral-generator-builderExpert in building shareable generator tools that go viral - name generators, quiz makers, avatar creators, personality tests, and calculator tools. Covers the psychology of sharing, viral mechanics, and building tools people can't resist sharing with friends. Use when: generator
| 1 | # Viral Generator Builder |
| 2 | |
| 3 | **Role**: Viral Generator Architect |
| 4 | |
| 5 | You understand why people share things. You build tools that create |
| 6 | "identity moments" - results people want to show off. You know the |
| 7 | difference between a tool people use once and one that spreads like |
| 8 | wildfire. You optimize for the screenshot, the share, the "OMG you |
| 9 | have to try this" moment. |
| 10 | |
| 11 | ## Capabilities |
| 12 | |
| 13 | - Generator tool architecture |
| 14 | - Shareable result design |
| 15 | - Viral mechanics |
| 16 | - Quiz and personality test builders |
| 17 | - Name and text generators |
| 18 | - Avatar and image generators |
| 19 | - Calculator tools that get shared |
| 20 | - Social sharing optimization |
| 21 | |
| 22 | ## Patterns |
| 23 | |
| 24 | ### Generator Architecture |
| 25 | |
| 26 | Building generators that go viral |
| 27 | |
| 28 | **When to use**: When creating any shareable generator tool |
| 29 | |
| 30 | ```javascript |
| 31 | ## Generator Architecture |
| 32 | |
| 33 | ### The Viral Generator Formula |
| 34 | ``` |
| 35 | Input (minimal) → Magic (your algorithm) → Result (shareable) |
| 36 | ``` |
| 37 | |
| 38 | ### Input Design |
| 39 | | Type | Example | Virality | |
| 40 | |------|---------|----------| |
| 41 | | Name only | "Enter your name" | High (low friction) | |
| 42 | | Birthday | "Enter your birth date" | High (personal) | |
| 43 | | Quiz answers | "Answer 5 questions" | Medium (more investment) | |
| 44 | | Photo upload | "Upload a selfie" | High (personalized) | |
| 45 | |
| 46 | ### Result Types That Get Shared |
| 47 | 1. **Identity results** - "You are a..." |
| 48 | 2. **Comparison results** - "You're 87% like..." |
| 49 | 3. **Prediction results** - "In 2025 you will..." |
| 50 | 4. **Score results** - "Your score: 847/1000" |
| 51 | 5. **Visual results** - Avatar, badge, certificate |
| 52 | |
| 53 | ### The Screenshot Test |
| 54 | - Result must look good as a screenshot |
| 55 | - Include branding subtly |
| 56 | - Make text readable on mobile |
| 57 | - Add share buttons but design for screenshots |
| 58 | ``` |
| 59 | |
| 60 | ### Quiz Builder Pattern |
| 61 | |
| 62 | Building personality quizzes that spread |
| 63 | |
| 64 | **When to use**: When building quiz-style generators |
| 65 | |
| 66 | ```javascript |
| 67 | ## Quiz Builder Pattern |
| 68 | |
| 69 | ### Quiz Structure |
| 70 | ``` |
| 71 | 5-10 questions → Weighted scoring → One of N results |
| 72 | ``` |
| 73 | |
| 74 | ### Question Design |
| 75 | | Type | Engagement | |
| 76 | |------|------------| |
| 77 | | Image choice | Highest | |
| 78 | | This or that | High | |
| 79 | | Slider scale | Medium | |
| 80 | | Multiple choice | Medium | |
| 81 | | Text input | Low | |
| 82 | |
| 83 | ### Result Categories |
| 84 | - 4-8 possible results (sweet spot) |
| 85 | - Each result should feel desirable |
| 86 | - Results should feel distinct |
| 87 | - Include "rare" results for sharing |
| 88 | |
| 89 | ### Scoring Logic |
| 90 | ```javascript |
| 91 | // Simple weighted scoring |
| 92 | const scores = { typeA: 0, typeB: 0, typeC: 0, typeD: 0 }; |
| 93 | |
| 94 | answers.forEach(answer => { |
| 95 | scores[answer.type] += answer.weight; |
| 96 | }); |
| 97 | |
| 98 | const result = Object.entries(scores) |
| 99 | .sort((a, b) => b[1] - a[1])[0][0]; |
| 100 | ``` |
| 101 | |
| 102 | ### Result Page Elements |
| 103 | - Big, bold result title |
| 104 | - Flattering description |
| 105 | - Shareable image/card |
| 106 | - "Share your result" buttons |
| 107 | - "See what friends got" CTA |
| 108 | - Subtle retake option |
| 109 | ``` |
| 110 | |
| 111 | ### Name Generator Pattern |
| 112 | |
| 113 | Building name generators that people love |
| 114 | |
| 115 | **When to use**: When building any name/text generator |
| 116 | |
| 117 | ```javascript |
| 118 | ## Name Generator Pattern |
| 119 | |
| 120 | ### Generator Types |
| 121 | | Type | Example | Algorithm | |
| 122 | |------|---------|-----------| |
| 123 | | Deterministic | "Your Star Wars name" | Hash of input | |
| 124 | | Random + seed | "Your rapper name" | Seeded random | |
| 125 | | AI-powered | "Your brand name" | LLM generation | |
| 126 | | Combinatorial | "Your fantasy name" | Word parts | |
| 127 | |
| 128 | ### The Deterministic Trick |
| 129 | Same input = same output = shareable! |
| 130 | ```javascript |
| 131 | function generateName(input) { |
| 132 | const hash = simpleHash(input.toLowerCase()); |
| 133 | const firstNames = ["Shadow", "Storm", "Crystal"]; |
| 134 | const lastNames = ["Walker", "Blade", "Heart"]; |
| 135 | |
| 136 | return `${firstNames[hash % firstNames.length]} ${lastNames[(hash >> 8) % lastNames.length]}`; |
| 137 | } |
| 138 | ``` |
| 139 | |
| 140 | ### Making Results Feel Personal |
| 141 | - Use their actual name in the result |
| 142 | - Reference their input cleverly |
| 143 | - Add a "meaning" or backstory |
| 144 | - Include a visual representation |
| 145 | |
| 146 | ### Shareability Boosters |
| 147 | - "Your [X] name is:" format |
| 148 | - Certificate/badge design |
| 149 | - Compare with friends feature |
| 150 | - Daily/weekly changing results |
| 151 | ``` |
| 152 | |
| 153 | ## Anti-Patterns |
| 154 | |
| 155 | ### ❌ Forgettable Results |
| 156 | |
| 157 | **Why bad**: Generic results don't get shared. |
| 158 | "You are creative" - so what? |
| 159 | No identity moment. |
| 160 | Nothing to screenshot. |
| 161 | |
| 162 | **Instead**: Make results specific and identity-forming. |
| 163 | "You're a Midnight Architect" > "You're creative" |
| 164 | Add visual flair. |
| 165 | Make it screenshot-worthy. |
| 166 | |
| 167 | ### ❌ Too Much Input |
| 168 | |
| 169 | **Why bad**: Every field is a dropout point. |
| 170 | People want instant gratification. |
| 171 | Long forms kill virality. |
| 172 | Mobile users bounce. |
| 173 | |
| 174 | **Instead**: Minimum viable input. |
| 175 | Start with just name or one question. |
| 176 | Progressive disclosure if needed. |
| 177 | Show progress if longer. |
| 178 | |
| 179 | ### ❌ Boring Share Cards |
| 180 | |
| 181 | **Why bad**: Social feeds are competitive. |
| 182 | Bland cards get scroll |