2

I work on a mobile application. I want to display the document used by the client on his daily work.

enter image description here

I'm looking for a strategy that allows the client to use the interface as the same as it uses paper.

This is my solution:

enter image description here

The solution is to display the first row of the table as a form. When the user clicks the button at the top, another form will be displayed. The problem is that the user is not familiar with the document, and this strategy is far from that solution.

I am looking for another suggessions.

  • Check typeform.com on how they handle long and complicated forms. It is quite intuitive and very user friendly. – Socrates Kolios Sep 22 '17 at 9:20
1

You will not be able to directly translate your current form to mobile since you're dealing with a smaller screen estate. You'll need to condense the form to maximise usability and experience. One way to do that is to mimic the reading order your user would normally follow and represent it in a vertical manner.

Unfortunately I cannot read the form and I don't know what it's for, so I am not sure if I'm understanding the form properly... but this is what I'd do:

mockup

You can place a button underneath the last panel to add more panels with the same fields. Make sure to add an option to remove them as well if you do.

Essentially, translate anything that needs a short input or string (like names, dates) to an input field. Choice with multiple selected options to a checkbox, choice with only one option selected to a radio button. Cluster fields that belong together in panels. If your user needs to leave a longer remark, give them a bigger input box.

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.