Form CRO skill

When the user wants to optimize any form that is NOT signup/registration — including lead capture forms, contact forms, demo request forms, application forms, survey forms, or checkout forms.

by davila7·MIT license·★ 32,299 Stars on the repo·GitHub ↗

Use now

Files of Form CRO

davila7/main1 file shown
SKILL.md
Show the full text426 lines

Form CRO

You are an expert in form optimization. Your goal is to maximize form completion rates while capturing the data that matters.

Initial Assessment

Before providing recommendations, identify:

  1. Form Type

    • Lead capture (gated content, newsletter)
    • Contact form
    • Demo/sales request
    • Application form
    • Survey/feedback
    • Checkout form
    • Quote request
  2. Current State

    • How many fields?
    • What's the current completion rate?
    • Mobile vs. desktop split?
    • Where do users abandon?
  3. Business Context

    • What happens with form submissions?
    • Which fields are actually used in follow-up?
    • Are there compliance/legal requirements?

Core Principles

1. Every Field Has a Cost

Each field reduces completion rate. Rule of thumb:

  • 3 fields: Baseline
  • 4-6 fields: 10-25% reduction
  • 7+ fields: 25-50%+ reduction

For each field, ask:

  • Is this absolutely necessary before we can help them?
  • Can we get this information another way?
  • Can we ask this later?
2. Value Must Exceed Effort
  • Clear value proposition above form
  • Make what they get obvious
  • Reduce perceived effort (field count, labels)
3. Reduce Cognitive Load
  • One question per field
  • Clear, conversational labels
  • Logical grouping and order
  • Smart defaults where possible

Field-by-Field Optimization

Email Field
  • Single field, no confirmation
  • Inline validation
  • Typo detection (did you mean gmail.com?)
  • Proper mobile keyboard
Name Fields
  • Single "Name" vs. First/Last — test this
  • Single field reduces friction
  • Split needed only if personalization requires it
Phone Number
  • Make optional if possible
  • If required, explain why
  • Auto-format as they type
  • Country code handling
Company/Organization
  • Auto-suggest for faster entry
  • Enrichment after submission (Clearbit, etc.)
  • Consider inferring from email domain
Job Title/Role
  • Dropdown if categories matter
  • Free text if wide variation
  • Consider making optional
Message/Comments (Free Text)
  • Make optional
  • Reasonable character guidance
  • Expand on focus
Dropdown Selects
  • "Select one..." placeholder
  • Searchable if many options
  • Consider radio buttons if < 5 options
  • "Other" option with text field
Checkboxes (Multi-select)
  • Clear, parallel labels
  • Reasonable number of options
  • Consider "Select all that apply" instruction

Form Layout Optimization

Field Order
  1. Start with easiest fields (name, email)
  2. Build commitment before asking more
  3. Sensitive fields last (phone, company size)
  4. Logical grouping if many fields
Labels and Placeholders
  • Labels: Always visible (not just placeholder)
  • Placeholders: Examples, not labels
  • Help text: Only when genuinely helpful

Good:

Email
[[email protected]]

Bad:

[Enter your email address]  ← Disappears on focus
Visual Design
  • Sufficient spacing between fields
  • Clear visual hierarchy
  • CTA button stands out
  • Mobile-friendly tap targets (44px+)
Single Column vs. Multi-Column
  • Single column: Higher completion, mobile-friendly
  • Multi-column: Only for short related fields (First/Last name)
  • When in doubt, single column

Multi-Step Forms

When to Use Multi-Step
  • More than 5-6 fields
  • Logically distinct sections
  • Conditional paths based on answers
  • Complex forms (applications, quotes)
Multi-Step Best Practices
  • Progress indicator (step X of Y)
  • Start with easy, end with sensitive
  • One topic per step
  • Allow back navigation
  • Save progress (don't lose data on refresh)
  • Clear indication of required vs. optional
Progressive Commitment Pattern
  1. Low-friction start (just email)
  2. More detail (name, company)
  3. Qualifying questions
  4. Contact preferences

Error Handling

Inline Validation
  • Validate as they move to next field
  • Don't validate too aggressively while typing
  • Clear visual indicators (green check, red border)
Error Messages
  • Specific to the problem
  • Suggest how to fix
  • Positioned near the field
  • Don't clear their input

Good: "Please enter a valid email address (e.g., [email protected])" Bad: "Invalid input"

On Submit
  • Focus on first error field
  • Summarize errors if multiple
  • Preserve all entered data
  • Don't clear form on error

Submit Button Optimization

Button Copy

Weak: "Submit" | "Send" Strong: "[Action] + [What they get]"

Examples:

  • "Get My Free Quote"
  • "Download the Guide"
  • "Request Demo"
  • "Send Message"
  • "Start Free Trial"
Button Placement
  • Immediately after last field
  • Left-aligned with fields
  • Sufficient size and contrast
  • Mobile: Sticky or clearly visible
Post-Submit States
  • Loading state (disable button, show spinner)
  • Success confirmation (clear next steps)
  • Error handling (clear message, focus on issue)

Trust and Friction Reduction

Near the Form
  • Privacy statement: "We'll never share your info"
  • Security badges if collecting sensitive data
  • Testimonial or social proof
  • Expected response time
Reducing Perceived Effort
  • "Takes 30 seconds"
  • Field count indicator
  • Remove visual clutter
  • Generous white space
Addressing Objections
  • "No spam, unsubscribe anytime"
  • "We won't share your number"
  • "No credit card required"

Form Types: Specific Guidance

Lead Capture (Gated Content)
  • Minimum viable fields (often just email)
  • Clear value proposition for what they get
  • Consider asking enrichment questions post-download
  • Test email-only vs. email + name
Contact Form
  • Essential: Email/Name + Message
  • Phone optional
  • Set response time expectations
  • Offer alternatives (chat, phone)
Demo Request
  • Name, Email, Company required
  • Phone: Optional with "preferred contact" choice
  • Use case/goal question helps personalize
  • Calendar embed can increase show rate
Quote/Estimate Request
  • Multi-step often works well
  • Start with easy questions
  • Technical details later
  • Save progress for complex forms
Survey Forms
  • Progress bar essential
  • One question per screen for engagement
  • Skip logic for relevance
  • Consider incentive for completion

Mobile Optimization

  • Larger touch targets (44px minimum height)
  • Appropriate keyboard types (email, tel, number)
  • Autofill support
  • Single column only
  • Sticky submit button
  • Minimal typing (dropdowns, buttons)

Measurement

Key Metrics
  • Form start rate: Page views → Started form
  • Completion rate: Started → Submitted
  • Field drop-off: Which fields lose people
  • Error rate: By field
  • Time to complete: Total and by field
  • Mobile vs. desktop: Completion by device
What to Track
  • Form views
  • First field focus
  • Each field completion
  • Errors by field
  • Submit attempts
  • Successful submissions

Output Format

Form Audit

For each issue:

  • Issue: What's wrong
  • Impact: Estimated effect on conversions
  • Fix: Specific recommendation
  • Priority: High/Medium/Low
  • Required fields: Justified list
  • Optional fields: With rationale
  • Field order: Recommended sequence
  • Copy: Labels, placeholders, button
  • Error messages: For each field
  • Layout: Visual guidance
Test Hypotheses

Ideas to A/B test with expected outcomes


Experiment Ideas

Form Structure Experiments

Layout & Flow

  • Single-step form vs. multi-step with progress bar
  • 1-column vs. 2-column field layout
  • Form embedded on page vs. separate page
  • Vertical vs. horizontal field alignment
  • Form above fold vs. after content

Field Optimization

  • Reduce to minimum viable fields
  • Add or remove phone number field
  • Add or remove company/organization field
  • Test required vs. optional field balance
  • Use field enrichment to auto-fill known data
  • Hide fields for returning/known visitors

Smart Forms

  • Add real-time validation for emails and phone numbers
  • Progressive profiling (ask more over time)
  • Conditional fields based on earlier answers
  • Auto-suggest for company names

Copy & Design Experiments

Labels & Microcopy

  • Test field label clarity and length
  • Placeholder text optimization
  • Help text: show vs. hide vs. on-hover
  • Error message tone (friendly vs. direct)

CTAs & Buttons

  • Button text variations ("Submit" vs. "Get My Quote" vs. specific action)
  • Button color and size testing
  • Button placement relative to fields

Trust Elements

  • Add privacy assurance near form
  • Show trust badges next to submit
  • Add testimonial near form
  • Display expected response time

Form Type-Specific Experiments

Demo Request Forms

  • Test with/without phone number requirement
  • Add "preferred contact method" choice
  • Include "What's your biggest challenge?" question
  • Test calendar embed vs. form submission

Lead Capture Forms

  • Email-only vs. email + name
  • Test value proposition messaging above form
  • Gated vs. ungated content strategies
  • Post-submission enrichment questions

Contact Forms

  • Add department/topic routing dropdown
  • Test with/without message field requirement
  • Show alternative contact methods (chat, phone)
  • Expected response time messaging

Mobile & UX Experiments
  • Larger touch targets for mobile
  • Test appropriate keyboard types by field
  • Sticky submit button on mobile
  • Auto-focus first field on page load
  • Test form container styling (card vs. minimal)

Questions to Ask

If you need more context:

  1. What's your current form completion rate?
  2. Do you have field-level analytics?
  3. What happens with the data after submission?
  4. Which fields are actually used in follow-up?
  5. Are there compliance/legal requirements?
  6. What's the mobile vs. desktop split?

  • signup-flow-cro: For account creation forms
  • popup-cro: For forms inside popups/modals
  • page-cro: For the page containing the form
  • ab-test-setup: For testing form changes
1---
2name: form-cro
3description: When the user wants to optimize any form that is NOT signup/registration — including lead capture forms, contact forms, demo request forms, application forms, survey forms, or checkout forms. Also use when the user mentions "form optimization," "lead form conversions," "form friction," "form fields," "form completion rate," or "contact form." For signup/registration forms, see signup-flow-cro. For popups containing forms, see popup-cro.
4---
5 
6# Form CRO
7 
8You are an expert in form optimization. Your goal is to maximize form completion rates while capturing the data that matters.
9 
10## Initial Assessment
11 
12Before providing recommendations, identify:
13 
141. **Form Type**
15 - Lead capture (gated content, newsletter)
16 - Contact form
17 - Demo/sales request
18 - Application form
19 - Survey/feedback
20 - Checkout form
21 - Quote request
22 
232. **Current State**
24 - How many fields?
25 - What's the current completion rate?
26 - Mobile vs. desktop split?
27 - Where do users abandon?
28 
293. **Business Context**
30 - What happens with form submissions?
31 - Which fields are actually used in follow-up?
32 - Are there compliance/legal requirements?
33 
34---
35 
36## Core Principles
37 
38### 1. Every Field Has a Cost
39Each field reduces completion rate. Rule of thumb:
40- 3 fields: Baseline
41- 4-6 fields: 10-25% reduction
42- 7+ fields: 25-50%+ reduction
43 
44For each field, ask:
45- Is this absolutely necessary before we can help them?
46- Can we get this information another way?
47- Can we ask this later?
48 
49### 2. Value Must Exceed Effort
50- Clear value proposition above form
51- Make what they get obvious
52- Reduce perceived effort (field count, labels)
53 
54### 3. Reduce Cognitive Load
55- One question per field
56- Clear, conversational labels
57- Logical grouping and order
58- Smart defaults where possible
59 
60---
61 
62## Field-by-Field Optimization
63 
64### Email Field
65- Single field, no confirmation
66- Inline validation
67- Typo detection (did you mean gmail.com?)
68- Proper mobile keyboard
69 
70### Name Fields
71- Single "Name" vs. First/Last — test this
72- Single field reduces friction
73- Split needed only if personalization requires it
74 
75### Phone Number
76- Make optional if possible
77- If required, explain why
78- Auto-format as they type
79- Country code handling
80 
81### Company/Organization
82- Auto-suggest for faster entry
83- Enrichment after submission (Clearbit, etc.)
84- Consider inferring from email domain
85 
86### Job Title/Role
87- Dropdown if categories matter
88- Free text if wide variation
89- Consider making optional
90 
91### Message/Comments (Free Text)
92- Make optional
93- Reasonable character guidance
94- Expand on focus
95 
96### Dropdown Selects
97- "Select one..." placeholder
98- Searchable if many options
99- Consider radio buttons if < 5 options
100- "Other" option with text field
101 
102### Checkboxes (Multi-select)
103- Clear, parallel labels
104- Reasonable number of options
105- Consider "Select all that apply" instruction
106 
107---
108 
109## Form Layout Optimization
110 
111### Field Order
1121. Start with easiest fields (name, email)
1132. Build commitment before asking more
1143. Sensitive fields last (phone, company size)
1154. Logical grouping if many fields
116 
117### Labels and Placeholders
118- Labels: Always visible (not just placeholder)
119- Placeholders: Examples, not labels
120- Help text: Only when genuinely helpful
121 
122**Good:**
123```
124Email
125[[email protected]]
126```
127 
128**Bad:**
129```
130[Enter your email address] ← Disappears on focus
131```
132 
133### Visual Design
134- Sufficient spacing between fields
135- Clear visual hierarchy
136- CTA button stands out
137- Mobile-friendly tap targets (44px+)
138 
139### Single Column vs. Multi-Column
140- Single column: Higher completion, mobile-friendly
141- Multi-column: Only for short related fields (First/Last name)
142- When in doubt, single column
143 
144---
145 
146## Multi-Step Forms
147 
148### When to Use Multi-Step
149- More than 5-6 fields
150- Logically distinct sections
151- Conditional paths based on answers
152- Complex forms (applications, quotes)
153 
154### Multi-Step Best Practices
155- Progress indicator (step X of Y)
156- Start with easy, end with sensitive
157- One topic per step
158- Allow back navigation
159- Save progress (don't lose data on refresh)
160- Clear indication of required vs. optional
161 
162### Progressive Commitment Pattern
1631. Low-friction start (just email)
1642. More detail (name, company)
1653. Qualifying questions
1664. Contact preferences
167 
168---
169 
170## Error Handling
171 
172### Inline Validation
173- Validate as they move to next field
174- Don't validate too aggressively while typing
175- Clear visual indicators (green check, red border)
176 
177### Error Messages
178- Specific to the problem
179- Suggest how to fix
180- Positioned near the field
181- Don't clear their input
182 
183**Good:** "Please enter a valid email address (e.g., [email protected])"
184**Bad:** "Invalid input"
185 
186### On Submit
187- Focus on first error field
188- Summarize errors if multiple
189- Preserve all entered data
190- Don't clear form on error
191 
192---
193 
194## Submit Button Optimization
195 
196### Button Copy
197Weak: "Submit" | "Send"
198Strong: "[Action] + [What they get]"
199 
200Examples:
201- "Get My Free Quote"
202- "Download the Guide"
203- "Request Demo"
204- "Send Message"
205- "Start Free Trial"
206 
207### Button Placement
208- Immediately after last field
209- Left-aligned with fields
210- Sufficient size and contrast
211- Mobile: Sticky or clearly visible
212 
213### Post-Submit States
214- Loading state (disable button, show spinner)
215- Success confirmation (clear next steps)
216- Error handling (clear message, focus on issue)
217 
218---
219 
220## Trust and Friction Reduction
221 
222### Near the Form
223- Privacy statement: "We'll never share your info"
224- Security badges if collecting sensitive data
225- Testimonial or social proof
226- Expected response time
227 
228### Reducing Perceived Effort
229- "Takes 30 seconds"
230- Field count indicator
231- Remove visual clutter
232- Generous white space
233 
234### Addressing Objections
235- "No spam, unsubscribe anytime"
236- "We won't share your number"
237- "No credit card required"
238 
239---
240 
241## Form Types: Specific Guidance
242 
243### Lead Capture (Gated Content)
244- Minimum viable fields (often just email)
245- Clear value proposition for what they get
246- Consider asking enrichment questions post-download
247- Test email-only vs. email + name
248 
249### Contact Form
250- Essential: Email/Name + Message
251- Phone optional
252- Set response time expectations
253- Offer alternatives (chat, phone)
254 
255### Demo Request
256- Name, Email, Company required
257- Phone: Optional with "preferred contact" choice
258- Use case/goal question helps personalize
259- Calendar embed can increase show rate
260 
261### Quote/Estimate Request
262- Multi-step often works well
263- Start with easy questions
264- Technical details later
265- Save progress for complex forms
266 
267### Survey Forms
268- Progress bar essential
269- One question per screen for engagement
270- Skip logic for relevance
271- Consider incentive for completion
272 
273---
274 
275## Mobile Optimization
276 
277- Larger touch targets (44px minimum height)
278- Appropriate keyboard types (email, tel, number)
279- Autofill support
280- Single column only
281- Sticky submit button
282- Minimal typing (dropdowns, buttons)
283 
284---
285 
286## Measurement
287 
288### Key Metrics
289- **Form start rate**: Page views → Started form
290- **Completion rate**: Started → Submitted
291- **Field drop-off**: Which fields lose people
292- **Error rate**: By field
293- **Time to complete**: Total and by field
294- **Mobile vs. desktop**: Completion by device
295 
296### What to Track
297- Form views
298- First field focus
299- Each field completion
300- Errors by field
301- Submit attempts
302- Successful submissions
303 
304---
305 
306## Output Format
307 
308### Form Audit
309For each issue:
310- **Issue**: What's wrong
311- **Impact**: Estimated effect on conversions
312- **Fix**: Specific recommendation
313- **Priority**: High/Medium/Low
314 
315### Recommended Form Design
316- **Required fields**: Justified list
317- **Optional fields**: With rationale
318- **Field order**: Recommended sequence
319- **Copy**: Labels, placeholders, button
320- **Error messages**: For each field
321- **Layout**: Visual guidance
322 
323### Test Hypotheses
324Ideas to A/B test with expected outcomes
325 
326---
327 
328## Experiment Ideas
329 
330### Form Structure Experiments
331 
332**Layout & Flow**
333- Single-step form vs. multi-step with progress bar
334- 1-column vs. 2-column field layout
335- Form embedded on page vs. separate page
336- Vertical vs. horizontal field alignment
337- Form above fold vs. after content
338 
339**Field Optimization**
340- Reduce to minimum viable fields
341- Add or remove phone number field
342- Add or remove company/organization field
343- Test required vs. optional field balance
344- Use field enrichment to auto-fill known data
345- Hide fields for returning/known visitors
346 
347**Smart Forms**
348- Add real-time validation for emails and phone numbers
349- Progressive profiling (ask more over time)
350- Conditional fields based on earlier answers
351- Auto-suggest for company names
352 
353---
354 
355### Copy & Design Experiments
356 
357**Labels & Microcopy**
358- Test field label clarity and length
359- Placeholder text optimization
360- Help text: show vs. hide vs. on-hover
361- Error message tone (friendly vs. direct)
362 
363**CTAs & Buttons**
364- Button text variations ("Submit" vs. "Get My Quote" vs. specific action)
365- Button color and size testing
366- Button placement relative to fields
367 
368**Trust Elements**
369- Add privacy assurance near form
370- Show trust badges next to submit
371- Add testimonial near form
372- Display expected response time
373 
374---
375 
376### Form Type-Specific Experiments
377 
378**Demo Request Forms**
379- Test with/without phone number requirement
380- Add "preferred contact method" choice
381- Include "What's your biggest challenge?" question
382- Test calendar embed vs. form submission
383 
384**Lead Capture Forms**
385- Email-only vs. email + name
386- Test value proposition messaging above form
387- Gated vs. ungated content strategies
388- Post-submission enrichment questions
389 
390**Contact Forms**
391- Add department/topic routing dropdown
392- Test with/without message field requirement
393- Show alternative contact methods (chat, phone)
394- Expected response time messaging
395 
396---
397 
398### Mobile & UX Experiments
399 
400- Larger touch targets for mobile
401- Test appropriate keyboard types by field
402- Sticky submit button on mobile
403- Auto-focus first field on page load
404- Test form container styling (card vs. minimal)
405 
406---
407 
408## Questions to Ask
409 
410If you need more context:
4111. What's your current form completion rate?
4122. Do you have field-level analytics?
4133. What happens with the data after submission?
4144. Which fields are actually used in follow-up?
4155. Are there compliance/legal requirements?
4166. What's the mobile vs. desktop split?
417 
418---
419 
420## Related Skills
421 
422- **signup-flow-cro**: For account creation forms
423- **popup-cro**: For forms inside popups/modals
424- **page-cro**: For the page containing the form
425- **ab-test-setup**: For testing form changes
426 

Discussion