Multi-step form

Ask us anything How do I?
1

Hey, looking to create a multi step form in weweb.io. What would be the best way to go on about this, several pages for each step ? or rather conditional display of each step on the same page?

Also how could i add some nice little animation (slide and opacity for instance) between the different steps of the form ?

Thanks in advance

2

I think this is very much a design preference question. It depends on the type of workflow the typical user would go through when filling the form.

I personally like designs where the user is guided through different screens that represent steps on an horizontal timeline (think tabs), with centered and responsive content. The most important part really is guiding the user and not dumping them in a huge vertical form all at once.

I think you could use different states with transitions

1 Like
3

Hey gbeaudoin, thanks for your answer :slight_smile:

Ended up doing everything on the same page and works great :slight_smile:

Cheers

1 Like
4

Hey @jivdbroe ,

Would you mind sharing a link to your form? I’m curious what it looks like because I have the same topic right now :slight_smile:

Cheers

5

Hey! a bit of a late response, but have you figured out the multi-step form? How did you go about doing it?

6

Hey,

Having done both recently, my preference goes for One Page / Step rather than a multiple step form.

Why? For the following reason

  • Debugging is easier
  • Tracking (pageview based) is a no-brainer
  • It’s more structuring from a logic flow point of view

I think it’s a matter of habit and there are pros to do multistep form I guess. But to me, One page / step stays the best solution.

7

The solution is then a a flow control using states?