0

I have a medical app showing 3 input fields for drug dosage calculation. The middle field has 2 options, either to input the number of drug's ampules (as shown in the image), or to input thenumber of drug's milligrams. My current approach is to make the user click on the word "Ampules" to change it to "Milligrams", however the small arrow doesn't seem to be an enough indicator that this is possible. Besides, I'm considering to add a tooltip at the first run of the app as a tutorial for such behaviour. Can any one recommend me a better approach ?

screenshot

  • Not related to the question but the design, is it just me or is there meant to be a button that triggers the calculation to be performed? – Michael Lai Feb 24 at 22:51
  • It's unclear: is the vertical purple bar some kind of cursor for input? It's a little hard to see what's going on. – Mike M Feb 25 at 1:30
  • @MichaelLai it's automatically calculated once the user begins to type any number. – Bialy Feb 25 at 8:27
  • @MikeM yes it's the default text input with material design and the vertical line is the cursor. – Bialy Feb 25 at 8:28
1

When you're dealing with Critical information like Drug doses, it's much better to be absolutely clear about the input. Generally, offscreen choices in a dropdown aren't great Luke W | Dropdowns Should be the UI of Last Resort.

Your current design with the subtle treatment of the Ampules/Milligrams is frankly, a little scary. I would HATE to have someone mis-dosed due to confusion. What you have here is MODALITY of the input entry, where altering a value somewhere else changes how the control works.

A simple example of modality is with an "Accelerator pedal". Most of the time, the accelerator pedal makes you go forwards, but when in "Reverse mode" you can go backwards. Since this modality could lead to accidents, vehicles try to make sure that the Reverse modality is SUPER clear - by having an indicator light on the dash.

In your example, assuming that the user can CHOOSE to populate any of the 3 inputs and then end up with the other 2 inputs populated by the entry, I would place the modality in a much more prominent area and make the user make a much earlier decision about the modality.

enter image description here

I'd also recommend pushing the "search" tool to a different screen - you're on Android, so use the back button to break up your app and make it easier to see only the necessary information on the screen.

0

You need to show two options (ampules vs. milligrams) and you need the user to pause and make a choice (not overlook either, because as another user said, the wrong setting could have serious consequences).

This is a better use case for radio buttons, especially those that are fortified with extra visual indicators. Here's an example.

enter image description here

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.