What is the best way to set two rating value in a web based application?
I'm working on a web based application, so it will be used on desktop and mobile devices. The problem is, that I'm looking for the best way to make a user set their ratings to a goal (a baseline and a goal value). There are multiple solutions here, but it's important that the scale may vary from 1-5, 1-6, 1-10, etc...
Here is what I'm thinking about: (the screens only representing the type of rating, they are not the final designs)
I prefer the type 01, but with that the user can't see what the scale is. With type 02, if there is a larger scale (1-10), the numbers will have a lot smaller space and will be harder to select.
Is anybody have a better solution for this? Is there any other application with a similar UX?