Official Application User Guide

How to Use Proofline: The Complete Beginner Guide

Welcome to the official Proofline product documentation. This guide walks you through every screen, button, workflow, and setting in your application.

1

Start Here — Beginner's Quick Orientation

Understanding what Proofline does & where to click first

What is Proofline & Why is it Useful?

Proofline is an interactive pitch proposal builder for freelancers, developers, designers, and digital agencies. Instead of emailing a static 40-page PDF proposal that prospects rarely read, Proofline lets you create a clean, mobile-responsive web link.

When prospective clients open your link, they can drag visual before/after image sliders, test live prototype code, customize their scope budget, and upload upfront deposit payment receipts directly to your bank account or payment processor.

Step 1
Log In & Open Dashboard
Access your private workspace from `/dashboard`.
Step 2
Click "+ New Pitch"
Enter your client name and project title.
Step 3
Share Link & Collect Deposit
Send the URL to your client and track opens.
2

Creating Your Account & Signing In

Google OAuth, email login & per-account data privacy

How to Register or Log In

  1. Open the Auth Page: Click "Sign In" in the top navigation bar or go to /login.
  2. Choose Method: Click "Sign in with Google" for 1-click Google OAuth authentication, or enter your registered Email and Password.
  3. Automatic Data Isolation: Proofline dynamically loads the specific data store tied to your authentic email address (e.g. `hamzasafeer110@gmail.com`). Your proposals and payment accounts are 100% isolated from any other email address.
Visual Screen Map — Auth Page (`/login`)
Sign in to Proofline
G Sign in with Google [1]
or continue with email
your.email@gmail.com [2]
Sign In [3]
[1] Google OAuth: Instantly authenticates with your Google account.
[2] Email Input: Type your exact email address here.
[3] Sign In Button: Submits authentication and opens your dashboard.
3

Understanding Your Dashboard Workspace

Main starting point, pitch status tags & pending deposit table

The Dashboard (/dashboard) is your personal command center. It displays all your active proposals, live viewer tags, and client deposit verification requests.

Visual Screen Map — Dashboard Interface (`/dashboard`)
Your Pitches [1]
+ New Pitch [2]
All (3)DraftSentOpenedPaid [3]
Acme Corp Website Redesign
Prepared for Acme Corp • Created Aug 4
OpenedEdit [4]Analytics [5]
Pending Direct Payment Requests [6]
Acme Corp ($1,750 USD)
Direct Bank Transfer • Aug 7, 2026
View ScreenshotApprove
[1] Page Title: Confirms you are viewing your active pitches workspace.
[2] + New Pitch Button: Opens the pitch creator form to generate a proposal URL.
[3] Status Filter Tabs: Filter proposals by Draft, Sent, Opened, or Paid statuses.
[4] Edit Link: Opens the pitch editor to customize proof modules and scope options.
[5] Analytics Link: Opens the engagement heatmap tracking opens and duration.
[6] Pending Deposits Table: Review uploaded client payment receipts and click Approve.
4

Creating Your First Pitch Proposal

Step-by-step pitch creator instructions (`/pitch/new`)

Step-by-Step Creator Walkthrough

  1. Click "+ New Pitch": From your dashboard, click the brass gold button in the top-right corner.
  2. Enter Client Name: Type your prospective client's name or company name (e.g. Acme Corp).
  3. Enter Project Title: Type the descriptive title of your proposal (e.g. Website Redesign & Speed Refactor).
  4. One-Line Summary (Optional): Write a short 1-sentence executive summary that appears directly under your proposal seal stamp.
  5. Select Currency: Choose USD ($), EUR (€), GBP (£), or PKR (Rs).
  6. Click "Create Pitch": The system generates your unique proposal slug (e.g. `/p/acme-corp-website-redesign`) and opens the pitch editor.
5

Building Interactive Proof Modules

Before/After Sliders, Prototype Sandboxes & Scope Calculators

Inside the Pitch Editor (/pitch/[id]/edit), you can drag and drop 4 interactive proof modules to demonstrate your capabilities:

1. Before / After Image Slider

What it does: Displays a vertical split handle contrasting legacy design/code vs. your new solution.

How to configure: Paste the Before Image URL and After Image URL, then select Image or Video media type.

2. Sandboxed Prototype Embed

What it does: Embeds a live web component URL or Figma prototype in a browser-chrome iframe sandbox.

How to configure: Paste your staging URL (e.g. `https://staging.yourdomain.com`) and optional label.

3. Scope Budget Calculator

What it does: Lets prospects toggle optional add-on deliverables (e.g. SEO Audit +$450) with live total calculation.

How to configure: Enter Base Fee (e.g. $3,500), then add toggle rows with label and delta price.

4. Direct Seller Deposit Module

What it does: Displays your direct bank, JazzCash, Easypaisa, PayPal, or Crypto deposit instructions.

How to configure: Enable deposit payment toggle and enter required deposit amount.

6

Pitch Telemetry & Heatmap Analytics

Second-by-second attention tracking (`/pitch/[id]/analytics`)

When prospective clients open your Proofline link, client-side event tracking records section visibility and duration. Click "Analytics" on any pitch card to view:

  • Total Opens: Total number of times your proposal link was opened.
  • Unique Sessions: Distinct client browsers that accessed your pitch.
  • Attention Heatmap Bar Chart: Visual breakdown of exact seconds spent per proof module (e.g. 42s on Prototype Sandbox vs. 15s on Scope Calculator).
  • Recent View Events Table: Chronological log of open events, section enters, and deposit submissions.
7

Setting Up Direct Seller Payment Accounts

0% Fee Direct Bank, JazzCash, Easypaisa, PayPal & Crypto setup

Go to /settings to configure your personal payment accounts. Proofline does not process card payments or charge 3% transaction cuts.

  1. Open Settings from your sidebar or header menu.
  2. Click "+ Add Payment Method".
  3. Select your payment type: Bank Transfer, Easypaisa, JazzCash, PayPal, or Crypto Wallet.
  4. Enter your Account Holder Name, Account Number/IBAN/Wallet Address, Bank Name, and transfer instructions.
  5. Click "Save Payment Method". Your account details will automatically be displayed inside the client deposit modal.
8

Troubleshooting Common Issues

Instant solutions for common client and editor questions

Issue: The "Create Pitch" submit button isn't working

1. Check that both Client Name and Project Title are completed.

2. Ensure your browser internet connection is active.

3. Refresh the page (Ctrl + R) and try submitting again.

Issue: I logged in with a different email, but I don't see my previous pitches

Proofline enforces strict Per-Account Multi-Tenant Data Isolation. Pitches created under `alex@proofline.app` belong strictly to Alex. Switch back to your original email account to view your saved proposals.

9

Frequently Asked Questions (FAQ)

Direct answers based on actual application functionality

How do I create my first interactive proof pitch?

Log in to your account, click the '+ New Pitch' button on your dashboard, enter your client's name and project title, then click 'Create Pitch'. You will automatically be taken to the pitch builder to add your interactive proof modules.

How do direct seller deposit payments work?

When a client clicks 'Pay Deposit' on your pitch page, they view your bank, JazzCash, Easypaisa, PayPal, or Crypto transfer instructions. They upload a screenshot receipt. You review the screenshot on your dashboard and click 'Approve Deposit' to mark the project paid.

Will clients need to create a Proofline account to view my pitch?

No. Prospective clients do not need an account or login. They simply open your 60-second interactive proposal link directly in their desktop or mobile browser.

Where can I find engagement telemetry analytics?

On your dashboard, find the pitch proposal card and click the 'Analytics' link. This opens a real-time heatmap showing total opens, unique sessions, and time spent on each proof module.

10

UI Button & Controls Context Reference

Detailed explanation of visible buttons and status controls

Button / Control LabelLocationWhat it Does
+ New PitchDashboard HeaderOpens `/pitch/new` form to create a new interactive proposal link.
EditPitch CardOpens `/pitch/[id]/edit` to drag, add, or customize proof modules.
AnalyticsPitch CardOpens `/pitch/[id]/analytics` to inspect engagement telemetry heatmaps.
Approve DepositPending Deposits TableVerifies uploaded client deposit screenshot and marks pitch status as Deposit Paid.
Pay DepositClient Pitch PageOpens seller payment instructions modal allowing clients to transfer deposits.

Ready to Build Your Pitch?

Now that you know how Proofline works, create your first interactive proposal link in under 60 seconds.

Create a New Pitch Link