I have a form where user can enter a quantity of Total Dissolved Solids (TDS), which is a number in the range of 30000-40000, OR a quantity called Specific Gravity a number order of 1.00 - 1.50.

Behind the scenes they are the very same thing, and there are formulas to convert one into the other. In some situations users are used to using one, in some, the other, usually depending on given source of data. It is in a way convenience measure to the user.

I want to design UX to where user can enter either, comfortably. How?

What I have now is below:

  • user enters TDS and it is considered to be TDS, leaving checkbox unchecked
  • user enters Specific Gravity into the TDS box, checks the box to indicate that the entered number should be interpreted as Specific Gravity


download bmml source – Wireframes created with Balsamiq Mockups

I think it's in some ways clever in how the same input box is reused, but then there is an inconsistency in labeling when you enter one quantity instead of the other.

Is there a way to make it better?

I can create two input boxes, but doing so will suggest to the user that both should be populated, when it is not the case, and will create confusion.

1 Answer 1


What I've seen in these situations is a dropdown list with the two options, with the default one selected.

enter image description here

  • 1
    In a way I can use this as a label, aka label where user has ability to change the label
    – Dennis
    Apr 3, 2017 at 16:37

Your Answer

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

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