2

History:

My client have a form to create service and this form have a field to upload multiple pdf files. These files are stored on google cloud storage and the server is a google cloud app engine, so we can not upload the files through the app engine. We have to upload the files direct from the frontend using a signed url because app engine have a restriction for larger files.

What I have done:

  1. The user creates the service without uploading any file.
  2. If the service needs to have pdf file(s), the user have to go to the service edit form.
  3. At the end of the service edit form, it has another form only for the files.

The problem:

Now the edit form have two save buttons, one for the form data and one for the files intent to upload.

All of this does not feel right, so I would like to know how can I give my client a better UX in this form.

The Form:

enter image description here

Improve this question
2
  • Which aspects of the workflow do you feel is not right? I think if you have some reason why this is the case, you should include it in your question so we can also help address any concerns that you or your client might have. Thanks.
    – Michael Lai ♦
    May 17, 2020 at 23:23
  • 1
    @MichaelLai I just attached an image of the form, as you can see it has two buttons one for save the form and another for save the documents, but I don't feel that the place of the save files form is the right place, I feel very unconfortable with this solution.
    – Jean
    May 18, 2020 at 6:23

2 Answers 2

Reset to default
3

I don't think I fully understand the question here but I'll try my best to answer, and please correct me if I misunderstood or said something false.

Case 1:

User has all the fields available from the start and has the option to not fill all of them (such as uploading the files). So we have the required/non-required fields and the user can "skip" the file upload and simply save. Whenever they need to edit, the same conditions apply.

enter image description here

Case 2:

The user has to fill the form first and then if there is a file needed they will be asked to upload. In that case I would recommend to have the file field hidden completely. Only the form first (see Image 1) and once they click save, the system then authenticates and checks and sees if there's a need to upload a file, if yes then that field will be visible again right under it (see Image 2), and in both cases only having one save button.

Image 1

Image 1

Image 2

enter image description here

Conclusion

In all cases anyway I think it would be better to add the required fields since it can be a visual indicator and helper for quicker filling (if in your case it's possible)

Note: I do apologize in advance if I've removed any words that were important in the images while cropping etc since I don't understand the language, but I hope the concepts are visi

Improve this answer
2

Well I guess you can show the uploaded file as a list, which will allow user to upload multiple files that they can remove if they want. Maybe something like below images.

enter image description here

enter image description here

Improve this answer
2
  • Thank you for your answer, I just attached a image of the form, as you can see I have a similar approach, but I don't know if I have to create this form in a separed page/section
    – Jean
    May 18, 2020 at 6:24
  • No why do you want to create in another section? It would increase the click (more steps from UX point of view). But yeah if it fails for some reason the image uploading just let the form add and then user can go upload images form update form which will be similar
    – Wahab Shah
    May 18, 2020 at 7:04

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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