Sunday, January 31, 2016

layout - How to organize a form with many fields?



Where I work, we have a system that has a screen with several fields. There are approximately 50 fields and all are important and should appear.


example of a screen with about 50 fields


//edited in gimp :D


Any suggestions on how to arrange the fields so that it does not look so ugly and complicated?



Answer



For the question's sake, let's assume all the fields are necessary. But it could be a problem of Information Architecture. Adressing it first could reduce the ammount of fields in the form and make it easier. Here is a good article on IA and web forms.


The most obvious "problem" with the form is the lack of rhythm and balance, in fact it is breaking most of the known design principles.


Notice how there are too many vertical lines. This could be fixed by using a grid, and even composing to a vertical rhythm, it would give order to the form.


enter image description here


Last but not least, you could make it into a multiple step form, so not all the fields are displayed at once. Here a Q&A explaining when to use each and here on how to indicate progress.



No comments:

Post a Comment

technique - How credible is wikipedia?

I understand that this question relates more to wikipedia than it does writing but... If I was going to use wikipedia for a source for a res...