I am creating an app using React and antd where users must enter information about cheese. I need an element to ask the user how aged their cheese is. The following options are possible:
I do not want the user to select 0 months to mean fresh, and mobile support must be possible. I know that a slider will not work because unknown does not appear. It also does not give the user control over time frame (months/years). I'd appreciate any suggestions.
I would say the best option is having a second field activated if the user selects the 'months' option or the years 'option'
They can then enter a custom value, or you can use a slider, whichever you feel is more appropriate.
If they select 'Unknown' or 'Fresh' that is all the input required
I think current problem is that 12 months aged cheese falls under 2 categories: 0-12 months and Fresh. To resolve this problem, you can modify current categories to make sure that users will clearly understand which category to choose depending on their cheese age. OP in the comments has mentioned that months are pretty important for the cheese age and due to that I'd recommend you having the same option menu with modified categories (unless user has to display other data in the same screen and option menu would take too much space, then you should consider using dropdown menu, but take in consideration that dropdown menu's aren't very UX friendly):
I put unknown as the last category on the list because I believe that lazier users will choose Unknown without putting any effort into finding out their cheese age. This is my personal opinion and of course would require some kind of user testing to be confirmed.
