What is the best way to have a "Blank State" for sliders?
We're using sliders on in a survey which requires users to answer all of the questions. But how can we tell if the slider has been answered when the default state is also a valid answer?
3 Answers
You could change the color of the bar to green on the questions that the user has answered/interacted with. In other words, even if the answer of the user is the current state of the slider when the user touches the slider it changes to green to indicate that was their answer.
answered Apr 17, 2017 at 17:28
-
Related methods would be to have a "touched" state for the slider O itself (filling it with a darker color or border potentially) once the user has interacted with it or filling the Strongly Disagree / Agree text with a darker color. Apr 17, 2017 at 18:22
-
Ended up going with this solution. Another positive is that it gives a higher level of affordance in seeing with questions you've interacted with. I liked it so much I added a similar state to our multiple choice UI as well. image screenshot. Apr 25, 2017 at 14:11
You can make an explicit "Blank State" option as default - this will not distort survey results. Some example found in google images:
Unfortunately, I don't believe there is a way to tell if the question has "been answered". From a technical perspective, you could check if the element has been selected at any point, implying there was some degree of user input, but the user may not interact with the slider if they feel neutrally.
Personally, I would reconsider the "progress tracking". The user can choose to submit the data when they have completed and aside from incomplete / complete, I'm not sure why you would need to track the user's state.
EDIT:
If tracking progress is absolutely necessary, I would consider making a new type of slider that does not have a default at all. This would simply be a slider track where the thumb is created when the user interacts with it.
answered Apr 17, 2017 at 15:00
