We currently have a large form spread over 4-5 sections. One section can be repeated n times as it's a list of the users qualifications. Currently the best way I could think of to display their selection is in the included picture by adding a "Tag Summary" of each qualification. However it doesn't feel right to show it as tags, does anybody have any recommendations?

The picture shows how the form looks when the user has inputted 2 qualifications (one called "degree type" and the other "second degree")

enter image description here



What about a more traditional add-to-list pattern?

you could have an empty state (before any qualifications have been added)

add-to-list empty state

And this would be your 'add new' state (showing one item has already been added)

enter image description here

The 'Add' button would change to 'Save' and you'd have a 'Cancel' option too.

I think it's helpful to show added qualifications above your 'add' button so it's clearer that you're adding to that list.

Another thing that might help is to prioritize the most-important information on the page using color, contrast, grouping, etc. Your tags and buttons are visually similar, so there isn't a clear next step. For example, you might consider increasing the contrast between the degree type and the other degree information (course title, etc).

  • 1
    I like this, already looks much cleaner. I'll leave the question up until tomorrow and see if I get any other suggestions. If not I'll accept the answer – Sean T Aug 29 '18 at 18:39

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.