splitforms.com
Get free key
CREATIVE AGENCY · CONTACT FORM TEMPLATE

Design Agency Project Brief Form

Design agencies don't quote on 'just curious' inquiries. The project brief form captures scope, budget, and timeline — and lets prospects upload an RFP or existing brand assets so the studio can decide before the discovery call.

Get free access key Copy the code
1,000/mo free·no card·works on any host
form.htmlhtml51 lines
01<form action="https://splitforms.com/api/submit" method="POST">
02  <input type="hidden" name="access_key" value="YOUR_ACCESS_KEY">
03  <input type="hidden" name="subject" value="New design project brief">
04 
05  <label for="name">Full name *</label>
06  <input id="name" type="text" name="name" placeholder="Marcus Lim" required>
07  <label for="email">Email *</label>
08  <input id="email" type="email" name="email" placeholder="marcus@example.com" required>
09  <label for="company">Company / brand *</label>
10  <input id="company" type="text" name="company" placeholder="Acme Inc" required>
11  <label for="project_type">Project type *</label>
12  <select id="project_type" name="project_type" required>
13    <option value="">Choose…</option>
14    <option>Branding / logo</option>
15    <option>Website design</option>
16    <option>Web design + build</option>
17    <option>Illustration</option>
18    <option>Print / packaging</option>
19    <option>Pitch deck</option>
20    <option>Other</option>
21  </select>
22  <label for="budget">Budget *</label>
23  <select id="budget" name="budget" required>
24    <option value="">Choose…</option>
25    <option>&lt; $5k</option>
26    <option>$5k–$15k</option>
27    <option>$15k–$30k</option>
28    <option>$30k–$75k</option>
29    <option>$75k+</option>
30  </select>
31  <label for="timeline">Timeline *</label>
32  <select id="timeline" name="timeline" required>
33    <option value="">Choose…</option>
34    <option>ASAP / rush</option>
35    <option>1 month</option>
36    <option>2–3 months</option>
37    <option>3–6 months</option>
38    <option>Flexible</option>
39  </select>
40  <label for="brief">Project brief *</label>
41  <textarea id="brief" name="brief" placeholder="Goals, audience, references / inspiration, deliverables…" required></textarea>
42 
43  <!-- honeypot — bots fill every field -->
44  <input type="checkbox" name="botcheck" style="display:none" tabindex="-1" autocomplete="off">
45 
46  <button type="submit">Send</button>
47</form>
48 
49<p style="margin-top:12px;font-size:11px;color:#888;text-align:right">
50  Powered by <a href="https://splitforms.com" style="color:#888;text-decoration:none" target="_blank" rel="noopener">splitforms</a>
51</p>
1,000
submissions / mo, free
7
fields, ready to ship
5
code outputs
60s
from copy to inbox
Design Agency Project Brief Form — example splitforms template with submissions inbox
§ 01Why it mattersthe qualifying-fields argument

Design agencies quote 6-figure engagements for branding (identity, guidelines, deliverables across 6 months) and 5-figure engagements for web design (10-20 page marketing site). The discovery call is expensive — partners and creative directors burn an hour each. The form filters before that hour gets booked: scope (branding / web / app / packaging / multi), budget range, timeline, and an optional RFP / brief upload. Studios that ship the file-upload variant on their inquiry page report 60% drop in unqualified discovery calls. Brief uploads also let the studio do informed pre-call research — clients notice and the close rate climbs.

RFP upload (Pro) · webhooks into HoneyBook / Notion / Linear.
✦ at a glance
  • →Design project brief · 7 fields
  • →HTML, JS, React, PHP, cURL outputs
  • →One POST endpoint, no SDK
  • →Honeypot + classifier, no CAPTCHA
§ 02Live previewinteractive · sandboxed · no key required

See exactly what your visitors see — and you’ll receive.

Left: the rendered form, fully interactive in a sandboxed iframe. Right: the email and dashboard view that lands the moment a visitor submits.

preview · design-agency-contact-formlocalhost:3000
✦ what you’ll see in your inbox

Every submission becomes an email plus a dashboard row. The fields below are the exact payload your form will send. Reply-to is wired to the visitor’s email so hitting reply goes back to them.

dashboard · new submission14ms · 200 OK
SUBJECT · New design project brief
Full name
Maya Iyer
Email
maya@studio71.co
Company / brand
Studio 71
Project type
Branding / logo
Budget
$650k — $850k
Timeline
30–60 days
Project brief
—

Iframe is sandboxed — submit doesn’t actually fire. Get your access key to wire it up live.

§ 03Three steps3 steps · ~60 seconds

Generate, embed, receive.

Three actions stand between you and your first lead. None of them require a backend, a database, or a CAPTCHA library.

STEP 01GENERATE

Capture project scope

Required: project type (branding / web / app / packaging / illustration / multi), brief description, target audience, current state (greenfield / rebrand / refresh).

Create your form
key=sk_live_••••••••
STEP 02EMBED

Qualify on budget and timeline

Budget ranges ($10-25k / $25-75k / $75-150k / $150k+) and timeline (1-3 months / 3-6 months / 6+ months). Both filter mismatches before the discovery call.

snippethtml
<form action="https://splitforms.com/api/submit" method="POST">
  …
</form>
STEP 03RECEIVE

Allow RFP / brief upload

Pro file upload — clients drop in their existing RFP, brand guidelines, or competitor analysis. Pre-call research becomes possible; close rate climbs noticeably on calls where the studio walks in informed.

inbox · 1 newjust now
FROM contact@yoursite.com
New design project brief
Maya Iyer maya@studio71.co
Loved your last open house in Hayes — looking for similar with parking. Pre-approved through Wells Fargo.
§ 04Copy & ship5 languages · same endpoint

Five outputs. One backend.

HTML by default. Click open the language you ship in — every variant POSTs to the same /api/submit endpoint.

01HTMLform.html51 lines
<form action="https://splitforms.com/api/submit" method="POST">
  <input type="hidden" name="access_key" value="YOUR_ACCESS_KEY">
  <input type="hidden" name="subject" value="New design project brief">

  <label for="name">Full name *</label>
  <input id="name" type="text" name="name" placeholder="Marcus Lim" required>
  <label for="email">Email *</label>
  <input id="email" type="email" name="email" placeholder="marcus@example.com" required>
  <label for="company">Company / brand *</label>
  <input id="company" type="text" name="company" placeholder="Acme Inc" required>
  <label for="project_type">Project type *</label>
  <select id="project_type" name="project_type" required>
    <option value="">Choose…</option>
    <option>Branding / logo</option>
    <option>Website design</option>
    <option>Web design + build</option>
    <option>Illustration</option>
    <option>Print / packaging</option>
    <option>Pitch deck</option>
    <option>Other</option>
  </select>
  <label for="budget">Budget *</label>
  <select id="budget" name="budget" required>
    <option value="">Choose…</option>
    <option>&lt; $5k</option>
    <option>$5k–$15k</option>
    <option>$15k–$30k</option>
    <option>$30k–$75k</option>
    <option>$75k+</option>
  </select>
  <label for="timeline">Timeline *</label>
  <select id="timeline" name="timeline" required>
    <option value="">Choose…</option>
    <option>ASAP / rush</option>
    <option>1 month</option>
    <option>2–3 months</option>
    <option>3–6 months</option>
    <option>Flexible</option>
  </select>
  <label for="brief">Project brief *</label>
  <textarea id="brief" name="brief" placeholder="Goals, audience, references / inspiration, deliverables…" required></textarea>

  <!-- honeypot — bots fill every field -->
  <input type="checkbox" name="botcheck" style="display:none" tabindex="-1" autocomplete="off">

  <button type="submit">Send</button>
</form>

<p style="margin-top:12px;font-size:11px;color:#888;text-align:right">
  Powered by <a href="https://splitforms.com" style="color:#888;text-decoration:none" target="_blank" rel="noopener">splitforms</a>
</p>
02JavaScriptform.js67 lines
<form id="lf-form">
  <label for="name">Full name *</label>
  <input id="name" type="text" name="name" placeholder="Marcus Lim" required>
  <label for="email">Email *</label>
  <input id="email" type="email" name="email" placeholder="marcus@example.com" required>
  <label for="company">Company / brand *</label>
  <input id="company" type="text" name="company" placeholder="Acme Inc" required>
  <label for="project_type">Project type *</label>
  <select id="project_type" name="project_type" required>
    <option value="">Choose…</option>
    <option>Branding / logo</option>
    <option>Website design</option>
    <option>Web design + build</option>
    <option>Illustration</option>
    <option>Print / packaging</option>
    <option>Pitch deck</option>
    <option>Other</option>
  </select>
  <label for="budget">Budget *</label>
  <select id="budget" name="budget" required>
    <option value="">Choose…</option>
    <option>&lt; $5k</option>
    <option>$5k–$15k</option>
    <option>$15k–$30k</option>
    <option>$30k–$75k</option>
    <option>$75k+</option>
  </select>
  <label for="timeline">Timeline *</label>
  <select id="timeline" name="timeline" required>
    <option value="">Choose…</option>
    <option>ASAP / rush</option>
    <option>1 month</option>
    <option>2–3 months</option>
    <option>3–6 months</option>
    <option>Flexible</option>
  </select>
  <label for="brief">Project brief *</label>
  <textarea id="brief" name="brief" placeholder="Goals, audience, references / inspiration, deliverables…" required></textarea>
  <button type="submit">Send</button>
</form>

<p style="margin-top:12px;font-size:11px;color:#888;text-align:right">
  Powered by <a href="https://splitforms.com" style="color:#888;text-decoration:none" target="_blank" rel="noopener">splitforms</a>
</p>

<script>
  document.getElementById('lf-form').addEventListener('submit', async (e) => {
    e.preventDefault();
    const data = new FormData(e.target);
    data.set('access_key', 'YOUR_ACCESS_KEY');
    data.set('subject', 'New design project brief');

    const res = await fetch('https://splitforms.com/api/submit', {
      method: 'POST',
      body: data,
      headers: { Accept: 'application/json' },
    });

    const json = await res.json();
    if (json.success) {
      e.target.reset();
      alert('Sent!');
    } else {
      alert('Error: ' + (json.message || 'Try again'));
    }
  });
</script>
03React / Next.jsForm.tsx82 lines
'use client';

import { useState, type FormEvent } from 'react';

export default function DesignProjectBriefForm() {
  const [status, setStatus] = useState<'idle' | 'sending' | 'sent' | 'error'>('idle');

  async function onSubmit(e: FormEvent<HTMLFormElement>) {
    e.preventDefault();
    setStatus('sending');

    const data = new FormData(e.currentTarget);
    data.set('access_key', 'YOUR_ACCESS_KEY');
    data.set('subject', 'New design project brief');

    const res = await fetch('https://splitforms.com/api/submit', {
      method: 'POST',
      body: data,
      headers: { Accept: 'application/json' },
    });

    const json = await res.json();
    setStatus(json.success ? 'sent' : 'error');
    if (json.success) e.currentTarget.reset();
  }

  if (status === 'sent') return <p>Thanks — we&rsquo;ll be in touch.</p>;

  return (
    <>
    <form onSubmit={onSubmit}>
      <label htmlFor="name">Full name *</label>
      <input id="name" type="text" name="name" placeholder="Marcus Lim" required />
      <label htmlFor="email">Email *</label>
      <input id="email" type="email" name="email" placeholder="marcus@example.com" required />
      <label htmlFor="company">Company / brand *</label>
      <input id="company" type="text" name="company" placeholder="Acme Inc" required />
      <label htmlFor="project_type">Project type *</label>
      <select id="project_type" name="project_type" required>
        <option value="">Choose…</option>
        <option>Branding / logo</option>
        <option>Website design</option>
        <option>Web design + build</option>
        <option>Illustration</option>
        <option>Print / packaging</option>
        <option>Pitch deck</option>
        <option>Other</option>
      </select>
      <label htmlFor="budget">Budget *</label>
      <select id="budget" name="budget" required>
        <option value="">Choose…</option>
        <option>&lt; $5k</option>
        <option>$5k–$15k</option>
        <option>$15k–$30k</option>
        <option>$30k–$75k</option>
        <option>$75k+</option>
      </select>
      <label htmlFor="timeline">Timeline *</label>
      <select id="timeline" name="timeline" required>
        <option value="">Choose…</option>
        <option>ASAP / rush</option>
        <option>1 month</option>
        <option>2–3 months</option>
        <option>3–6 months</option>
        <option>Flexible</option>
      </select>
      <label htmlFor="brief">Project brief *</label>
      <textarea id="brief" name="brief" placeholder="Goals, audience, references / inspiration, deliverables…" required />

      <button type="submit" disabled={status === 'sending'}>
        {status === 'sending' ? 'Sending…' : 'Send'}
      </button>

      {status === 'error' && <p>Something went wrong. Try again.</p>}
    </form>

      <p style={{ marginTop: 12, fontSize: 11, color: '#888', textAlign: 'right' }}>
        Powered by <a href="https://splitforms.com" target="_blank" rel="noopener" style={{ color: '#888', textDecoration: 'none' }}>splitforms</a>
      </p>
    </>
  );
}
04PHPsubmit.php28 lines
<?php
// Drop into a PHP page. Receives a form POST and proxies it to splitforms.com.
// Useful when you want to add server-side validation or rate limiting.

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $allowed = ['name', 'email', 'company', 'project_type', 'budget', 'timeline', 'brief'];
    $payload = ['access_key' => 'YOUR_ACCESS_KEY'];
    $payload['subject'] = 'New design project brief';

    foreach ($allowed as $f) {
        if (isset($_POST[$f])) $payload[$f] = $_POST[$f];
    }

    $ch = curl_init('https://splitforms.com/api/submit');
    curl_setopt($ch, CURLOPT_POST, true);
    curl_setopt($ch, CURLOPT_POSTFIELDS, http_build_query($payload));
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    curl_setopt($ch, CURLOPT_HTTPHEADER, ['Accept: application/json']);
    $response = curl_exec($ch);
    $status   = curl_getinfo($ch, CURLINFO_HTTP_CODE);
    curl_close($ch);

    header('Content-Type: application/json');
    http_response_code($status);
    echo $response;
    exit;
}
?>
05cURLtest.sh11 lines
curl -X POST https://splitforms.com/api/submit \
  -H "Accept: application/json" \
  -d "access_key=YOUR_ACCESS_KEY" \
  -d "subject=New design project brief" \
  -d "name=Jane Builder" \
  -d "email=jane@example.com" \
  -d "company=Jane Builder" \
  -d "project_type=Branding / logo" \
  -d "budget=< $5k" \
  -d "timeline=ASAP / rush" \
  -d "brief=Hello from cURL"

Replace YOUR_ACCESS_KEY with the key from your dashboard. That’s the only edit.

§ 04bUse this template with…17 frameworks · same backend

One template. Every framework.

The same field set works on every framework splitforms supports. HTML, React, Next.js, Vue, Astro, Hugo, WordPress — same POST, same backend.

Design project brief for HTML/forms/htmlDesign project brief for Next.js/forms/nextjsDesign project brief for React/forms/reactDesign project brief for Vue/forms/vueDesign project brief for Astro/forms/astroDesign project brief for Svelte/forms/svelteDesign project brief for Webflow/forms/webflowDesign project brief for Carrd/forms/carrdDesign project brief for WordPress/forms/wordpressDesign project brief for Tailwind CSS/forms/tailwindDesign project brief for AJAX (vanilla JS)/forms/ajaxDesign project brief for Hugo/forms/hugoDesign project brief for Gatsby/forms/gatsbyDesign project brief for Eleventy/forms/eleventyDesign project brief for SvelteKit/forms/sveltekitDesign project brief for Framer/forms/framerDesign project brief for Nuxt/forms/nuxt
§ 06FAQ4 answered

Things people ask before they ship.

Direct answers, no marketing fluff. Missing one? Email hello@splitforms.com.

01Should agencies show day rates or project pricing?
Project pricing always — clients want a fixed-scope quote, not an open-ended hourly engagement. Day rates leak only on retainers and discovery sprints. The brief form captures enough scope to ground the proposal in a fixed-price range.
02Can I integrate with HoneyBook / Notion / Linear?
Yes — webhook the JSON. HoneyBook accepts inbound leads via Zapier; Notion has a database webhook receiver; Linear accepts issue creation via API. Most studios route to HoneyBook for the proposal phase, then to Notion / Linear once the project starts.
03What if the client has no budget figure yet?
Add 'I need help scoping a budget' as a budget option. These leads are slightly less qualified but still real — route to a paid scoping engagement ($2-5k for a 2-week strategy sprint that ends in a fixed-price proposal). Much better than free discovery.
04How big should the file-upload limit be?
RFPs and brand-guideline PDFs run 5-30MB. The 25MB Pro limit covers most; the 50MB 4-Year plan limit covers the rest. For larger asset libraries, capture a Dropbox / Drive link in the message field instead of asking for direct upload.
✻ ✻ ✻

Ship your design agency project brief form in 60 seconds.

1,000 free submissions per month. No credit card. Copy the snippet, paste your access key, watch leads land in your inbox.

Get free access key →Browse all 60 templates →
v0.1 · founders pricing locked in · early access open