2

I am working with a project that has a very long form (about 72 different input fields). And I am struggling with the best way to implement a user friendly design.

I have grouped and chunked the inputs into 4 different panels and I am using a progress bar to show user progress.

My problem is navigating between each panel, I feel as though having a toggle type animation would be best here where the previous form toggle away, and the next form toggles in. But I am unsure of speed or transition types.

Currently, I like the look of swing transition with 600ms. But I am a complete novice to UX so I am not confident in my choice. I am also unable to find any UX design material that clearly states what type of transition or behavior would be good to use in this use case.

Any insight from an expert would be appreciated. Heck even a decent article would be appreciated.

  • Would the form behave as a web-form or is it specific to a mobile interface? – William Gilbert Nov 10 '17 at 7:22
  • Web and for some reason I need to say more than that to post a comment. – Callat Nov 10 '17 at 7:24
  • What is the form for? Is it for sign-up or a product request/service funnel? The strategy depends on the purpose of the form (conversion is heavily impacted). – Wanda Nov 10 '17 at 11:03
  • It's for data formatting. The user fills out the fields and gets an XML configuration file back with the fields as parameters. – Callat Nov 10 '17 at 14:48
1

I have just created a basic structure so that you can get the idea of how to structure long forms: You can follow this approach to break down your form or let me know if you find problems with this solution.

Also place a "SAVE" button, so that user can save his progress if he decides to move out of the process.

enter image description here Here is the same view for the mobile. Floating and scrollable pills on the top for the number of sections. Other things remain same.

enter image description here

Hope this helps :)

1

Try using sessions; break the forms to multiple pages and then get the ip address for user, then assign a session to each ip registered. Then out put the XML according to session alive with the ip address.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.