If they respond within ${data.daysDeadline} days, you pay nothing
+
+
+
+
+
+
+
💯 100% Money-Back Guarantee
+
You only pay if ${data.recipientEmail} doesn't respond within ${data.daysDeadline} days.
+ Most people respond within 24-48 hours, so you'll likely get your full deposit back.
+
+
+
+
Why does this work?
+
This micro-deposit proves you're a real person with a genuine message, not spam. It helps ${data.recipientEmail}
+ prioritize legitimate emails while earning a small reward for managing their inbox effectively.
+
+
`
+ setDynamicMessage(newMessage)
+ } else {
+ throw new Error("Failed to fetch email details")
+ }
+ } catch (error) {
+ console.error("ERROR", error)
+ }
+ }
+
+ // Format deposit amount to avoid scientific notation and add context
+ const formatDepositAmount = amount => {
+ const numAmount = parseFloat(amount)
+
+ // Format with appropriate decimals
+ let formatted = numAmount.toFixed(8).replace(/\.?0+$/, "")
+
+ // Add context for very small amounts
+ if (numAmount <= 0.0001) {
+ const emailsPer1Cent = 0.01 / numAmount
+ if (emailsPer1Cent >= 1000) {
+ const thousands = Math.round(emailsPer1Cent / 1000)
+ return `$${formatted} (just 1¢ per ${thousands}k emails!)`
+ } else {
+ return `$${formatted} (just 1¢ per ${Math.round(emailsPer1Cent)} emails!)`
+ }
+ }
+
+ return `$${formatted}`
+ }
+
+ // Function to render the payment button or any other elements based on the blocked email details
+ function renderPaymentButton() {
+ if (blockedEmailDetails) {
+ console.log("data is here from {}", blockedEmailDetails)
+ const stripeUrl = `https://buy.stripe.com/fZe5obgilbJa5lm001?prefilled_email=${blockedEmailDetails.senderEmailRaw}&client_reference_id=${blockedEmailDetails.blockedEmailLogId}`
+
+ return (
+
+ Remember: Full refund if they respond within {blockedEmailDetails.daysDeadline} days
+
+ {isModalOpen && }
+
+ )
+ } else {
+ return (
+
+
Loading email details...
+
+ )
+ }
+ }
+
+ return (
+
+
+
+
+
+
🎯 Get Your Email to the Top of Their Inbox
+
+ Make a tiny deposit. Get immediate attention. Pay nothing if they respond.
+
+
+
+ {dynamicMessage ? (
+
+ ) : (
+
+
+
📧 Your Email Was Filtered
+
+ You're here because someone is using FynCom's email filtering system. Your message was automatically moved to a secondary folder, but you can
+ get it prioritized!
+
+
+
+
+
How This Works (It's Simple!)
+
+
+ 1
+
+ Make a tiny refundable deposit
+
This moves your email to their main inbox instantly
+
+
+
+ 2
+
+ Recipient gets notified immediately
+
Your message goes to the top of their inbox
+
+
+
+ 3
+
+ Get your full refund when they reply
+
If they respond within their deadline, you pay nothing
+
+
+
+
+
+
+
💯 100% Money-Back Guarantee
+
+ You only pay if the recipient doesn't respond within their specified timeframe. Most people respond within 24-48 hours, so you'll likely get
+ your full deposit back.
+
+
+
+
+
Why does this work?
+
+ This micro-deposit proves you're a real person with a genuine message, not spam. It helps email recipients prioritize legitimate messages while
+ earning a small reward for managing their inbox effectively.
+
+
+
+ )}
+
+ {renderPaymentButton()}
+
+
+
Why Trust This System?
+
+
+ 🔒
+ Secure Payments
+
Processed through Stripe & Nano crypto
+
+
+ ⚡
+ Instant Results
+
Your email moves to their inbox immediately
+
+
+ 💰
+ Fair Pricing
+
Tiny amounts that prove you're real
+
+
+
+
+
+
💡 Like This Idea?
+
+ Tired of spam in your own inbox? You can use this same system! Sign up at app.fyncom.com to
+ filter your emails and earn rewards when genuine senders reach out to you.
+
+
+
+
+
Why Do Spam Calls & Emails Still Exist?
+
We asked ourselves this question and built a solution. Here's how we're fixing communication for everyone.
+
+ Our approach creates trust between strangers with shared interests using tiny "proof-of-intent" deposits. Read our original white paper that became{" "}
+ our first patent, powers our KarmaCall app, and
+ forms the foundation of FynCom.
+
+
+
+
+
+
+ )
+}
+
+export default MakeADepositV1
diff --git a/src/pages/make-a-deposit-v2.js b/src/pages/make-a-deposit-v2.js
new file mode 100644
index 0000000..b4b3226
--- /dev/null
+++ b/src/pages/make-a-deposit-v2.js
@@ -0,0 +1,314 @@
+import React, { useEffect, useMemo, useState } from "react"
+import Header from "../components/header"
+import Footer from "../components/footer"
+import Seo from "../components/seo"
+import "../components/blocked-email.css"
+import { MakeADepositModal } from "../components/Modal"
+import { logEvent } from "../utils/analytics"
+
+/**
+ * MakeADepositV2 – a UX-focused redesign for your refundable deposit page.
+ *
+ * Highlights
+ * - Clear hero + promise
+ * - Smart empty-state (no backend data) with explainer + self-serve input
+ * - Data-present state with rich summary, trust copy, and strong CTAs
+ * - Inline FAQ and "How it works" with visual steps
+ * - Subtle motion + modern card layout
+ * - Handles loading, error, and edge cases
+ */
+
+const API_URL = process.env.GATSBY_API_URL
+
+export default function MakeADepositV2() {
+ const [details, setDetails] = useState(null)
+ const [loading, setLoading] = useState(true)
+ const [error, setError] = useState(null)
+ const [isModalOpen, setIsModalOpen] = useState(false)
+ const [manualId, setManualId] = useState("")
+
+ // Parse depositId from URL on first load
+ useEffect(() => {
+ const search = new URLSearchParams(window.location.search)
+ const id = search.get("depositId")
+ if (id) fetchDetails(id)
+ else setLoading(false)
+ }, [])
+
+ async function fetchDetails(id) {
+ try {
+ setLoading(true)
+ const res = await fetch(`${API_URL}email/blocked/${id}`)
+ if (!res.ok) throw new Error("Failed to fetch deposit details")
+ const data = await res.json()
+ setDetails(data)
+ setError(null)
+ } catch (e) {
+ setError(e?.message ?? "Something went wrong")
+ setDetails(null)
+ } finally {
+ setLoading(false)
+ }
+ }
+
+ const stripeUrl = useMemo(() => {
+ if (!details) return "https://buy.stripe.com/fZe5obgilbJa5lm001" // default checkout
+ const email = encodeURIComponent(details.senderEmailRaw || details.senderEmail || "")
+ const ref = encodeURIComponent(details.blockedEmailLogId || "")
+ return `https://buy.stripe.com/fZe5obgilbJa5lm001?prefilled_email=${email}&client_reference_id=${ref}`
+ }, [details])
+
+ const minDeposit = details?.recipientMin
+ ? Number(details.recipientMin) >= 0.01
+ ? Number(details.recipientMin).toFixed(2)
+ : Number(details.recipientMin).toFixed(5)
+ : "0.00"
+ const deadlineDays = details?.daysDeadline ?? 30
+ const labelName = details?.labelName || "INBOX"
+ const secondaryLabel = details?.emailLabel || "FynFiltered"
+
+ function handleNano() {
+ setIsModalOpen(true)
+ }
+
+ return (
+
+
+
+
+
+
+ 🎯 Get your email noticed with a refundable deposit
+
+
+ Unknown senders stake a tiny deposit to reach the main inbox. If the recipient engages, the sender gets it back. If not, the user keeps it. Simple.
+
+ Tired of spam in your own inbox? You can use this same system! Sign up at app.fyncom.com to
+ filter your emails and earn rewards when genuine senders reach out to you.
+
+
+
+
+
FAQ
+
+
+ Do I lose money if they never read it?
+
+ If there's no response in the refund window, the recipient keeps a portion of the deposit as a reward for their time.
+
+
+
+ What if I'm an approved contact?
+
Known contacts are automatically whitelisted—no deposit needed.
+
+
+ Is this secure?
+
Deposits are processed through trusted providers, and refunds are automatic based on recipient engagement.
+
+
+
+
+
+
+ )
+}
diff --git a/src/pages/make-a-deposit-v3.js b/src/pages/make-a-deposit-v3.js
new file mode 100644
index 0000000..4230eb0
--- /dev/null
+++ b/src/pages/make-a-deposit-v3.js
@@ -0,0 +1,298 @@
+import React, { useState, useEffect } from "react"
+import Header from "../components/header"
+import Footer from "../components/footer"
+import "../components/white-paper.css"
+import "../components/blocked-email.css"
+import "../components/contact.css"
+import "../components/make-a-deposit-v3.css"
+import { useLocation } from "@reach/router"
+import whitePaper from "../../static/pdfs/fyncom-Original-White-Paper-For-KarmaCall-Update.pdf"
+import Seo from "../components/seo"
+import PdfContent from "../components/PdfContent"
+import { MakeADepositModal } from "../components/Modal"
+import { logEvent } from "../utils/analytics"
+
+const STRIPE_CHECKOUT_URL = "https://buy.stripe.com/fZe5obgilbJa5lm001"
+
+const MakeADepositV3 = () => {
+ const [blockedEmailDetails, setBlockedEmailDetails] = useState(null)
+ const location = useLocation()
+ const [dynamicMessage, setDynamicMessage] = useState(
+ `
You're here because someone you're emailing protects their inbox with FynCom refundable deposits.
+
Send a quick, fully refundable deposit to fast-track your note into their main inbox. When they reply, every cent comes right back to you.
Thanks for sending the $${data.recipientMin} deposit for ${data.recipientEmail}.
+
We're alerting them now so they can reply and release your refund. You can manage everything inside app.fyncom.com.
`
+
+ const invitationMessage = `
Your message from ${senderEmail} is ready for ${data.recipientEmail}, but it's waiting in ${secondaryLabel}.
+
Send a fully refundable $${data.recipientMin} deposit to move it to their main inbox with a verified ${fynMail} badge. If they reply within ${data.daysDeadline} days, the funds return to you instantly.
+ Ever wonder why spam persists? Our original whitepaper breaks down the incentives and shows how refundable deposits make legitimate outreach win.
+ Take a peek and imagine this framework inside your own product.
+
+
+
+
+
+
+ )
+}
+
+export default MakeADepositV3
diff --git a/src/pages/make-a-deposit.js b/src/pages/make-a-deposit.js
index 2d72350..b566eb7 100644
--- a/src/pages/make-a-deposit.js
+++ b/src/pages/make-a-deposit.js
@@ -1,149 +1,71 @@
import React, { useState, useEffect } from "react"
-import Header from "../components/header"
-import Footer from "../components/footer"
-import "../components/white-paper.css"
-import "../components/blocked-email.css"
-import "../components/contact.css"
import { useLocation } from "@reach/router"
-import whitePaper from "../../static/pdfs/fyncom-Original-White-Paper-For-KarmaCall-Update.pdf"
-import Seo from "../components/seo"
-import PdfContent from "../components/PdfContent"
-import { MakeADepositModal } from "../components/Modal"
import { logEvent } from "../utils/analytics"
+// Import the three variant components
+import MakeADepositV1 from "./make-a-deposit-v1"
+import MakeADepositV2 from "./make-a-deposit-v2"
+import MakeADepositV3 from "./make-a-deposit-v3"
+
+/**
+ * MakeADeposit - A/B/C Test Router
+ *
+ * This component routes users to one of three design variants based on their depositId.
+ * The same depositId will always see the same variant for consistency.
+ *
+ * Variants:
+ * - A: Original design (make-a-deposit-v1.js) - Current production design
+ * - B: UX-focused redesign (make-a-deposit-v2.js) - Modern card layout with FAQ
+ * - C: Premium design (make-a-deposit-v3.js) - From makeADeposit-Codex-nice branch
+ */
+
const MakeADeposit = () => {
- const [blockedEmailDetails, setBlockedEmailDetails] = useState(null)
const location = useLocation()
- const [dynamicMessage, setDynamicMessage] = useState("You're seeing this because you've gotten a \"PayCation\" email.")
- const [isModalOpen, setIsModalOpen] = useState(false)
- const [urlToExecute, setUrlToExecute] = useState(null)
- const [stripeUrl, setStripeUrl] = useState("")
+ const [variant, setVariant] = useState(null)
- const toggleModal = () => {
- setIsModalOpen(!isModalOpen)
- logEvent("Deposit", "Toggle Nano Deposit Modal", isModalOpen ? "Close" : "Open")
+ // Simple hash function to consistently assign variant based on depositId
+ const getVariantFromDepositId = (depositId) => {
+ if (!depositId) return 'A' // default variant for no depositId
+
+ // Simple hash: sum character codes
+ let hash = 0
+ for (let i = 0; i < depositId.length; i++) {
+ hash = ((hash << 5) - hash) + depositId.charCodeAt(i)
+ hash = hash & hash // Convert to 32-bit integer
+ }
+
+ // Map to variant A, B, or C
+ const variantIndex = Math.abs(hash) % 3
+ const variants = ['A', 'B', 'C']
+ return variants[variantIndex]
}
useEffect(() => {
const searchParams = new URLSearchParams(location.search)
const blockedEmailId = searchParams.get("depositId")
- console.log("deposit ID is %s", blockedEmailId)
- if (blockedEmailId) {
- getBlockedEmailDetails(blockedEmailId)
- }
- }, [location])
- useEffect(() => {
- if (urlToExecute) {
- window.location.href = urlToExecute
- }
- }, [urlToExecute])
+ // Determine variant based on depositId
+ const assignedVariant = getVariantFromDepositId(blockedEmailId)
+ setVariant(assignedVariant)
+ console.log("Assigned variant:", assignedVariant, "for depositId:", blockedEmailId)
- const getBlockedEmailDetails = async blockedEmailId => {
- let newUrl = `${process.env.GATSBY_API_URL}email/blocked/${blockedEmailId}`
- try {
- const response = await fetch(newUrl, {
- method: "GET",
- headers: {
- "Content-Type": "application/json",
- Accept: "application/json",
- },
- })
+ // Log variant assignment for analytics
+ logEvent("AB Test", "Variant Assigned", assignedVariant)
+ }, [location])
- if (response.ok) {
- const data = await response.json()
- const depositPaid = data.depositPaid
- console.log("deposit paid status: " + depositPaid)
- const secondaryLabel = data.emailLabel ? data.emailLabel : "FynFiltered"
- const fynMail = "FynMail"
- if (depositPaid) {
- // provide extra info - we'll handle this later as it's an edge case for now
- }
- setBlockedEmailDetails(data) // Update the state, which will re-render the component
- const newMessage = data.depositPaid
- ? `Thank you for your $${data.recipientMin} deposit... [rest of the message]`
- : `
Your email (${data.senderEmail}) to ${data.recipientEmail} landed in their
- ${data.labelName}, but was moved to a secondary inbox, ${secondaryLabel},
- because they don't know you.
-
-
${data.recipientEmail} requires a $${data.recipientMin}
- refundable deposit for your email to move to their main inbox and be marked as ${fynMail}. If you pay
- this deposit, ${data.recipientEmail} will be notified and they will immediately see your email. If
- ${data.recipientEmail} responds to your FynMail within ${data.daysDeadline} days,
- you will get your deposit back. Then you may manage your deposit refund by accessing app.fyncom.com.
-
`
- setDynamicMessage(newMessage)
- } else {
- throw new Error("Failed to fetch email details")
- }
- } catch (error) {
- console.error("ERROR", error)
- }
+ // Show nothing until variant is determined
+ if (!variant) {
+ return null
}
- // Function to render the payment button or any other elements based on the blocked email details
- function renderPaymentButton() {
- if (blockedEmailDetails) {
- console.log("data is here from {}", blockedEmailDetails)
- // Render your button and use the details from blockedEmailDetails
- const stripeUrl = `https://buy.stripe.com/fZe5obgilbJa5lm001?prefilled_email=${blockedEmailDetails.senderEmailRaw}&client_reference_id=${blockedEmailDetails.blockedEmailLogId}`
- // todo - only use this if you plan to show a button to everyone that visits this page.
- const stripeUrlDefault = `https://buy.stripe.com/fZe5obgilbJa5lm001`
- return (
- <>
- logEvent("Deposit", "Click", "Stripe Deposit")}
- >
- Deposit cash
-
-
- {isModalOpen && }
-
- )
- } else {
- console.log("no data present")
- }
+ // Render the appropriate variant
+ if (variant === 'A') {
+ return
+ } else if (variant === 'B') {
+ return
+ } else {
+ return
}
-
- return (
-
-
-
-
-
Get Your Email Noticed. Make a Deposit.
-
- Pay a small, refundable deposit to get your email to my main inbox & get my immediate attention. If I respond, you get your deposit back. Simple!
-
-
- {renderPaymentButton()}
-
- Still here? Why not read something interesting? Ever get annoying calls? Emails? DMs? Read below to find out how we're helping fix that problem by
- getting people paid to block scam / spam and respond to good messages.
-
-
Why Do Spam Calls Still Exist?
-
...and how can I stop scams, but get useful outreach?
-
- That's the thought that started FynCom on a journey of exploring an emerging market based in "communications + currency" to create trust between
- strangers with shared interests. Here's our paper we wrote to record our thought process - it later became{" "}
- our 1st patent, app, and is the basis for how we
- came to be. Thanks for reading!
- - Team FynCom
-