Brand Founder Academy Demand Test Kit

The Demand Test Kit.

A drop-in that turns any page into a real demand test. A fake "Notify me" button logs every click as a signal, then a small popup catches an optional email. No checkout, no money... you're measuring who wants it, not selling it. Swap two things and it's wired.

1Swap two things

That's the whole customization. The One-Page Builder prompt does this for you automatically; this is the raw kit if you want to drop it onto a page by hand.

Swap 1 · your product

[PRODUCT]

The name of your product, everywhere the code says [PRODUCT].

Swap 2 · your color

#BRANDCOLOR

Your brand's accent HEX, on the button and the submit.

2The drop-in snippet

Paste this just before the closing </body> tag on your page. Give your real CTA button the id "atc" (or wire the button you already have to open the popup). Copy it clean:

<!-- ============================================================ -->
<!-- BFA DEMAND TEST KIT · fake-door interest capture + logging   -->
<!-- Every "Notify me" click = a demand signal; every email = a   -->
<!-- lead. No checkout, no money. Swap [PRODUCT] + #BRANDCOLOR.    -->
<!-- ============================================================ -->

<!-- 1. Static forms so Netlify detects + stores submissions.
     The inner hidden form-name input is REQUIRED for AJAX forms;
     kept off-screen with a wrapper, NOT the hidden attribute. -->
<div style="position:absolute;width:0;height:0;overflow:hidden" aria-hidden="true">
  <form name="demand-signal" data-netlify="true" netlify-honeypot="bot-field">
    <input type="hidden" name="form-name" value="demand-signal">
    <input type="text" name="bot-field">
    <input type="text" name="product"><input type="text" name="plan"><input type="text" name="page">
  </form>
  <form name="waitlist" data-netlify="true" netlify-honeypot="bot-field">
    <input type="hidden" name="form-name" value="waitlist">
    <input type="text" name="bot-field">
    <input type="email" name="email">
    <input type="text" name="product"><input type="text" name="marketing_optin">
  </form>
</div>

<!-- 2. The popup -->
<style>
  .bfa-overlay{position:fixed;inset:0;background:rgba(20,22,20,.55);backdrop-filter:blur(3px);
    display:none;align-items:center;justify-content:center;z-index:9999;padding:20px}
  .bfa-overlay.show{display:flex}
  .bfa-modal{background:#F7F5F0;border-radius:18px;max-width:440px;width:100%;padding:34px 30px 28px;
    box-shadow:0 24px 60px rgba(0,0,0,.35);position:relative;font-family:system-ui,sans-serif}
  .bfa-close{position:absolute;top:12px;right:16px;border:0;background:none;font-size:26px;color:#8B8578;cursor:pointer}
  .bfa-ey{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#BRANDCOLOR}
  .bfa-modal h3{font-size:25px;color:#2a322c;margin:8px 0 10px;line-height:1.15}
  .bfa-modal p{color:#5A6660;font-size:15px;margin-bottom:18px}
  .bfa-modal input{width:100%;border:2px solid #E4E0D6;border-radius:11px;padding:13px 14px;font-size:15px;margin-bottom:10px}
  .bfa-check{display:flex;gap:9px;align-items:flex-start;font-size:13.5px;color:#5A6660;margin:4px 0 16px;cursor:pointer}
  .bfa-submit{width:100%;border:0;border-radius:12px;background:#BRANDCOLOR;color:#fff;font-size:16px;font-weight:700;padding:15px;cursor:pointer}
  .bfa-fine{text-align:center;font-size:12px;color:#8B8578;margin-top:11px}
  .bfa-done{text-align:center;padding:14px 4px 6px;display:none}
  .bfa-priv{margin-top:10px;border-top:1px solid #E4E0D6;padding-top:10px}
  .bfa-priv summary{list-style:none;cursor:pointer;font-size:12px;text-align:center;color:#8B8578}
  .bfa-priv div{font-size:12px;line-height:1.6;color:#5A6660;margin-top:10px}
  .bfa-priv p{margin:0 0 7px;font-size:12px}
</style>
<div class="bfa-overlay" id="bfaOverlay">
  <div class="bfa-modal">
    <button class="bfa-close" id="bfaClose">&times;</button>
    <div id="bfaForm">
      <div class="bfa-ey">one honest second</div>
      <h3>We're not selling this yet.</h3>
      <p>We're seeing who actually wants [PRODUCT] before we build it. Drop your
        email and we'll tell you the day it's real... early folks may get a free one to test.</p>
      <input type="email" id="bfaEmail" placeholder="you@email.com">
      <label class="bfa-check"><input type="checkbox" id="bfaOptin">Yes... email me [PRODUCT] launch news and early access.</label>
      <button class="bfa-submit" id="bfaSubmit">Count me in</button>
      <div class="bfa-fine">We hate spam as much as you do. Launch news and early access only, never sold to anyone, and one click unsubscribes you for good.</div>
      <details class="bfa-priv">
        <summary>Read our privacy policy ... takes 30 seconds</summary>
        <div>
          <p><b>What we collect.</b> Your email address and the date you gave it to us. That's it.</p>
          <p><b>Why.</b> So we can tell you when [PRODUCT] launches.</p>
          <p><b>What we don't do.</b> We don't sell your email, rent it, trade it, or hand it to advertisers.</p>
          <p><b>How long we keep it.</b> Until you tell us to stop. If [PRODUCT] never launches, we delete the list.</p>
          <p><b>Getting out.</b> Email [YOUR BRAND GMAIL] and it's done within 7 days.</p>
          <p><b>Cookies.</b> We count page visits. No ad tracking, no profiles.</p>
        </div>
      </details>
    </div>
    <div class="bfa-done" id="bfaDone">
      <div style="font-size:40px">✅</div>
      <h3>You're on the list.</h3>
      <p>We'll reach out the moment [PRODUCT] is real. Thanks for the vote of confidence.</p>
      <button class="bfa-submit" id="bfaDoneBtn">Done</button>
    </div>
  </div>
</div>

<!-- 3. The logic: the click logs BEFORE anything else -->
<script>
(function(){
  var PRODUCT = '[PRODUCT]';   // <-- swap per brand
  var enc = function(o){return Object.keys(o).map(function(k){
    return encodeURIComponent(k)+'='+encodeURIComponent(o[k]);}).join('&');};
  var log = function(form,data){ data['form-name']=form;
    return fetch('/',{method:'POST',headers:{'Content-Type':'application/x-www-form-urlencoded'},body:enc(data)}); };
  var overlay=document.getElementById('bfaOverlay');
  var open=function(){overlay.classList.add('show');};
  var close=function(){overlay.classList.remove('show');};
  var atc=document.getElementById('atc');   // your "Notify me" button
  if(atc){ atc.addEventListener('click',function(){
    log('demand-signal',{product:PRODUCT,plan:'',page:'pdp'}).catch(function(){});   // the click IS the signal
    open();
  });}
  document.getElementById('bfaClose').addEventListener('click',close);
  overlay.addEventListener('click',function(e){if(e.target===overlay)close();});
  document.getElementById('bfaSubmit').addEventListener('click',function(){
    var email=document.getElementById('bfaEmail').value.trim();
    if(!email||email.indexOf('@')<1){document.getElementById('bfaEmail').focus();return;}
    if(!document.getElementById('bfaOptin').checked){document.getElementById('bfaOptin').focus();return;}
    log('waitlist',{ email:email,
      product:PRODUCT, marketing_optin:'yes' }).catch(function(){});
    document.getElementById('bfaForm').style.display='none';
    document.getElementById('bfaDone').style.display='block';
  });
  document.getElementById('bfaDoneBtn').addEventListener('click',close);
})();
</script>

3Put it live on Netlify (free)

Netlify hosts the page, catches every click and email, and can give it a real name later. Free to start.

1
Save one file.
Save your page as index.html. One self-contained file, never a loose folder... a folder loses its images on the way up.
2
Drop it once.
Drag that single file onto Netlify Drop to create the site. Every later change goes into the SAME site's Deploys dropzone... don't drop a new one each time.
3
Turn on form detection.
In Site settings, enable form detection... it's off by default. Then REDEPLOY once, because Netlify reads your forms at deploy time.
4
Test it like a stranger.
Open your live link, click the button, submit the popup. Check the Forms tab... you should see a demand-signal and a waitlist entry.
5
A name is optional.
The free .netlify.app address is enough to send to real people. A custom domain (about $12 a year, pointed at Netlify) is polish for later.

Why the forms are picky: each form needs data-netlify="true", an inner hidden form-name input, and a bot-field honeypot... miss the honeypot and Netlify's spam filter quietly files your emails under spam. The kit above already has all three.

Brand Founder Academy · skool.com/brandfounderacademy · waitlist and interest capture only, never a checkout.