Before the quote.Carry the
useful details forward.

01 / FIELD NOTESThe questions a quote needs are not a quote

Preparing a quote and calculating one are different jobs. North Creek handles the first: four steps collect the details, with the package choice carried into the form. The documented implementation does not include a pricing formula or generated quote.

The confirmation has a separate limit. It is a front-end screen, not a connected delivery path. Completing the flow does not send the details to the photographer.

02 / FIELD NOTESFour steps, one validation function

The source validates the current step before allowing the flow to advance:

const isStepValid = () => {
  switch (step) {
    case 1:
      return formData.shootType !== '';
    case 2:
      return isFlexibleDate || formData.date !== '';
    case 3:
      return formData.location.trim().length > 2;
    case 4:
      return (
        formData.name.trim().length > 1 &&
        /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(formData.email) &&
        formData.phone.trim().length > 6
      );
    default:
      return false;
  }
};

The first step requires a nonempty shoot type. The date step allows either a date or the flexible-date option. The location step checks trimmed length. The contact step combines a name-length check, an email pattern and a phone-length check.

shootType: ""

shootType !== ''

This inspector evaluates the published conditions against fixed examples. A phone string containing seven letters passes the length condition; that does not make it a usable phone number. Similarly, the date branch shown checks whether a value is nonempty, not whether the photographer is available.

This is the validation function shown in the article. Any additional browser constraints would need to be checked against the input components themselves.

03 / FIELD NOTESDon't ask for the same choice twice

The original page has three packages with visible sample price labels. Clicking one opens the enquiry with the shoot type preselected, so the visitor can move straight to the date.

That gives the pricing section and the form a shared piece of context. It also preserves a way back: the new local explanation on the project page lets a reader revise the type without losing the rest of the sample answers.

“I'm flexible” handles a different kind of uncertainty. A visitor may know the kind of session they need before they know its date. The source treats that as an explicit answer rather than requiring a made-up date to continue.

04 / FIELD NOTESThe portfolio still matters

The original design uses a warm paper background, Cormorant Garamond headings and a filterable masonry grid of twelve images with a lightbox. The guided enquiry complements that image-led presentation; it is not intended to replace it with a form-first homepage.

No original photos or full-resolution capture were supplied with this reference. The case-study illustrations therefore explain the sequence instead of pretending to display the photographer's real work.

05 / FIELD NOTESWhere this version stops

The original improvement list is short and concrete. The confirmation is front-end-only; a Worker endpoint and email notification are the missing delivery path. The twelve portfolio images load eagerly; the source identifies lazy-loading as the next step before expanding to a much larger collection.

There is no conversion experiment in the account and no delivered-enquiry evidence to add here. The useful result is the interaction itself: package context carried forward, a flexible date, step-by-step checks, and a clearer set of details for the eventual conversation.