About this block

Process And Form pairs the inquiry form with a numbered outline of what happens after the message is sent. The left column carries the heading, What happens when you write, a short lede about the first two weeks, and a three-row ruled list: I reply within two business days, we talk for thirty minutes, you get a written proposal. The right column holds a name, email, and message form with a Start the process button and a line saying step one begins the moment you hit send.

Steps are one const array rendered as a bordered ol. Showing the whole path before the form is the distinctive choice, a visitor knows the reply, the call, and the proposal are coming before they commit to writing.

When to use

Reach for this block as the contact section when the worry is that a message vanishes into a void. It suits any freelancer or studio with a real intake process to describe. The installer swaps the three step titles and details to match their own reply time, call length, and proposal turnaround.

A natural flow around it on a Portfolio Pro page:

Before

• Process steps
• Services list

After

• Footer

What you can display

One strong use is the solo designer who wants to set expectations before the first email. Other configurations:

• Two-step process. Drop the middle row for practices that go straight from message to proposal.
• Discovery deposit. Reword step three to name a paid discovery phase before the full proposal.
• Async intake. Replace the call step with a written questionnaire for teams that prefer not to meet first.

Tip: the line that step one begins the moment you hit send reframes the form as the start of the work, not a gate in front of it.