@rubytech/create-maxy-code 0.1.167 → 0.1.170

package/payload/platform/plugins/venture-studio/skills/zero-to-prototype/references/mom-test.md

@@ -1,193 +0,0 @@
-# The Mom Test
-
-## Purpose
-Extract truth from customer conversations by asking questions that even your mom can't lie to you about, avoiding the false positives that kill startups.
-
-## When to Use
-- Conducting customer discovery conversations
-- Validating problem and solution hypotheses
-- Gathering requirements from potential customers
-- Avoiding "false positive" feedback that feels good but isn't true
-- Learning what customers actually do, not what they say they'd do
-
-## Process
-
-### 1. The Three Rules
-
-Three simple rules for crafting good questions:
-
-1. **Talk about their life instead of your idea**
-2. **Ask about specifics in the past instead of generics or opinions about the future**
-3. **Talk less and listen more**
-
-### 2. Good Questions vs. Bad Questions
-
-**BAD: "Do you think it's a good idea?"**
-- Only the market can tell if your idea is good—all else is opinion
-- FIX: "How do you currently handle X? What have you tried?"
-
-**BAD: "Would you buy a product that does X?"**
-- Hypothetical future promises from optimistic people
-- FIX: "How much do you currently spend on solving this?"
-
-**BAD: "How much would you pay for X?"**
-- Numbers feel rigorous but are still hypothetical
-- FIX: "What does this problem cost you now? What's your budget for this?"
-
-**SORT-OF-OKAY: "What would your dream product do?"**
-- Good as setup, bad if you stop there
-- FIX: "Why do you want those features? What would they let you do?"
-
-**GOOD: "Why do you bother?"**
-- Gets from perceived problem to real one
-- Reveals the job-to-be-done behind the stated need
-
-**GOOD: "What are the implications of that?"**
-- Distinguishes must-solve from nice-to-have
-- Reveals if problems have costly implications or don't actually matter
-
-**GOOD: "Talk me through the last time that happened."**
-- Specific past events reveal truth; hypotheticals invite lies
-- Shows actual workflow, tools used, time spent
-
-**GOOD: "What else have you tried?"**
-- If they haven't looked for solutions, they won't look for yours
-- Reveals how motivated they actually are
-
-**GOOD: "Who else should I talk to?"**
-- End every conversation this way
-- If they won't intro you, either you screwed up or they don't care
-
-### 3. Avoid the Three Types of Bad Data
-
-**1. Compliments**
-- "That's so cool!" "I love it!" "Great idea!"
-- Worthless because people lie to be nice
-- DEFLECT: "Thanks! How are you dealing with this currently?"
-
-**2. Fluff (Generics, Hypotheticals, Future)**
-- "I usually..." "I always..." "I would definitely..."
-- Generic claims describe who they want to be, not who they are
-- ANCHOR: "When's the last time that happened? Walk me through it."
-
-**3. Ideas**
-- "You should add..." "What if it also..."
-- Feature requests aren't validation
-- DIG: "Why do you want that? How are you coping without it?"
-
-### 4. Deflecting and Anchoring Techniques
-
-**When you receive a compliment:**
-> Them: "That's a great idea!"
-> You: "Thanks! How are you solving this problem today?"
-
-**When you receive fluff:**
-> Them: "I would definitely use that!"
-> You: "Tell me about the last time this came up—what did you do?"
-
-**When you receive an idea:**
-> Them: "You should add a reporting feature."
-> You: "Interesting—what would you do with the reports?"
-
-**When you slip into pitch mode:**
-> You: "Whoops—I got excited and started pitching. How are you handling this currently?"
-
-### 5. The Currencies of Conversation
-
-Words are cheap. Track commitment through "currencies":
-
-| Currency | Low Value | High Value |
-|----------|-----------|------------|
-| **Time** | "Let's chat sometime" | Schedules specific meeting |
-| **Reputation** | "I might share this" | Introduces you to colleague |
-| **Money** | "I would pay for that" | Pre-order or deposit |
-| **Effort** | "Send me info" | Tries your prototype |
-
-**Rule:** Advancement = they give you something valuable (time, intro, money, effort)
-
-### 6. Signs You're Failing the Mom Test
-
-In the meeting:
-- You're talking more than they are
-- You're defending your idea
-- They're complimenting you
-
-Back at the office:
-- "That meeting went really well"
-- "Everyone I talk to loves the idea"
-- "We're getting a lot of positive feedback"
-
-**These are warning signs.** Get specific: Why did they love it? What exactly would they use it for? What are they doing about this today?
-
-### 7. The Process
-
-**Before conversations:**
-- Decide your 3 biggest learning goals
-- Know what commitment/next step you'll push for
-- Do desk research first (don't waste their time on Googleable questions)
-
-**During conversations:**
-- Frame it (vision, where you're at, how they can help)
-- Keep it casual (not an interrogation)
-- Ask good questions, deflect compliments, anchor fluff
-- Take notes with symbols (☇ pain, $ money, ☆ follow-up)
-- Push for commitment at the end
-
-**After conversations:**
-- Review notes with your team
-- Update beliefs and plans
-- Decide next 3 big questions
-
-### 8. Synthesis
-
-After your conversation, ask:
-- Did I learn facts or collect opinions?
-- Did they give up something valuable (time, reputation, money)?
-- Would I bet money on what I learned?
-- What do I need to learn next?
-
-## Example
-
-**Idea**: "App that helps remote workers find great cafés to work from"
-
-### Bad Conversation (Fails the Mom Test)
-
-You: "I'm building an app to help remote workers find cafés. Would you use it?"
-Them: "Yeah, that sounds useful!"
-You: "What features would you want?"
-Them: "Maybe ratings for WiFi quality? And photos of the space?"
-You: "Great! Do you think $5/month is reasonable?"
-Them: "Sure, I'd pay that."
-
-**What you learned:** Nothing useful. All fluff and hypotheticals.
-
-### Good Conversation (Passes the Mom Test)
-
-You: "Tell me about the last time you worked from a café—how did you find it?"
-
-Them: "I usually just go to the same Starbucks near my house."
-
-You: "Have you ever tried finding a new place? Walk me through what happened."
-
-Them: "Yeah, last month I wanted somewhere quieter. I Googled 'cafés with WiFi' and checked Yelp reviews."
-
-You: "How did that work out?"
-
-Them: "It was okay. The reviews didn't mention WiFi speed, so I had to guess. One place had no outlets."
-
-You: "How often do you look for new places?"
-
-Them: "Honestly? Maybe once every few months. I mostly stick to what I know."
-
-You: "What would make you try new places more often?"
-
-Them: "I guess if I knew for sure the WiFi would be good. But honestly, reliability matters more than variety."
-
-**What you learned:**
-- They use existing tools (Google, Yelp) - you're competing with free
-- WiFi reliability is the key pain (outlets mentioned too)
-- Low frequency of need (monthly at best)
-- Inertia is strong - they prefer familiar places
-- This might not be a big enough pain to pay for
-
-**Insight:** The problem exists but may not be severe enough to build a business around. The frequency is low and existing free tools partially solve it. Need to find users who need this more frequently (digital nomads? traveling salespeople?) or test whether someone would actually pay before building.

package/payload/platform/plugins/venture-studio/skills/zero-to-prototype/references/mvp-types.md

@@ -1,200 +0,0 @@
-# MVP Types
-
-## Purpose
-Choose the right type of Minimum Viable Product to test your riskiest assumption with the least effort, learning what you need before building what you don't.
-
-## When to Use
-- Ready to test a business hypothesis but unsure how to start
-- Want to validate demand before building the full product
-- Need to choose between different approaches to testing
-- Have limited resources and need maximum learning per dollar
-- Deciding what to build first
-
-## Process
-
-### 1. Identify Your Riskiest Assumption
-
-Before choosing an MVP type, clarify what you're testing:
-
-**Common Riskiest Assumptions:**
-- Will customers pay for this? (Value hypothesis)
-- Can we acquire customers cost-effectively? (Growth hypothesis)
-- Can we actually build this? (Technical feasibility)
-- Will customers use this repeatedly? (Retention hypothesis)
-- Will customers recommend this? (Viral hypothesis)
-
-The MVP type should be chosen to test your RISKIEST assumption with MINIMUM effort.
-
-### 2. MVP Type Selection Matrix
-
-| MVP Type | Best For Testing | Effort Level | Time to Learn |
-|----------|------------------|--------------|---------------|
-| Landing Page | Demand, messaging, pricing | Very Low | Days |
-| Video/Demo | Demand, concept comprehension | Low | Days-Weeks |
-| Concierge | Value delivery, workflow | Medium | Weeks |
-| Wizard of Oz | Value delivery at scale | Medium-High | Weeks |
-| Piecemeal | Full workflow without code | Medium | Weeks |
-| Single-Feature | Core value proposition | High | Months |
-| Smoke Test | Demand for specific feature | Very Low | Days |
-
-### 3. MVP Types Explained
-
-**Landing Page MVP**
-- **What:** Marketing page describing the product with signup/pre-order
-- **Tests:** Is there demand? Does the value prop resonate? Will they pay?
-- **Process:** Create page → Drive traffic → Measure conversions
-- **Success Metric:** Signup rate, pre-orders, email captures
-- **Example:** Buffer started with a landing page describing the service and pricing before writing any code
-
-**Video/Demo MVP**
-- **What:** Explainer video showing how the product would work
-- **Tests:** Do people understand and want this? Can we explain it simply?
-- **Process:** Create video → Share with target audience → Measure engagement
-- **Success Metric:** Shares, signups, comments
-- **Example:** Dropbox's explainer video drove waiting list from 5,000 to 75,000
-
-**Concierge MVP**
-- **What:** Manually deliver the value to a small number of customers
-- **Tests:** Does our solution actually solve the problem? What's the real workflow?
-- **Process:** Find 1-5 customers → Deliver value by hand → Learn and iterate
-- **Success Metric:** Customer satisfaction, willingness to pay, retention
-- **Example:** Food on the Table founder personally planned meals and shopped with his first customer
-
-**Wizard of Oz MVP**
-- **What:** Looks automated to users, but humans do the work behind the scenes
-- **Tests:** Will the solution work at scale? What does "good" look like?
-- **Process:** Build interface → Manually fulfill requests → Iterate on experience
-- **Success Metric:** User behavior, satisfaction, unit economics hints
-- **Example:** Aardvark (acquired by Google) had humans answer questions before building AI
-
-**Piecemeal MVP**
-- **What:** Combine existing tools to deliver value without building
-- **Tests:** Full workflow, integration points, customer acceptance
-- **Process:** String together Typeform + Zapier + Airtable + Stripe
-- **Success Metric:** Completion rates, customer satisfaction, revenue
-- **Example:** Early marketplaces using Google Forms + manual matching + PayPal
-
-**Single-Feature MVP**
-- **What:** Build one core feature exceptionally well
-- **Tests:** Core value hypothesis with real product
-- **Process:** Build the ONE thing that matters most → Ship → Measure
-- **Success Metric:** Usage, retention, satisfaction
-- **Example:** Twitter launched with just "post 140 characters" - nothing else
-
-**Smoke Test (Fake Door)**
-- **What:** Button/link for a feature that doesn't exist, measuring interest
-- **Tests:** Would people want this feature?
-- **Process:** Add button → Track clicks → Show "coming soon" message
-- **Success Metric:** Click-through rate vs. baseline
-- **Example:** Amazon reportedly tested categories by adding links before building fulfillment
-
-### 4. Choosing Your MVP Type
-
-**If you need to test DEMAND:**
-→ Landing Page MVP (fastest, cheapest)
-→ Video MVP (if concept needs demonstration)
-
-**If you need to test VALUE DELIVERY:**
-→ Concierge MVP (for complex services)
-→ Wizard of Oz MVP (for tech products)
-→ Piecemeal MVP (for workflow-heavy products)
-
-**If you need to test TECHNICAL FEASIBILITY:**
-→ Single-Feature MVP (must actually build)
-→ Prototype/Demo (to prove it's possible)
-
-**If you need to test WILLINGNESS TO PAY:**
-→ Landing Page with pricing tiers
-→ Concierge with actual invoicing
-→ Pre-orders with real money
-
-### 5. MVP Design Principles
-
-**Remove everything that doesn't test your hypothesis:**
-- Feature X doesn't matter for this test? Remove it.
-- Visual design doesn't affect the hypothesis? Use templates.
-- Account system not needed for test? Skip it.
-
-**Set clear success criteria BEFORE launching:**
-- "Success = 100 signups in 2 weeks"
-- "Success = 3 out of 5 concierge customers paying"
-- "Success = 20% click-through on feature interest"
-
-**Plan your learning questions:**
-- What will this MVP tell us?
-- What will it NOT tell us?
-- What would make us abandon this idea?
-- What would make us move forward?
-
-### 6. Common Mistakes
-
-**Building too much:** "It's not ready yet" is usually fear, not wisdom
-**Testing the wrong thing:** Cool tech demo doesn't test market demand
-**No success criteria:** "We'll know it when we see it" leads to confirmation bias
-**Ignoring the results:** "Users didn't like it, but they will eventually..."
-**Moving too fast from MVP to full build:** MVP success → more MVPs, not full product
-
-### 7. Synthesis
-
-After choosing and designing your MVP:
-- What specific hypothesis does this test?
-- What's the minimum required to run this test?
-- What would "validated" look like? What would "invalidated" look like?
-- How long until we have results?
-- What will we do with each possible outcome?
-
-## Example
-
-**Idea**: "AI-powered legal contract review for freelancers"
-
-### Riskiest Assumptions
-
-1. Freelancers actually worry about contracts (demand)
-2. They'll pay for contract review (willingness to pay)
-3. AI can provide accurate, useful feedback (technical feasibility)
-4. They'll trust AI for legal advice (adoption/trust)
-
-### MVP Selection
-
-**Riskiest assumption:** #2 - Will freelancers pay for this?
-
-(#1 can be tested through conversations; #3 and #4 matter only if #2 is true)
-
-**Selected MVP Type:** Landing Page + Concierge combo
-
-### MVP Design
-
-**Phase 1: Landing Page (1 week)**
-- Value proposition: "AI contract review for freelancers - $29 per contract"
-- Target: Freelancer communities (Reddit, Twitter, Slack groups)
-- CTA: "Upload your contract for review"
-- Success criteria: 20 uploads in 2 weeks
-
-**Phase 2: Concierge (if Phase 1 succeeds)**
-- Manually review uploaded contracts
-- Use AI tools to assist (but human reviews output)
-- Send back marked-up contract with concerns highlighted
-- Charge $29 via Stripe
-- Success criteria: 5 paid reviews in 2 weeks
-
-### Learning Questions
-
-**Phase 1 will tell us:**
-- Is there demand? (upload rate)
-- Does the value prop resonate? (which headlines work)
-- What types of contracts? (scope of problem)
-
-**Phase 1 will NOT tell us:**
-- Will they actually pay? (need Phase 2)
-- Will they come back? (need Phase 2)
-
-**Phase 2 will tell us:**
-- Will they pay? (conversion rate)
-- What's the real workflow? (manual process reveals it)
-- What makes a "good" review? (customer feedback)
-
-**Kill criteria:**
-- Phase 1: <5 uploads → Abandon
-- Phase 2: <20% conversion to paid → Pivot price or value prop
-
-**Insight:** By sequencing Landing Page → Concierge, we test demand quickly and cheaply before investing in manual delivery. If demand doesn't exist, we haven't wasted time building the service.

package/payload/platform/plugins/venture-studio/skills/zero-to-prototype/references/og-images.md

@@ -1,239 +0,0 @@
----
-name: og-images
-description: Generates Open Graph and Twitter Card images for social media sharing. Use when someone needs to create or update OG images, social media preview images, or Twitter cards. Triggers include "generate OG images", "create social images", "update twitter card", "social media previews", or when discussing meta tags for social sharing.
----
-
-# OG Image Generator
-
-This skill generates Open Graph (OG) and Twitter Card images for social media sharing using a Next.js page and Playwright screenshots.
-
-## Overview
-
-The system consists of:
-1. **OG Page** (`/app/og/page.tsx`) - A Next.js page that renders the image at exact dimensions
-2. **OG Layout** (`/app/og/layout.tsx`) - A wrapper layout for the OG route
-3. **Playwright** - Takes screenshots at the correct viewport sizes
-4. **Static Images** - Saved to `/public/` for use in meta tags
-
-## Image Formats & Dimensions
-
-| Format | Dimensions | Use Case |
-|--------|------------|----------|
-| Landscape | 1200×628 | Twitter, LinkedIn, Facebook, Open Graph |
-| Square | 1200×1200 | Instagram, general social |
-| Portrait | 1080×1350 | Instagram feed, mobile-first platforms |
-| LinkedIn Banner | 4200×700 | LinkedIn company page cover image |
-
-## Workflow
-
-### Step 1: Create/Update the OG Page
-
-The OG page at `/app/og/page.tsx` should:
-
-1. Accept a `format` query parameter (`landscape`, `square`, `portrait`)
-2. Render at exact dimensions using inline styles with min/max constraints
-3. Use the site's branding (colors, fonts, logo)
-4. Include the hero image with proper styling (rounded corners, glow/shadow)
-
-**Key styling requirements:**
-- Set explicit `width`, `height`, `minWidth`, `maxWidth`, `minHeight`, `maxHeight` on the container
-- Use `overflow: "hidden"` to prevent content overflow
-- Apply `borderRadius` and `boxShadow` directly to `<Image>` elements (not containers) when using `objectFit: "contain"`
-- For images that should fill their container, use `fill` prop with `objectFit: "cover"`
-
-**Example structure:**
-```tsx
-const dimensions: Record<Format, { width: number; height: number }> = {
-  landscape: { width: 1200, height: 628 },
-  square: { width: 1200, height: 1200 },
-  portrait: { width: 1080, height: 1350 },
-  "linkedin-banner": { width: 4200, height: 700 },
-};
-
-export default async function OGImage({
-  searchParams,
-}: {
-  searchParams: Promise<{ format?: string }>;
-}) {
-  const params = await searchParams;
-  const format = (params.format as Format) || "landscape";
-  const { width, height } = dimensions[format] || dimensions.landscape;
-
-  return (
-    <div style={{
-      width,
-      height,
-      minWidth: width,
-      maxWidth: width,
-      minHeight: height,
-      maxHeight: height,
-      display: "flex",
-      // ... rest of styles
-    }}>
-      {/* Content */}
-    </div>
-  );
-}
-```
-
-### Step 2: Create the Layout
-
-Create `/app/og/layout.tsx` to wrap the OG page:
-
-```tsx
-export default function OGLayout({ children }: { children: React.ReactNode }) {
-  return (
-    <div
-      style={{
-        margin: 0,
-        padding: 0,
-        overflow: "hidden",
-        backgroundColor: "#1a1f25",
-        minHeight: "100vh",
-      }}
-    >
-      {children}
-    </div>
-  );
-}
-```
-
-### Step 3: Hide from Search Engines
-
-Add to `/public/robots.txt`:
-```
-# Hide internal OG image generation page
-Disallow: /og
-```
-
-### Step 4: Generate Images with Playwright
-
-Run the dev server, then use Playwright to screenshot each format:
-
-```bash
-# Portrait (1080×1350)
-npx playwright screenshot --viewport-size="1080,1350" "http://localhost:3001/og?format=portrait" public/og-portrait.png
-
-# Landscape (1200×628)
-npx playwright screenshot --viewport-size="1200,628" "http://localhost:3001/og?format=landscape" public/og-landscape.png
-
-# Square (1200×1200)
-npx playwright screenshot --viewport-size="1200,1200" "http://localhost:3001/og?format=square" public/og-square.png
-
-# LinkedIn Banner (4200×700)
-npx playwright screenshot --viewport-size="4200,700" "http://localhost:3001/og?format=linkedin-banner" public/og-linkedin-banner.png
-```
-
-### Step 5: Update Meta Tags
-
-In `/app/layout.tsx`, add the OG and Twitter meta tags:
-
-```tsx
-export const metadata: Metadata = {
-  openGraph: {
-    title: "Your Title",
-    description: "Your description",
-    images: [
-      {
-        url: "/og-landscape.png",
-        width: 1200,
-        height: 628,
-        alt: "Description",
-      },
-    ],
-    type: "website",
-  },
-  twitter: {
-    card: "summary_large_image",
-    title: "Your Title",
-    description: "Your description",
-    images: ["/og-landscape.png"],
-  },
-};
-```
-
-## LinkedIn Banner Layout
-
-The LinkedIn company page cover image (4200×700) uses a split layout: the left 50% is empty space showing only the background wallpaper, and the right 50% contains all text and the company logo. This accounts for the LinkedIn profile photo and company info that overlay the left side of the banner on the LinkedIn page.
-
-**Layout principles:**
-- Use a two-column flex layout with each half at 50% width
-- Left half: empty — only the background image/wallpaper shows through
-- Right half: company logo and any text, right-aligned or centered within that half
-- Keep text minimal and large enough to read at reduced sizes (LinkedIn scales the banner down)
-- The background wallpaper should span the full 4200×700 area behind both halves
-
-**Example structure:**
-```tsx
-{format === "linkedin-banner" && (
-  <div style={{
-    width: 4200,
-    height: 700,
-    display: "flex",
-    position: "relative",
-    overflow: "hidden",
-  }}>
-    {/* Background wallpaper spanning full width */}
-    <Image src="/background.jpg" alt="" fill style={{ objectFit: "cover" }} />
-
-    {/* Left half: intentionally empty (background only) */}
-    <div style={{ width: "50%", flexShrink: 0 }} />
-
-    {/* Right half: logo and text */}
-    <div style={{
-      width: "50%",
-      display: "flex",
-      flexDirection: "column",
-      alignItems: "flex-end",
-      justifyContent: "center",
-      padding: "32px 48px",
-      position: "relative",
-      zIndex: 1,
-    }}>
-      <Image src="/logo.png" alt="Company Logo" width={120} height={120} />
-      <h1 style={{ color: "#fff", fontSize: 28, marginTop: 16 }}>Company Name</h1>
-      <p style={{ color: "#ccc", fontSize: 16 }}>Tagline goes here</p>
-    </div>
-  </div>
-)}
-```
-
-## Common Issues & Solutions
-
-### Image appears truncated
-- Use `objectFit: "contain"` instead of `"cover"`
-- Ensure container has enough height for the image
-
-### Rounded corners not visible
-- Apply `borderRadius` directly to the `<Image>` style prop, not the container
-- This is required when using `objectFit: "contain"` because the image doesn't fill the container
-
-### Shadow not visible
-- Use a colored glow (e.g., cyan) instead of pure black on dark backgrounds
-- Example: `boxShadow: "0 0 60px rgba(0, 212, 255, 0.3), 0 20px 60px rgba(0, 0, 0, 0.5)"`
-
-### Icon not filling container
-- Use `fill` prop on Next.js Image component
-- Add `position: "relative"` to container and `objectFit: "cover"` to image
-
-### Wrong dimensions in screenshot
-- Set explicit min/max constraints on the outer container
-- Use the exact viewport size in Playwright command
-
-## Regenerating Images
-
-When making changes to the OG page, always regenerate all three images:
-
-```bash
-npx playwright screenshot --viewport-size="1080,1350" "http://localhost:3001/og?format=portrait" public/og-portrait.png && \
-npx playwright screenshot --viewport-size="1200,628" "http://localhost:3001/og?format=landscape" public/og-landscape.png && \
-npx playwright screenshot --viewport-size="1200,1200" "http://localhost:3001/og?format=square" public/og-square.png && \
-npx playwright screenshot --viewport-size="4200,700" "http://localhost:3001/og?format=linkedin-banner" public/og-linkedin-banner.png
-```
-
-## Verification
-
-After generating, verify:
-1. Images exist in `/public/` with correct file sizes
-2. Dimensions are correct (use an image viewer or `file` command)
-3. Visual appearance matches design (open the files to inspect)