5

I'm designing a general form facility - so when a customer comes in and requires certain forms to be made, then our engineers have customizable tools to create a form for that customer. My design goal is that no matter what form our customers require, all forms will look consistent and follow the same patterns.

Problem: Are there existing examples or frameworks that allow the layout to be flexible? Just want to design to accommodate cases in which answer options can be very long, how to format the design consistently no matter the length of the content or answers.

A Question with radial options [] Radial Option [] Radial Option Long Name [] Radial Option Longer Name [] Radial Option [] Radial Option Long Name [] Radial Option Longer Name

A Question with manual entry [ enter value ] [ enter value ] [ enter value ]

One of our engineers used table matrices to automatically determine the number of columns required based on the number options / manual entry fields to show. Are there other ways to accomplish a flexible layout?

  • You might want to check out typeform.io, they seem to have this covered pretty well. – Michael Lai Jun 3 '15 at 4:40
  • Interesting, do you have other examples that also take into account data entry? – Melissa Acosta Jun 3 '15 at 17:27
3

This is a development issue more than a UX one. If you need to keep the text for each radio-buttons on a single line, without wrapping the label to the next line, this can be done. If you want to keep the options wrapped in boxes with a fixed width, this can be done too (the number of boxes in a row will be different for different resolutions). If you need a percentual width for each option (25% of the width of the row, but the number of options be variable), the same.

With a framework, a custom grid, with multiple classes added in HTML or just with CSS, this is a job that a developer can handle easily. I suggest you focus on design and UX.

0

You might want to do a search on the topic "Style guide" or "Living style guide".

There are a couple of frontend frameworks out there that you can use to achieve the same UI consistent look and get you started quickly. Bootstrap and Foundation are some of the more widely used frameworks. They are all customisable as well.

In my opinion using tables to layout your elements is a terrible idea. If you want flexibility in your layout, there are a few things you could take note:

  1. Avoid using absolute numbers in your layout
  2. Use a grid system

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.