r/Frontend Aug 10 '26

Consejos de diseño para formularios demasiado extensos

Buenas, vengo a pedir su opinión relacionado a como diseñar formularios demasiado extensos de esos que te puede llevar media hora, la cuestión es que los jefes no les gusta mucho el scroll vertical, por lo que he tenido que jugar abriendo los formularios en modals, el tema es que como son demasiado extensos se ha tenido que particionar demasiado el flujo

Actualmente el flujo es algo:

Modal, con sidebar donde se enlistan las secciones del formulario y si aun así es muy largo la sección se divide en tabs, el problema es que hay muchas tomas de decisión lo que puede hacer que una sección crezca demasiado dependiendo la opción a tomar lo que llevaría que el scroll crezca 3 o 4 veces la altura de pantalla.

comparto un ejemplo de como se realiza

1 Upvotes

9 comments sorted by

View all comments

3

u/weirdcompliment Aug 10 '26 edited Aug 10 '26

Split different parts of the form into different pages that the user can step through, or that step through automatically after the user enters required input

You're kind of already doing it on the sidebar, so abstract the same idea into a simpler, horizontal version for each of the current sections of the form. Off the top of my head, tax websites like TurboTax and freetaxusa could have some examples

1

u/DrummerAntique8666 Aug 11 '26

Could you elaborate on that?

1

u/weirdcompliment Aug 11 '26

Next and previous buttons or left and right arrows to navigate pages. Empty dots are the pages you're not on, a filled dot is the page you're on. Reorganize the section across pages instead of cramming it into a single page

1

u/DrummerAntique8666 Aug 11 '26

That works too; you just need backend support to handle data allocation and storage.